Merge branch 'asf-site' of github.com:apache/incubator-echarts-website into asf-site
diff --git a/components/builder.html b/components/builder.html
index 612980f..ccffc65 100644
--- a/components/builder.html
+++ b/components/builder.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>在线定制</h1><p>可自由选择所需图表、坐标系、组件进行打包下载,并且可对渲染引擎、兼容及压缩问题进行设置</p><div class="download-version">(version: 4.9.0)</div></div></div><div class="page-content"><div id="configuration" class="container"><a href="builder.html" style="float: right">前往定制 4.x 版本</a><section id="charts"><h3>图表<span>chart</span></h3><p class="desc">选择要打包的图表<span class="warn">(注:开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示)</span></p><ul><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5>柱状图 <div>Bar</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5>折线图 <div>Line</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5>饼图 <div>Pie</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5>散点图 <div>Scatter</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5>涟漪散点图 <div>EffectScatter</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5>K线图 <div>Candlestick</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5>雷达图 <div>Radar</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5>热力图 <div>Heatmap</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5>树图 <div>Tree</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5>矩形树图 <div>Treemap</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5>旭日图 <div>Sunburst</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5>地图 <div>Map</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5>线图 <div>Lines</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5>关系图 <div>Graph</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5>箱线图 <div>Boxplot</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5>平行坐标 <div>Parallel</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5>仪表盘 <div>Gauge</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5>漏斗图 <div>Funnel</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5>桑基图 <div>Sankey</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5>主题河流图 <div>ThemeRiver</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5>象形柱图 <div>PictorialBar</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5>自定义系列 <div>Custom</div></h5></li></ul></section><section id="coords"><h3>坐标系<span>coordinate systems</span></h3><p class="desc">选择要打包的坐标系,有些图表像散点图,折线图可以被应用到多个坐标系上</p><ul><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5>直角坐标系 <div>Grid</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5>极坐标系 <div>Polar</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5>地理坐标系 <div>Geo</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5>单轴 <div>SingleAxis</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5>日历 <div>Calendar</div></h5></li></ul></section><section id="components"><h3>组件<span>component</span></h3><p class="desc">选择要打包的组件</p><ul><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5>标题 <div>Title</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5>图例 <div>Legend</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5>提示框 <div>Tooltip</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5>标注 <div>MarkPoint</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5>标线 <div>MarkLine</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5>标域 <div>MarkArea</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5>时间轴 <div>Timeline</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5>数据区域缩放 <div>DataZoom</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5>刷选 <div>Brush</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5>视觉映射 <div>VisualMap</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5>工具栏 <div>Toolbox</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5>自定义图形 <div>Graphic</div></h5></li></ul></section><section id="other"><h3>其它选项<span>others</span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG 渲染</label><p class="desc">是否包括 SVG 渲染器,从而能支持使用 SVG 来绘制图表</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">兼容 IE8</label><p class="desc">是否包括对 IE8 的兼容代码</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">工具集</label><p class="desc">是否在 echarts 对象上挂载常用工具集。一般都会挂载,除非对生成的文件的体积有苛求,并且不需要用这些工具集。</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">代码压缩</label><p class="desc">是否使用 UglifyJS 压缩后的代码,开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示。</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">下载</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script>function updateCheckbox() {
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>在线定制</h1><p>可自由选择所需图表、坐标系、组件进行打包下载,并且可对渲染引擎、兼容及压缩问题进行设置</p><div class="download-version">(version: 4.9.0)</div></div></div><div class="page-content"><div id="configuration" class="container"><a href="builder.html" style="float: right">前往定制 4.x 版本</a><section id="charts"><h3>图表<span>chart</span></h3><p class="desc">选择要打包的图表<span class="warn">(注:开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示)</span></p><ul><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5>柱状图 <div>Bar</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5>折线图 <div>Line</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5>饼图 <div>Pie</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5>散点图 <div>Scatter</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5>涟漪散点图 <div>EffectScatter</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5>K线图 <div>Candlestick</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5>雷达图 <div>Radar</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5>热力图 <div>Heatmap</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5>树图 <div>Tree</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5>矩形树图 <div>Treemap</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5>旭日图 <div>Sunburst</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5>地图 <div>Map</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5>线图 <div>Lines</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5>关系图 <div>Graph</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5>箱线图 <div>Boxplot</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5>平行坐标 <div>Parallel</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5>仪表盘 <div>Gauge</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5>漏斗图 <div>Funnel</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5>桑基图 <div>Sankey</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5>主题河流图 <div>ThemeRiver</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5>象形柱图 <div>PictorialBar</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5>自定义系列 <div>Custom</div></h5></li></ul></section><section id="coords"><h3>坐标系<span>coordinate systems</span></h3><p class="desc">选择要打包的坐标系,有些图表像散点图,折线图可以被应用到多个坐标系上</p><ul><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5>直角坐标系 <div>Grid</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5>极坐标系 <div>Polar</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5>地理坐标系 <div>Geo</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5>单轴 <div>SingleAxis</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5>日历 <div>Calendar</div></h5></li></ul></section><section id="components"><h3>组件<span>component</span></h3><p class="desc">选择要打包的组件</p><ul><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5>标题 <div>Title</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5>图例 <div>Legend</div></h5></li><li class="checked"><img src="https://echarts.apache.org/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5>提示框 <div>Tooltip</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5>标注 <div>MarkPoint</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5>标线 <div>MarkLine</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5>标域 <div>MarkArea</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5>时间轴 <div>Timeline</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5>数据区域缩放 <div>DataZoom</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5>刷选 <div>Brush</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5>视觉映射 <div>VisualMap</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5>工具栏 <div>Toolbox</div></h5></li><li><img src="https://echarts.apache.org/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5>自定义图形 <div>Graphic</div></h5></li></ul></section><section id="other"><h3>其它选项<span>others</span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG 渲染</label><p class="desc">是否包括 SVG 渲染器,从而能支持使用 SVG 来绘制图表</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">兼容 IE8</label><p class="desc">是否包括对 IE8 的兼容代码</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">工具集</label><p class="desc">是否在 echarts 对象上挂载常用工具集。一般都会挂载,除非对生成的文件的体积有苛求,并且不需要用这些工具集。</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">代码压缩</label><p class="desc">是否使用 UglifyJS 压缩后的代码,开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示。</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">下载</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script>function updateCheckbox() {
     $('#charts input, #components input, #coords input').each(function () {
         $(this).attr('checked', $(this).parent().hasClass('checked'));
     });
diff --git a/components/download.html b/components/download.html
index 9a80599..4dadda4 100644
--- a/components/download.html
+++ b/components/download.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>下载 - Apache ECharts (incubating)</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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>下载</h1></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">方法一:从下载的源代码或编译产物安装</h3><table id="download-table" class="table"><tr><th>版本</th><th>发布日期</th><th>从镜像网站下载源码</th><th>从 GitHub 下载编译产物</th></tr></table><div class="checksum"><p><strong>注意:</strong>如果从镜像网站下载,请检查 <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> 并且检验确认 <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> 与 <a href="https://www.apache.org">Apache 主站</a>的签名一致。链接在上面的 Source 旁。这个 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> 文件包含了用于签名发布版的公钥。如果可能的话,建议使用<a href="https://www.apache.org/dev/release-signing#web-of-trust">可信任的网络(web of trust)</a>确认 KEYS 的同一性。</p><h4>使用 GPG 验证 ECharts 发布版本</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.asc</li><li>下载 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a></li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>使用 SHA-512 验证</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.sha512</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) 基于 <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a> 发布</p></div><h3>方法二:从 npm 安装</h3><p><code>npm install echarts</code></p><h3>方法三:选择需要的模块,在线定制下载</h3><a href="builder3.html" class="btn btn-main btn-thirdary more-btn">在线定制</a><p class="center">可自由选择所需图表和组件进行打包下载</p><h3>下载后……</h3><p><a href="./tutorial.html">5 分钟上手 ECharts</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://echarts.apache.org/zh/js/download.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>下载</h1></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">方法一:从下载的源代码或编译产物安装</h3><table id="download-table" class="table"><tr><th>版本</th><th>发布日期</th><th>从镜像网站下载源码</th><th>从 GitHub 下载编译产物</th></tr></table><div class="checksum"><p><strong>注意:</strong>如果从镜像网站下载,请检查 <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> 并且检验确认 <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> 与 <a href="https://www.apache.org">Apache 主站</a>的签名一致。链接在上面的 Source 旁。这个 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> 文件包含了用于签名发布版的公钥。如果可能的话,建议使用<a href="https://www.apache.org/dev/release-signing#web-of-trust">可信任的网络(web of trust)</a>确认 KEYS 的同一性。</p><h4>使用 GPG 验证 ECharts 发布版本</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.asc</li><li>下载 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a></li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>使用 SHA-512 验证</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.sha512</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) 基于 <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a> 发布</p></div><h3>方法二:从 npm 安装</h3><p><code>npm install echarts</code></p><h3>方法三:选择需要的模块,在线定制下载</h3><a href="builder3.html" class="btn btn-main btn-thirdary more-btn">在线定制</a><p class="center">可自由选择所需图表和组件进行打包下载</p><h3>下载后……</h3><p><a href="./tutorial.html">5 分钟上手 ECharts</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://echarts.apache.org/zh/js/download.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
 
 //- $('.download-echarts').click(function (e) {
 //-     var el = document.createElement('div');
diff --git a/en/404.html b/en/404.html
index 9b5fcc1..c7bfff2 100644
--- a/en/404.html
+++ b/en/404.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"><div class="page-main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="not-found"><img src="https://echarts.apache.org/zh/images/404.png?_v_=20200710_1" alt="404"><div class="text">This is not the web page you are looking for.<a href="./index.html" class="link">Back to home</a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"><div class="page-main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="not-found"><img src="https://echarts.apache.org/zh/images/404.png?_v_=20200710_1" alt="404"><div class="text">This is not the web page you are looking for.<a href="./index.html" class="link">Back to home</a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/api.html b/en/api.html
index 792566e..264ebc9 100644
--- a/en/api.html
+++ b/en/api.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/api-parts',
     docType: 'api',
@@ -19,7 +19,7 @@
 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">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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.html b/en/builder.html
index 96cfcff..5cc9574 100644
--- a/en/builder.html
+++ b/en/builder.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>ECharts Online Builder</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>Online Builder</h1><p>Pack and download the needed charts, coordinates or components<br>with the appropriate settings about rendering engine, compatibility and compression.</p><div class="download-version">(version: 4.9.0)</div></div></div><div class="page-content"><div id="configuration" class="container"><section id="charts"><h3>Chart<span></span></h3><p class="desc">Select the charts needed to be packed<br><span class="warn">(The warnings and hints will not be printed on the browser console if using "Code Compression")</span></p><ul><li class="checked"><img src="https://echarts.apache.org/en/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5> <div>Bar</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5> <div>Line</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5> <div>Pie</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5> <div>Scatter</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5> <div>EffectScatter</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5> <div>Candlestick</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5> <div>Radar</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5> <div>Heatmap</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5> <div>Tree</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5> <div>Treemap</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5> <div>Sunburst</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5> <div>Map</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5> <div>Lines</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5> <div>Graph</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5> <div>Boxplot</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5> <div>Parallel</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5> <div>Gauge</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5> <div>Funnel</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5> <div>Sankey</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5> <div>ThemeRiver</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5> <div>PictorialBar</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5> <div>Custom</div></h5></li></ul></section><section id="coords"><h3>Coordinate Systems<span></span></h3><p class="desc">Select coordinate systems needed to be packed. Some of the charts like "scatter", "line", "graph", "custom" can layout on multiple coordiante systems.</p><ul><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5> <div>Grid</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5> <div>Polar</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5> <div>Geo</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5> <div>SingleAxis</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5> <div>Calendar</div></h5></li></ul></section><section id="components"><h3>Component<span></span></h3><p class="desc">Select components needed to be packed.</p><ul><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5> <div>Title</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5> <div>Legend</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5> <div>Tooltip</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5> <div>MarkPoint</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5> <div>MarkLine</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5> <div>MarkArea</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5> <div>Timeline</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5> <div>DataZoom</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5> <div>Brush</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5> <div>VisualMap</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5> <div>Toolbox</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5> <div>Graphic</div></h5></li></ul></section><section id="other"><h3>Others<span></span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG Renderer</label><p class="desc">Whether to include the SVG Renderer, which enables rendering based on SVG.</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">Available on IE8 (VML Renderer)</label><p class="desc">Whether to include the VML Renderer to support rendering on IE8.</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">Utilities</label><p class="desc">Whether to mount utilities on the echarts namespace. Utilities are usually included, unless requiring minimum bundle size and not need them.</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">Code Compression</label><p class="desc">Whether to Compress code. It is recommended not to compress code in the development environment, because warnings and hints will be removed after compressing.</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">Download</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script>function updateCheckbox() {
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>Online Builder</h1><p>Pack and download the needed charts, coordinates or components<br>with the appropriate settings about rendering engine, compatibility and compression.</p><div class="download-version">(version: 4.9.0)</div></div></div><div class="page-content"><div id="configuration" class="container"><section id="charts"><h3>Chart<span></span></h3><p class="desc">Select the charts needed to be packed<br><span class="warn">(The warnings and hints will not be printed on the browser console if using "Code Compression")</span></p><ul><li class="checked"><img src="https://echarts.apache.org/en/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5> <div>Bar</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5> <div>Line</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5> <div>Pie</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5> <div>Scatter</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5> <div>EffectScatter</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5> <div>Candlestick</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5> <div>Radar</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5> <div>Heatmap</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5> <div>Tree</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5> <div>Treemap</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5> <div>Sunburst</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5> <div>Map</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5> <div>Lines</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5> <div>Graph</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5> <div>Boxplot</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5> <div>Parallel</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5> <div>Gauge</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5> <div>Funnel</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5> <div>Sankey</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5> <div>ThemeRiver</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5> <div>PictorialBar</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5> <div>Custom</div></h5></li></ul></section><section id="coords"><h3>Coordinate Systems<span></span></h3><p class="desc">Select coordinate systems needed to be packed. Some of the charts like "scatter", "line", "graph", "custom" can layout on multiple coordiante systems.</p><ul><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5> <div>Grid</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5> <div>Polar</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5> <div>Geo</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5> <div>SingleAxis</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5> <div>Calendar</div></h5></li></ul></section><section id="components"><h3>Component<span></span></h3><p class="desc">Select components needed to be packed.</p><ul><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5> <div>Title</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5> <div>Legend</div></h5></li><li class="checked"><img src="https://echarts.apache.org/en/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5> <div>Tooltip</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5> <div>MarkPoint</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5> <div>MarkLine</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5> <div>MarkArea</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5> <div>Timeline</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5> <div>DataZoom</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5> <div>Brush</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5> <div>VisualMap</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5> <div>Toolbox</div></h5></li><li><img src="https://echarts.apache.org/en/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5> <div>Graphic</div></h5></li></ul></section><section id="other"><h3>Others<span></span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG Renderer</label><p class="desc">Whether to include the SVG Renderer, which enables rendering based on SVG.</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">Available on IE8 (VML Renderer)</label><p class="desc">Whether to include the VML Renderer to support rendering on IE8.</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">Utilities</label><p class="desc">Whether to mount utilities on the echarts namespace. Utilities are usually included, unless requiring minimum bundle size and not need them.</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">Code Compression</label><p class="desc">Whether to Compress code. It is recommended not to compress code in the development environment, because warnings and hints will be removed after compressing.</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">Download</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script>function updateCheckbox() {
     $('#charts input, #components input, #coords input').each(function () {
         $(this).attr('checked', $(this).parent().hasClass('checked'));
     });
diff --git a/en/builder/echarts.html b/en/builder/echarts.html
index 1e7d04a..91ec95b 100644
--- a/en/builder/echarts.html
+++ b/en/builder/echarts.html
@@ -56,7 +56,7 @@
                 'esprima': 'lib/esprima',
                 'estraverse': 'lib/estraverse'
             },
-            urlArgs: 'v=1598903776431'
+            urlArgs: 'v=1603774175523'
         });
 
         require(['build']);
diff --git a/en/changelog.html b/en/changelog.html
index 7466cfb..8e25440 100644
--- a/en/changelog.html
+++ b/en/changelog.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -1347,7 +1347,7 @@
 <ul>
 <li>The new echarts</li>
 </ul>
-<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
+<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
 
 // Fix scroll position covered by nav
 window.addEventListener('hashchange', function() {
diff --git a/en/cheat-sheet.html b/en/cheat-sheet.html
index 30d0ea7..99b115f 100644
--- a/en/cheat-sheet.html
+++ b/en/cheat-sheet.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,8 +7,8 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Cheat Sheet - Apache ECharts (incubating)</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Cheat Sheet</h1><p>Learn the component names quickly.</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content container page-cheatsheet"><h2>Frequently-used Components</h2><div id="cheat-chart-container"><div class="row"><div class="col-lg-9"><div id="cheat-chart"></div></div><div class="col-lg-3"><div id="cheat-detail"></div></div></div></div><h2>Series</h2><ul><li class="cheat-chart-item"><a href="option.html#series-bar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><h5><div>Bar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/line.svg?_v_=20200710_1" alt=""><h5><div>Line</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pie" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><h5><div>Pie</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-scatter" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><h5><div>Scatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-effectScatter" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><h5><div>EffectScatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-candlestick" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><h5><div>Candlestick</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-radar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><h5><div>Radar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-heatmap" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><h5><div>Heatmap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-tree" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><h5><div>Tree</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-treemap" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><h5><div>Treemap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sunburst" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><h5><div>Sunburst</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-map" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/map.svg?_v_=20200710_1" alt=""><h5><div>Map</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-lines" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><h5><div>Lines</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-graph" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><h5><div>Graph</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-boxplot" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><h5><div>Boxplot</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-parallel" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><h5><div>Parallel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-gauge" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><h5><div>Gauge</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-funnel" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><h5><div>Funnel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sankey" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><h5><div>Sankey</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-themeRiver" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><h5><div>ThemeRiver</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pictorialBar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><h5><div>PictorialBar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-custom" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><h5><div>Custom</div></h5></a></li></ul><h2>Coordinates</h2><ul><li class="cheat-chart-item"><a href="option.html#grid" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><h5><div>Grid</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#polar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/polar.svg?_v_=20200710_1" alt=""><h5><div>Polar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#geo" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/geo.svg?_v_=20200710_1" alt=""><h5><div>Geo</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#singleAxis" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><h5><div>SingleAxis</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#calendar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><h5><div>Calendar</div></h5></a></li></ul><h2>Components</h2><ul><li class="cheat-chart-item"><a href="option.html#title" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/title.svg?_v_=20200710_1" alt=""><h5><div>Title</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#legend" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/legend.svg?_v_=20200710_1" alt=""><h5><div>Legend</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#tooltip" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><h5><div>Tooltip</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markPoint" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><h5><div>MarkPoint</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markLine" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><h5><div>MarkLine</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markArea" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><h5><div>MarkArea</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#timeline" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><h5><div>Timeline</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#dataZoom" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><h5><div>DataZoom</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#brush" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/brush.svg?_v_=20200710_1" alt=""><h5><div>Brush</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#visualMap" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><h5><div>VisualMap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#toolbox" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><h5><div>Toolbox</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#graphic" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><h5><div>Graphic</div></h5></a></li></ul></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
-</script><script src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js"></script><script src="https://echarts.apache.org/en/js/cheat-sheet-en.js?_v_=1598903776431"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Cheat Sheet</h1><p>Learn the component names quickly.</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content container page-cheatsheet"><h2>Frequently-used Components</h2><div id="cheat-chart-container"><div class="row"><div class="col-lg-9"><div id="cheat-chart"></div></div><div class="col-lg-3"><div id="cheat-detail"></div></div></div></div><h2>Series</h2><ul><li class="cheat-chart-item"><a href="option.html#series-bar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><h5><div>Bar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/line.svg?_v_=20200710_1" alt=""><h5><div>Line</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pie" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><h5><div>Pie</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-scatter" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><h5><div>Scatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-effectScatter" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><h5><div>EffectScatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-candlestick" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><h5><div>Candlestick</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-radar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><h5><div>Radar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-heatmap" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><h5><div>Heatmap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-tree" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><h5><div>Tree</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-treemap" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><h5><div>Treemap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sunburst" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><h5><div>Sunburst</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-map" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/map.svg?_v_=20200710_1" alt=""><h5><div>Map</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-lines" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><h5><div>Lines</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-graph" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><h5><div>Graph</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-boxplot" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><h5><div>Boxplot</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-parallel" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><h5><div>Parallel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-gauge" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><h5><div>Gauge</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-funnel" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><h5><div>Funnel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sankey" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><h5><div>Sankey</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-themeRiver" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><h5><div>ThemeRiver</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pictorialBar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><h5><div>PictorialBar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-custom" target="_blank"><img src="https://echarts.apache.org/en/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><h5><div>Custom</div></h5></a></li></ul><h2>Coordinates</h2><ul><li class="cheat-chart-item"><a href="option.html#grid" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><h5><div>Grid</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#polar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/polar.svg?_v_=20200710_1" alt=""><h5><div>Polar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#geo" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/geo.svg?_v_=20200710_1" alt=""><h5><div>Geo</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#singleAxis" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><h5><div>SingleAxis</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#calendar" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><h5><div>Calendar</div></h5></a></li></ul><h2>Components</h2><ul><li class="cheat-chart-item"><a href="option.html#title" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/title.svg?_v_=20200710_1" alt=""><h5><div>Title</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#legend" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/legend.svg?_v_=20200710_1" alt=""><h5><div>Legend</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#tooltip" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><h5><div>Tooltip</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markPoint" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><h5><div>MarkPoint</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markLine" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><h5><div>MarkLine</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markArea" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><h5><div>MarkArea</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#timeline" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><h5><div>Timeline</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#dataZoom" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><h5><div>DataZoom</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#brush" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/brush.svg?_v_=20200710_1" alt=""><h5><div>Brush</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#visualMap" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><h5><div>VisualMap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#toolbox" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><h5><div>Toolbox</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#graphic" target="_blank"><img src="https://echarts.apache.org/en/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><h5><div>Graphic</div></h5></a></li></ul></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
+</script><script src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js"></script><script src="https://echarts.apache.org/en/js/cheat-sheet-en.js?_v_=1603774175523"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/coding-standard.html b/en/coding-standard.html
index c24b469..bbc3418 100644
--- a/en/coding-standard.html
+++ b/en/coding-standard.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -574,7 +574,7 @@
 <p><strong>[MUST]</strong> Do not use <code>for in</code> in array traverse.</p>
 <h3 id="others">Others</h3>
 <p><strong>[MUST]</strong> Do not use <code>eval</code> and <code>with</code>. <code>new Function</code> can be used.</p>
-<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';
+<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';
 
 var $list = $('#standard-nav');
 $('.page-detail h2, .page-detail h3, .page-detail h4')
diff --git a/en/committers.html b/en/committers.html
index 3ec3e05..b3b5b11 100644
--- a/en/committers.html
+++ b/en/committers.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Committers - Apache ECharts (incubating)</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Thanks for Helping</h1><p>The development of ECharts is associated with the outstanding contributions from the people in the community,<br>who have different skills and come from different backgrounds.</p><p>Thank you all your help!</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="about-page"><section class="container contributor"><h4 class="group mentors"> Apache Mentors</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/dave.jpg?_v_=20200710_1"><h5 class="about-name">Dave Fisher</h5><div class="about-desc">San Francisco, US</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/kevin.jpg?_v_=20200710_1"><h5 class="about-name">Kevin A. McGrail</h5><div class="about-desc">Washington, US</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/shengwu.jpg?_v_=20200710_1"><h5 class="about-name">Sheng Wu</h5><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/tedliu.jpg?_v_=20200710_1"><h5 class="about-name">Ted Liu</h5><div class="about-desc">Beijing, China</div></div></div></div><h4 class="group code">PPMC</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/pissang" target="_blank"><img src="https://echarts.apache.org/en/images/people/沈毅.jpg?_v_=20200710_1"></a><h5 class="about-name">Yi Shen</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/100pah" target="_blank"><img src="https://echarts.apache.org/en/images/people/宿爽.jpg?_v_=20200710_1"></a><h5 class="about-name">Shuang Su</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/Ovilia" target="_blank"><img src="https://echarts.apache.org/en/images/people/羡辙.jpg?_v_=20200710_1"></a><h5 class="about-name">Ovilia</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/deqingli" target="_blank"><img src="https://echarts.apache.org/en/images/people/德清.jpg?_v_=20200710_1"></a><h5 class="about-name">Deqing Li</h5><div class="about-desc">Alibaba</div><div class="about-desc">Hangzhou, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://www.behance.net/wjtjiayouac8aa" target="_blank"><img src="https://echarts.apache.org/en/images/people/王俊婷.jpg?_v_=20200710_1"></a><h5 class="about-name">Junting Wang</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/kener" target="_blank"><img src="https://echarts.apache.org/en/images/people/林峰.jpg?_v_=20200710_1"></a><h5 class="about-name">Feng Lin</h5><div class="about-desc">Alibaba</div><div class="about-desc">Hangzhou, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/erik168" target="_blank"><img src="https://echarts.apache.org/en/images/people/erik.jpg?_v_=20200710_1"></a><h5 class="about-name">Erik</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chriswong" target="_blank"><img src="https://echarts.apache.org/en/images/people/大佛.jpg?_v_=20200710_1"></a><h5 class="about-name">Houjin Huang</h5><div class="about-desc">GSX</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/susiwen8" target="_blank"><img src="https://echarts.apache.org/en/images/people/苏思文.jpg?_v_=20200710_1"></a><h5 class="about-name">Siwen Su</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/plainheart" target="_blank"><img src="https://echarts.apache.org/en/images/people/plainheart.jpg"></a><h5 class="about-name">Zhongxiang Wang</h5><div class="about-desc">Henan, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/wf123537200" target="_blank"><img src="https://echarts.apache.org/en/images/people/zakwu.jpg?_v_=20200710_1"></a><h5 class="about-name">Zak Wu</h5><div class="about-desc">Tencent</div><div class="about-desc">Shenzhen, China</div></div></div></div><h4 class="group code">Committers</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/cuijian-dexter" target="_blank"><img src="https://echarts.apache.org/en/images/people/崔健.jpg?_v_=20200710_1"></a><h5 class="about-name">Jian Cui</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/ClemMakesApps" target="_blank"><img src="https://echarts.apache.org/en/images/people/clement.jpg?_v_=20200710_1"></a><h5 class="about-name">Clement Ho</h5><div class="about-desc">GitLab</div><div class="about-desc">Texas, US</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/yufeng04" target="_blank"><img src="https://echarts.apache.org/en/images/people/禹峰.jpg?_v_=20200710_1"></a><h5 class="about-name">Feng Yu</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/SnailSword" target="_blank"><img src="https://echarts.apache.org/en/images/people/韩天.jpg?_v_=20200710_1"></a><h5 class="about-name">Tian Han</h5><div class="about-desc">Student</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/alex2wong" target="_blank"><img src="https://echarts.apache.org/en/images/people/黄益修.jpg?_v_=20200710_1"></a><h5 class="about-name">Yixiu Huang</h5><div class="about-desc">ByteDance</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chfw" target="_blank"><img src="https://echarts.apache.org/en/images/people/chfw.jpg?_v_=20200710_1"></a><h5 class="about-name">chfw</h5><div class="about-desc">UK</div></div></div></div><h4 class="group contributor">Contributors</h4><div class="row"><p></p><p>Thanks to all the <a href="https://github.com/apache/incubator-echarts/graphs/contributors">CONTRIBUTORS</a> <br /> making their effort to help ECharts getting better.</p></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Thanks for Helping</h1><p>The development of ECharts is associated with the outstanding contributions from the people in the community,<br>who have different skills and come from different backgrounds.</p><p>Thank you all your help!</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="about-page"><section class="container contributor"><h4 class="group mentors"> Apache Mentors</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/dave.jpg?_v_=20200710_1"><h5 class="about-name">Dave Fisher</h5><div class="about-desc">San Francisco, US</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/kevin.jpg?_v_=20200710_1"><h5 class="about-name">Kevin A. McGrail</h5><div class="about-desc">Washington, US</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/shengwu.jpg?_v_=20200710_1"><h5 class="about-name">Sheng Wu</h5><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts.apache.org/en/images/people/tedliu.jpg?_v_=20200710_1"><h5 class="about-name">Ted Liu</h5><div class="about-desc">Beijing, China</div></div></div></div><h4 class="group code">PPMC</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/pissang" target="_blank"><img src="https://echarts.apache.org/en/images/people/沈毅.jpg?_v_=20200710_1"></a><h5 class="about-name">Yi Shen</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/100pah" target="_blank"><img src="https://echarts.apache.org/en/images/people/宿爽.jpg?_v_=20200710_1"></a><h5 class="about-name">Shuang Su</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/Ovilia" target="_blank"><img src="https://echarts.apache.org/en/images/people/羡辙.jpg?_v_=20200710_1"></a><h5 class="about-name">Ovilia</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/deqingli" target="_blank"><img src="https://echarts.apache.org/en/images/people/德清.jpg?_v_=20200710_1"></a><h5 class="about-name">Deqing Li</h5><div class="about-desc">Alibaba</div><div class="about-desc">Hangzhou, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://www.behance.net/wjtjiayouac8aa" target="_blank"><img src="https://echarts.apache.org/en/images/people/王俊婷.jpg?_v_=20200710_1"></a><h5 class="about-name">Junting Wang</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/kener" target="_blank"><img src="https://echarts.apache.org/en/images/people/林峰.jpg?_v_=20200710_1"></a><h5 class="about-name">Feng Lin</h5><div class="about-desc">Alibaba</div><div class="about-desc">Hangzhou, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/erik168" target="_blank"><img src="https://echarts.apache.org/en/images/people/erik.jpg?_v_=20200710_1"></a><h5 class="about-name">Erik</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chriswong" target="_blank"><img src="https://echarts.apache.org/en/images/people/大佛.jpg?_v_=20200710_1"></a><h5 class="about-name">Houjin Huang</h5><div class="about-desc">GSX</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/susiwen8" target="_blank"><img src="https://echarts.apache.org/en/images/people/苏思文.jpg?_v_=20200710_1"></a><h5 class="about-name">Siwen Su</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/plainheart" target="_blank"><img src="https://echarts.apache.org/en/images/people/plainheart.jpg"></a><h5 class="about-name">Zhongxiang Wang</h5><div class="about-desc">Henan, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/wf123537200" target="_blank"><img src="https://echarts.apache.org/en/images/people/zakwu.jpg?_v_=20200710_1"></a><h5 class="about-name">Zak Wu</h5><div class="about-desc">Tencent</div><div class="about-desc">Shenzhen, China</div></div></div></div><h4 class="group code">Committers</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/cuijian-dexter" target="_blank"><img src="https://echarts.apache.org/en/images/people/崔健.jpg?_v_=20200710_1"></a><h5 class="about-name">Jian Cui</h5><div class="about-desc">Baidu</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/ClemMakesApps" target="_blank"><img src="https://echarts.apache.org/en/images/people/clement.jpg?_v_=20200710_1"></a><h5 class="about-name">Clement Ho</h5><div class="about-desc">GitLab</div><div class="about-desc">Texas, US</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/yufeng04" target="_blank"><img src="https://echarts.apache.org/en/images/people/禹峰.jpg?_v_=20200710_1"></a><h5 class="about-name">Feng Yu</h5><div class="about-desc">Baidu</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/SnailSword" target="_blank"><img src="https://echarts.apache.org/en/images/people/韩天.jpg?_v_=20200710_1"></a><h5 class="about-name">Tian Han</h5><div class="about-desc">Student</div><div class="about-desc">Beijing, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/alex2wong" target="_blank"><img src="https://echarts.apache.org/en/images/people/黄益修.jpg?_v_=20200710_1"></a><h5 class="about-name">Yixiu Huang</h5><div class="about-desc">ByteDance</div><div class="about-desc">Shanghai, China</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chfw" target="_blank"><img src="https://echarts.apache.org/en/images/people/chfw.jpg?_v_=20200710_1"></a><h5 class="about-name">chfw</h5><div class="about-desc">UK</div></div></div></div><h4 class="group contributor">Contributors</h4><div class="row"><p></p><p>Thanks to all the <a href="https://github.com/apache/incubator-echarts/graphs/contributors">CONTRIBUTORS</a> <br /> making their effort to help ECharts getting better.</p></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/contributing.html b/en/contributing.html
index 5448929..6881e24 100644
--- a/en/contributing.html
+++ b/en/contributing.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Contributing - Apache ECharts (incubating)</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="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>Contributing</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="container"><h2>Contributing to Apache ECharts (incubating)</h2><p>There are many ways that you can help make ECharts better. Please dive in and help!</p><h3>Issues</h3><p>Review the <a href="https://github.com/apache/incubator-echarts/issues" target="_blank">issues</a> and see if you can offer some help.</p><ul><li>If it's a bug report or how-to question, make sure the author has provided a minimum online demo with either <a href="https://codepen.io/Ovilia/pen/dyYWXWM" target="_blank">Codepen</a> or <a href="https://gallery.echartsjs.com/editor.html" target="_blank">ECharts Gallery (Chinese)</a> to show what's going wrong.</li><li>If it's a feature request, make sure the author has a clear explanation about what is expected and a picture would be very helpful for some cases.</li><li>Help reproduce bugs if an online demo is provided and check the <a href="https://echarts.apache.org/en/option.html" target="_blank">document</a> to see if it's a bug.</li><li>Issues without a "pending" label are the ones we believe is a bug or a feature we should provide in the future. You may make a pull request to fix them.</li></ul><h3>Pull Requests</h3><p>We appreciate pull requests from the community!</p><p>Before you start, please checkout the <a href="./coding-standard.html">Coding Standard</a> and <a href="https://www.apache.org/foundation/policies/conduct.html" target="_blank">Apache Code of Conduct</a>.</p><p>Please refer to <a href="https://github.com/apache/incubator-echarts/wiki/How-to-setup-the-dev-environment" target="_blank">How to setup the dev environment</a> and <a href="https://github.com/apache/incubator-echarts/wiki/How-to-make-a-pull-request" target="_blank">How to make a pull request</a> for more detailed instructions.</p><p>If you have any problem when making pull requests, please comment in the issues or pull requests or send an email to <a href="mailto:dev@echarts.apache.org">dev@echarts.apache.org</a> to ask for help.</p><h3>Mailing List</h3><p>Join us on the <a href="./maillist.html">mailing list</a> and take part in any conversations.</p><h3>Documents</h3><p>Documentation is massively important to help users make the most of Apache ECharts (incubating) and it's probably the area that needs the most help! So if you are interested, whether it's just to fix a page here or there, correct a link or improve what documentation is already there, please do dive in and help!</p><p>The source code of document is available at <a href="https://github.com/apache/incubator-echarts-doc" target="_blank">GitHub</a> and maybe the easiest way to find where to change is by searching key words already there.</p><p>In the issue list, we also have a <a href="https://github.com/apache/incubator-echarts/labels/doc" target="_blank">"doc"</a> label. We appreciate pull requests to fix them indeed!</p><h2>Becoming a PPMC Member or Committer!</h2><p>As we mentioned above, we appreciate the help for ECharts in any forms. When we find someone making continuous contributions in the community, we will invite him/her to be our PPMC member or committer.</p><p>Being a committer means you have the "write" access to the ECharts project, which enables you to contribute more easily and efficiently.</p><p>The Podling Project Management Committee (PPMC) helps a Podling learn how to govern itself. More information can be found at <a href="https://incubator.apache.org/guides/ppmc.html">Podling Project Management Committee</a>.</p><p>We don't have a fixed single standard for selecting a PPMC member or committer because we value all kinds of help offered. Generally, current PPMC members watch the continuous contributors in the community and start discussion and votes for the candidates, and invite to to be a PPMC member or committer after the vote passes.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>Contributing</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="container"><h2>Contributing to Apache ECharts (incubating)</h2><p>There are many ways that you can help make ECharts better. Please dive in and help!</p><h3>Issues</h3><p>Review the <a href="https://github.com/apache/incubator-echarts/issues" target="_blank">issues</a> and see if you can offer some help.</p><ul><li>If it's a bug report or how-to question, make sure the author has provided a minimum online demo with either <a href="https://codepen.io/Ovilia/pen/dyYWXWM" target="_blank">Codepen</a> or <a href="https://gallery.echartsjs.com/editor.html" target="_blank">ECharts Gallery (Chinese)</a> to show what's going wrong.</li><li>If it's a feature request, make sure the author has a clear explanation about what is expected and a picture would be very helpful for some cases.</li><li>Help reproduce bugs if an online demo is provided and check the <a href="https://echarts.apache.org/en/option.html" target="_blank">document</a> to see if it's a bug.</li><li>Issues without a "pending" label are the ones we believe is a bug or a feature we should provide in the future. You may make a pull request to fix them.</li></ul><h3>Pull Requests</h3><p>We appreciate pull requests from the community!</p><p>Before you start, please checkout the <a href="./coding-standard.html">Coding Standard</a> and <a href="https://www.apache.org/foundation/policies/conduct.html" target="_blank">Apache Code of Conduct</a>.</p><p>Please refer to <a href="https://github.com/apache/incubator-echarts/wiki/How-to-setup-the-dev-environment" target="_blank">How to setup the dev environment</a> and <a href="https://github.com/apache/incubator-echarts/wiki/How-to-make-a-pull-request" target="_blank">How to make a pull request</a> for more detailed instructions.</p><p>If you have any problem when making pull requests, please comment in the issues or pull requests or send an email to <a href="mailto:dev@echarts.apache.org">dev@echarts.apache.org</a> to ask for help.</p><h3>Mailing List</h3><p>Join us on the <a href="./maillist.html">mailing list</a> and take part in any conversations.</p><h3>Documents</h3><p>Documentation is massively important to help users make the most of Apache ECharts (incubating) and it's probably the area that needs the most help! So if you are interested, whether it's just to fix a page here or there, correct a link or improve what documentation is already there, please do dive in and help!</p><p>The source code of document is available at <a href="https://github.com/apache/incubator-echarts-doc" target="_blank">GitHub</a> and maybe the easiest way to find where to change is by searching key words already there.</p><p>In the issue list, we also have a <a href="https://github.com/apache/incubator-echarts/labels/doc" target="_blank">"doc"</a> label. We appreciate pull requests to fix them indeed!</p><h2>Becoming a PPMC Member or Committer!</h2><p>As we mentioned above, we appreciate the help for ECharts in any forms. When we find someone making continuous contributions in the community, we will invite him/her to be our PPMC member or committer.</p><p>Being a committer means you have the "write" access to the ECharts project, which enables you to contribute more easily and efficiently.</p><p>The Podling Project Management Committee (PPMC) helps a Podling learn how to govern itself. More information can be found at <a href="https://incubator.apache.org/guides/ppmc.html">Podling Project Management Committee</a>.</p><p>We don't have a fixed single standard for selecting a PPMC member or committer because we value all kinds of help offered. Generally, current PPMC members watch the continuous contributors in the community and start discussion and votes for the candidates, and invite to to be a PPMC member or committer after the vote passes.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/css/main.css b/en/css/main.css
index 89caec4..842037b 100644
--- a/en/css/main.css
+++ b/en/css/main.css
@@ -1 +1 @@
-@font-face{font-family:'iconfont';src:url("font/iconfont.eot");src:url("font/iconfont.eot?#iefix") format("embedded-opentype"),url("font/iconfont.woff") format("woff"),url("font/iconfont.ttf") format("truetype"),url("font/iconfont.svg#iconfont") format("svg")}.iconfont{font-family:"iconfont" !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{height:100%}body{font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif}#lowie-main{display:none}.lower-ie #main{display:none}.lower-ie #lowie-main{display:block;height:100%;width:100%;padding:200px 0 100px;background-color:#2a3c54}.lower-ie #lowie-main img{display:block;width:60%;margin:0 auto}.navbar-default{border:none;background-color:#293c55;z-index:10000;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;height:50px}.navbar-default .navbar-nav{-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear}.navbar-default .navbar-nav li{position:relative}.navbar-default .navbar-nav li a{color:rgba(255,255,255,0.45);background-color:none !important;padding:15px 20px;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color;font-size:14px}.navbar-default .navbar-nav li a:before{content:'';position:absolute;left:50%;right:50%;top:0;background:#a9334c;height:4px;-webkit-transition-property:'left, right';-o-transition-property:'left, right';transition-property:'left, right';-webkit-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-nav li a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li a:hover:before,.navbar-default .navbar-nav li a:focus:before{left:0;right:0}.navbar-default .navbar-nav li a .iconfont{font-size:12px}.navbar-default .navbar-nav li a .new{display:inline-block;padding:2px 5px;background-color:#a9334c;color:#fff;font-size:12px;border-radius:3px;-webkit-transform:scale(0.65);-ms-transform:scale(0.65);transform:scale(0.65)}.navbar-default .navbar-nav li.open{background-color:#162436;color:#fff}.navbar-default .navbar-nav li.open>a:focus,.navbar-default .navbar-nav li.open>a:hover{color:#eee;background-color:#162436}.navbar-default .navbar-nav li.active>a{padding-top:11px;border-top:4px solid #a9334c;color:#fff;background-color:#0e151f;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color}.navbar-default .navbar-nav li.active>a:before{display:none}.navbar-default .navbar-nav li.active>a:hover,.navbar-default .navbar-nav li.active>a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li .dropdown-menu{width:250px;padding:0;background-color:#162436;-webkit-box-shadow:none;box-shadow:none;border:none}.navbar-default .navbar-nav li .dropdown-menu li{background-color:#162436;border-top:none;padding:5px 0}.navbar-default .navbar-nav li .dropdown-menu li a{padding:8px 20px}.navbar-default .navbar-nav li .dropdown-menu li:hover,.navbar-default .navbar-nav li .dropdown-menu li:focus{background-color:#a9334c}.navbar-default .navbar-nav li .dropdown-menu li:hover a,.navbar-default .navbar-nav li .dropdown-menu li:focus a{background-color:#a9334c}.navbar-default .navbar-nav li ul a:before{display:none}.navbar-default .navbar-logo{height:32px;margin-top:-6px;margin-left:-2px}.navbar-default .navbar-collapse{border-top:none}.navbar-default .navbar-toggle{padding:1px 5px;margin:7px 16px 0 0;border-color:#384E6B;background-color:#384E6B}.navbar-default .navbar-toggle .icon-bar{margin:7px 0 !important;height:1px;background-color:#fff}.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{border-color:#384E6B;background-color:#384E6B}.container-fluid{padding-left:25px}#menu-btn{display:none;float:right;height:45px;line-height:45px;margin:5px 20px 0 0;font-size:30px;color:#fff;cursor:pointer}.navbar-bg{background-color:rgba(41,60,85,0.3);-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-property:background-color, opacity;-o-transition-property:background-color, opacity;transition-property:background-color, opacity}.navbar-bg:hover{background-color:rgba(41,60,85,0.8)}.navbar-bg .navbar-nav li a{color:#fff}.navbar-bg .navbar-nav li.active a{color:#fff;background-color:transparent}.navbar-bg .navbar-nav #nav-apache{opacity:1}#nav-apache{margin-left:10px;margin-right:10px;opacity:0.6}#nav-apache:hover{opacity:1}#nav-apache a{padding:10px 15px}#nav-apache a img{width:127px;height:30px}.icon-external-link{position:relative;top:2px;left:5px;opacity:0.5}@media (max-width: 768px){.navbar-default .navbar-nav{background-color:#293c55;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;margin-top:0;margin-bottom:0}.navbar-default .navbar-nav .open .dropdown-menu{padding:0}.navbar-default .navbar-nav .open .dropdown-menu li a{color:#fff}.navbar-default .navbar-nav li.active>a{border-left:4px solid #a9334c;border-top:none;padding:10px 15px 10px 11px}#menu-btn{display:block}#nav-download{display:none}}@media (max-width: 992px) and (min-width: 768px){.navbar-default .navbar-nav li a{padding:15px 15px}}.page-main{position:absolute;left:0;right:0;top:50px;bottom:0;overflow-y:auto}.doc-version-change{position:absolute;top:70px;right:50px;z-index:100}.doc-version-change a{display:inline-block;margin-left:20px}.section-bg{background:#F4F7FC;padding:10px 0}.d-section.last-section{margin-bottom:30px;border-bottom:0}.page-info{margin-bottom:30px;text-align:center;padding:40px;color:#4e6167;background:#F4F7FC}.page-info h1{margin-bottom:5px;font-size:40px;font-weight:bold;color:#333}.page-info p{font-size:16px}.page-info-echarts{font-size:12px;margin-top:15px;color:#8E99AB}.page-content{min-height:300px;padding-bottom:40px;font-size:16px;line-height:22px}.page-content h2{color:#a9334c;padding-bottom:15px;border-bottom:1px solid #ddd;margin-top:40px;margin-bottom:20px}.page-content h2:first-child{margin-top:0}.page-content h3{margin:30px 0 10px 0}.page-content p{margin:10px 0}.page-content section{padding:40px 0;text-align:center}.page-content ul{padding-left:30px}.page-content li{margin:5px 0;list-style:disc}.page-nav{position:fixed;overflow:auto;width:200px;top:260px;bottom:0;margin:0 0 0 30px;padding:0 0 20px 0}.page-nav h4{margin:10px 0;color:#666;font-size:14px;padding-left:10px}.page-nav h4:first-child{margin-top:0}.page-nav h4.inner{margin:0;padding-left:0;font-size:18px}.page-nav a{border-left:1px solid rgba(78,97,103,0.25);color:#999;padding:7px 10px;display:block;position:relative}.page-nav a:before{content:'';position:absolute;top:50%;bottom:50%;background:#a9334c;width:3px;left:-1px;-webkit-transition-property:'top, bottom';-o-transition-property:'top, bottom';transition-property:'top, bottom';-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.page-nav a:hover{text-decoration:none;color:#333}.page-nav a:hover:before{top:0;bottom:0}.page-nav a.active{color:#a9334c}.page-nav .slide-btn{display:none}.page-detail{margin-left:220px;margin-bottom:20px;padding:0 40px 0 40px;overflow-x:hidden}.page-detail h2{margin:10px 0;padding-top:20px;font-size:22px}.page-detail h2:first-child{margin-top:0;padding-top:0}.page-detail h2+h3{margin-top:20px}.page-detail h3{margin:40px 0 15px 0;font-size:18px}.page-detail p{margin:15px 0}.page-detail li{padding-left:0}.page-detail li li{padding-left:20px;margin:5px 0}.page-detail .time{float:right;position:relative;top:-35px}@media screen and (max-device-width: 600px){.page-content.single-page{position:static}.page-content.slide-up .page-nav ul{display:none}.page-info{text-align:left;padding:15px;margin-bottom:10px}.page-info h1{margin-bottom:10px}.page-nav{position:static}.page-nav .slide-btn{display:block;color:#e43c59;position:absolute;right:20px;margin-top:10px}.page-detail{position:static;margin-left:0;padding:0 15px}.page-detail h2{padding-top:20px}.page-detail h2:first-child{padding-top:0}}#download-extension-container{max-width:800px}#download-extension-container .row{margin-top:40px;margin-bottom:40px}#reference{padding:90px 0 140px 0;text-align:center}footer{min-height:236px;background-color:#293c55;color:#808795;font-size:14px}footer.inner-footer{background-color:transparent;border-top:1px solid #eee;margin-top:40px;color:#aaa;font-size:12px}footer.inner-footer .container{padding:0}footer.inner-footer p{line-height:20px}footer.inner-footer .row{margin-top:20px !important}footer.inner-footer #footer-icon-panel{text-align:left}footer.inner-footer #footer-icon-panel img{margin-top:20px;width:250px}footer .row{margin-top:50px !important;margin-bottom:0 !important}footer .logo img{display:block;margin-bottom:20px;width:109px}footer .footer-apache-logo{width:300px;max-width:80%;margin:0 0 10px 0}footer #efe-product li{width:50%;display:inline-block}footer #echarts-copyright{color:rgba(255,255,255,0.4);margin:65px 0 20px 0;font-size:1.2rem}footer h3{color:#fff;font-size:1.5rem;margin:10px 0}footer ul{height:150px}footer ul dt{width:50%;float:left;font-weight:300}footer ul li{font-weight:300}footer ul a{color:rgba(255,255,255,0.4);font-size:1.2rem;margin:5px 0}footer ul a:hover{color:rgba(255,255,255,0.8)}footer #footer-icon-panel{text-align:right;font-weight:300;float:right}footer .footer-icon{display:inline-block;width:40px;height:40px;border-radius:50px;margin:5px 0 5px 10px;padding:8px 10px;border:1px solid white}@media (max-width: 992px){footer .footer-apache-logo{margin:10px -30px 0 0}footer .icon-panel{margin:-20px -50px 20px 0;text-align:center}footer #echarts-copyright{margin:20px 0;text-align:center}footer .footer-icon{margin:30px 5px 5px 5px}}@media (max-width: 768px){footer .logo img{margin:0 auto}footer #footer-icon-panel{text-align:center}footer #echarts-copyright{text-align:center}}html{overflow-x:hidden}body{width:100%;overflow-x:hidden;background-color:#fff}#page-index{top:0}#main-content{color:#9297A3;font-weight:300}#main-content h1,#main-content h2,#main-content h3,#main-content h4,#main-content h5,#main-content h6{color:#333743;font-weight:400}#main-content p{font-weight:300}#main-content footer{font-weight:400 !important}#main-content footer h3{color:white}#main-content #home-section{position:relative;background-color:white}#main-content #home-section .btn{letter-spacing:10px;-webkit-box-shadow:2px 4px 4px rgba(0,0,0,0.2);box-shadow:2px 4px 4px rgba(0,0,0,0.2);text-shadow:0 2px 4px rgba(0,0,0,0.5)}#main-content #home-section .btn:hover{text-shadow:none}#main-content #video-index{width:100%}#main-content #home-logo{width:1000px;max-width:95%}#main-content .video-btn{width:60px;height:60px;position:absolute;padding-top:18px;border-radius:50%;background-color:#fff;text-align:center;cursor:pointer;z-index:100}#main-content .video-index-btn{bottom:55px;left:70px}#main-content .video-play-btn{padding-left:4px}#main-content .video-pause-btn{display:none}@-webkit-keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}@keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}#main-content #video-index-play:before{-webkit-animation:fx-plyr-play-button 1.5s ease-out infinite;animation:fx-plyr-play-button 1.5s ease-out infinite;border:4px solid #fff;border-radius:150%;-webkit-box-shadow:0 0 5px #fff;box-shadow:0 0 5px #fff;-webkit-box-sizing:border-box;box-sizing:border-box;content:"";height:150%;left:-25%;position:absolute;top:-25%;width:150%}#main-content .feature-play-btn{-webkit-transform:scale(0.7);-ms-transform:scale(0.7);transform:scale(0.7)}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:5%;bottom:6%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:25%}#main-content .main-bg{width:100%;position:absolute;z-index:10;top:0;bottom:5px}#main-content .banner-section{position:relative;margin-top:-5px}#main-content .banner-section a{display:block;text-align:center}#main-content .banner-img{width:100%}#main-content h2{margin:35px 0 5px 0}#main-content .feature-btn{margin-top:40px}#main-content .feature-btn a{color:#40A7DC}#main-content .feature-btn .more-icon{display:inline-block;margin-left:8px;padding-top:2px}#main-content .row{margin:40px 0}#main-content .right-column{text-align:right}#main-content section.normal{padding-top:50px;padding-bottom:50px;text-align:center}#main-content .btn-panel{margin-top:30px;text-align:center}#main-content .btn-panel .btn{width:140px;padding:9px;margin-left:0;margin-right:36px;border-radius:25px;text-indent:10px}#efe-more{margin-top:-10px}#reference{font-size:1.6rem;font-weight:400;line-height:2.4rem;text-align:center;background-image:url("../images/map.png");background-repeat:no-repeat;background-position:center center;background-size:contain;color:#333}#reference #recommends{height:160px;position:relative;max-width:90%;width:600px;margin:0 auto;text-align:center}#reference .recommend{display:none;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;position:absolute;bottom:0;width:100%}#reference .recommend.active{display:block}#reference .recommend p{margin:10px auto;font-size:20px;font-weight:400;color:#333}#reference .recommend p:before{display:inline-block;content:'';width:41px;height:37px;background-image:url("../images/yinhao.png");background-size:100%;margin-right:20px}#reference .person{margin:10px 0 20px 0;color:#9297A3}#reference .person .name{margin-top:-5px}#reference .people{height:100px}#reference .people img{width:70px;border-radius:50%;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;border-color:white;opacity:0.5;display:inline-block;margin:15px 10px}#reference .people img.active{width:100px;margin:0;-webkit-box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);border:4px solid white;opacity:1}#main-content #reference{margin-top:100px}.companies{overflow-x:hidden;overflow-y:hidden;width:100%;height:80px;white-space:nowrap;background:white;margin:69px 0 90px 0;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.companies img{padding:15px;height:100%}#home-section{position:relative;overflow:hidden}#home-section .description{position:absolute;top:50%;left:50%;width:1000px;height:200px;margin-top:-100px;margin-left:-500px;z-index:20;color:white;text-align:center}#home-section .description h1{font-size:80px;text-shadow:0 2px 4px rgba(0,0,0,0.5)}#home-section .description p{font-size:15px;color:#eee;text-shadow:1px 1px 2px #333}#feature-section{padding-top:50px}#feature-section .container{max-width:1000px}#feature-section .features{margin-top:20px;margin-bottom:90px;text-align:center}#feature-section .features h3{font-size:22px}#feature-section .features p{margin-top:11px}#feature-section .feature-detail{margin-bottom:20px;position:relative;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}#feature-section .feature-detail>.col{position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}#feature-section .feature-detail::before,#feature-section .feature-detail::after{content:" ";display:table}#feature-section .feature-detail::after{clear:both}#feature-section .feature-detail h2{font-size:35px;margin-bottom:12px}#feature-section .feature-detail h3{font-size:18px;font-weight:300;color:#9297A3;margin-top:30px}#feature-section .feature-detail h3 ~ h3{margin-top:18px}#feature-section .feature-detail p{font-weight:300;margin-top:8px}#feature-section .feature-detail #col-analysis h2{margin-top:-45px}#feature-section .feature-detail #col-data h2{margin-top:100px}.feature-icon-panel{width:90px;height:90px;margin:0 auto;margin-bottom:22px;padding:27px;border-radius:50%;border:1px solid #F2F2F2}.feature-icon{width:36px}#video-feature-4{width:100%;-webkit-box-shadow:3px 5px 10px rgba(0,0,0,0.43);box-shadow:3px 5px 10px rgba(0,0,0,0.43);border-radius:10px;border:2px solid #000}#video-feature-4 h2 div{margin-bottom:10px}#feature-dimension{top:50px}#video-feature-1{position:absolute;left:13.8%;width:66%;top:7.5%}#publication{margin-top:50px;padding:50px 0;background-color:#f5f7fd}#publication h2{margin-top:10px;font-weight:normal;font-size:28px;line-height:36px}#publication .container{max-width:1000px}#publication p.note{margin-top:10px}#publication p.link{color:#555;margin-top:20px;font-size:18px}#publication p.link a{margin-left:10px}#publication .img-container{padding:50px 10px;background-color:#fff;-webkit-box-shadow:3px 3px 11px #ccc;box-shadow:3px 3px 11px #ccc}#about-section{padding-top:40px;padding-bottom:90px;background-color:#fff}#about-section p{margin-top:12px}#about-section .btn-panel .btn{margin:0 25px;margin-top:10px;margin-bottom:10px}#about-section .btn-panel .btn-red{padding-left:10px}#gongzhonghao{margin:40px 0}#gongzhonghao img{width:150px;-webkit-box-shadow:0px 6px 12px 0 #eee;box-shadow:0px 6px 12px 0 #eee}#about-section a{color:#fff;position:relative;background-color:transparent;width:140px;height:40px;display:inline-block;margin:0 15px}#about-section a:hover{text-decoration:none}.btn-content{border-radius:25px;width:100%;height:100%;padding:10px;padding-left:8px;text-indent:10px;position:relative;z-index:100;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}.btn-content img{margin-right:10px;position:relative;top:-2px}.btn-shadow{display:block;width:136px;height:37px;border-radius:19px;position:absolute;top:2px;left:1px;-webkit-box-shadow:1px 0 9px rgba(187,37,48,0.6);box-shadow:1px 0 9px rgba(187,37,48,0.6);-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}#btn-github .btn-content{background-color:#4D62F6}#btn-github .btn-content:hover{background-color:#7086FF;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content:active{background-color:#4151CA;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content img{width:20px;top:-3px}#btn-github .btn-shadow{-webkit-box-shadow:1px 0 9px rgba(52,57,107,0.6);box-shadow:1px 0 9px rgba(52,57,107,0.6)}#btn-github:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(52,57,107,0.7);box-shadow:1px 3px 9px rgba(52,57,107,0.7)}#btn-weibo .btn-content{background-color:#FF414F}#btn-weibo .btn-content:hover{background-color:#FF6060;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content:active{background-color:#D72D3A;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content.zh{letter-spacing:5px}#btn-weibo .btn-content img{width:22px}#btn-weibo .btn-shadow{-webkit-box-shadow:1px 2px 7px rgba(187,37,48,0.5);box-shadow:1px 2px 7px rgba(187,37,48,0.5)}#btn-weibo:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(187,37,48,0.7);box-shadow:1px 3px 9px rgba(187,37,48,0.7)}#btn-twitter .btn-content{background-color:#00ACED}#btn-twitter .btn-content:hover{background-color:#67CFF6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content:active{background-color:#019CD6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content img{width:22px}#btn-twitter .btn-shadow{-webkit-box-shadow:1px 0 7px rgba(11,126,170,0.4);box-shadow:1px 0 7px rgba(11,126,170,0.4)}#btn-twitter:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(11,126,170,0.7);box-shadow:1px 3px 9px rgba(11,126,170,0.7)}@media (max-width: 992px){#home-section .description{width:80%;left:0;margin-left:10%}#feature-section .feature-detail h2{font-size:30px;margin-top:-15px}#feature-section .feature-detail h3{margin-top:15px}#feature-section .feature-detail p{margin-top:8px}#main-content .feature-btn{margin-top:15px}#col-desktop>*{margin-left:0}#col-data{padding-top:100px}#video-feature-1{width:64%;left:15%}}.mobile{display:none}@media (max-width: 768px){#main-content h2{font-size:24px}#main-content .feature-btn{margin:0 auto;margin-top:50px;text-align:center}.features{margin-bottom:0}.features p{margin-bottom:70px}#feature-section .feature-detail{-webkit-transform:none;-ms-transform:none;transform:none}#feature-section .feature-detail>.col{top:0;-webkit-transform:none;-ms-transform:none;transform:none;text-align:center}#feature-section .feature-detail .col-sm-4{margin-bottom:80px;padding-top:0}#reference{background-size:cover}#reference .people{height:180px}.pc{display:none}.mobile{display:block}}@media (max-width: 480px){#home-section .description{text-align:center;top:40%}#home-section .description .btn{display:block;margin:25px auto}#main-content #home-logo{margin-bottom:20px}#main-content #index-play-btn{display:block;width:120px;height:120px;margin:0 auto}#main-content #home-section .btn{background-color:white;color:#333743;text-shadow:none}#main-content h2{margin-top:20px}#main-content .video-index-btn{left:50%;margin-left:-30px;bottom:40px}#main-content #video-index-play:before{display:none}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:9%;bottom:10%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:20%}#about-section .btn-panel a{display:block;margin:20px auto}}.ch-main{position:relative;margin-top:100px;margin-left:100px}.ch-pc-chart{width:90%;height:280px;border-radius:12px;-webkit-box-shadow:6px 6px 22px #ccc;box-shadow:6px 6px 22px #ccc}.ch-pc-chart div{z-index:50 !important}.ch-mobile{position:absolute;right:0;width:180px;top:-30px;z-index:300}.ch-mobile-box{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ch-mobile-content{position:absolute;overflow:hidden;border-bottom-left-radius:5px;border-bottom-right-radius:5px;left:12%;right:12%;top:16%;bottom:15.5%;background:#333;z-index:300;padding:0;margin:0}.ch-mobile-chart{width:200%;height:200%;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scale(0.5);-ms-transform:scale(0.5);transform:scale(0.5);padding:0;margin:0}.ch-mobile-chart div div{z-index:50 !important}.ch-on-touch .ch-pc-chart{width:auto}.ch-on-touch .ch-mobile{display:none}@media (max-width: 768px){.ch-main{margin-left:0}}@media (max-width: 480px){.ch-main{margin-top:0}}#ec-example-main #left-container{top:71px}h1,h2,h3,h4,h5,h6,h7,p{font-weight:400;margin:0;padding:0}ul{list-style:none;padding:0;margin:0}img{max-width:100%}.clear :after{display:block;content:'';clear:both}iframe{border:1px solid #ccc}#download-table{margin:20px 0}#download-table td{padding:8px;text-align:left}#download-main{max-width:800px}#download-main .d-section{margin-top:20px;padding-top:20px}#download-main h2{font-size:25px;border-bottom:0;text-align:center;color:#293c55;text-align:left}#download-main h3{margin-top:40px;font-size:18px;font-weight:bold;text-align:left}#download-main h3.first{margin-top:-20px}#download-main p{text-align:left}#download-main .center{text-align:center}#download-main h4{margin:10px auto;margin-top:20px;font-size:16px;font-weight:bold;text-align:left}#download-main h4 .warn{color:#A9334C}#download-main .list-wrap{margin:20px 0 0 0}#download-main .d-section-version h2{margin-top:-30px}#download-main .checksum{text-align:left;margin:20px 0;border-left:0;padding:0}#download-main .checksum p,#download-main .checksum li{font-size:14px}#download-main li{list-style:inherit;margin:5px 0}.download-note{margin-top:12px;line-height:20px;font-size:14px;color:#999;text-align:left}.paper-desc{text-align:left;margin:20px -20px;padding:20px;background-color:#f5f7fd}.paper-desc .paper-title{font-size:16px;margin-top:5px;font-weight:bold}.paper-desc .paper-author{font-size:12px;margin:10px 0px;color:#999}.paper-desc .paper-journal{font-size:14px}#download-row{text-align:center}.d-section{padding-top:50px;padding-bottom:25px;text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);color:#6b7a89}.d-section{*zoom:1}.d-section:before,.d-section:after{display:table;line-height:0;content:""}.d-section:after{clear:both}.download-theme img{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.download-theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-main .d-section-version a,#download-main .d-section-gl a{text-decoration:none}#download-main .d-section-version a:hover .circle-wrap,#download-main .d-section-gl a:hover .circle-wrap{color:#fff;background-color:#45B4E8;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version a:active .circle-wrap,#download-main .d-section-version a:focus .circle-wrap,#download-main .d-section-gl a:active .circle-wrap,#download-main .d-section-gl a:focus .circle-wrap{color:#fff;background-color:#2997D6;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version .mode,#download-main .d-section-gl .mode{display:block;margin:38px 0 2px;font-size:17px}#download-main .d-section-version .text,#download-main .d-section-gl .text{margin-left:-10px;text-align:center;color:#333}#download-main .d-section-version .text span,#download-main .d-section-gl .text span{color:#333;opacity:0.7}.d-section-version{padding-bottom:50px}.d-section-version .row>div{height:220px}#download-main .circle-wrap{width:120px;height:120px;border-radius:50%;background-color:white;border:1px solid rgba(78,97,118,0.2);margin:0 auto;margin-bottom:15px;color:#293c55;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}.more-btn{position:relative;display:block;margin:20px auto;margin-bottom:10px}.more-btn:after{display:block;content:'';width:19px;height:18px;background-image:url("../images/btn-arrow.png");background-size:80% 80%;position:absolute;background-repeat:no-repeat;right:20px;top:13px}.more-btn+p{color:#6b7a89}.btn-two{margin-left:15px;margin-right:15px;margin-bottom:10px;position:relative;text-align:left;padding-left:45px !important}.d-section-map ul,.d-section-theme ul{*zoom:1}.d-section-map ul:before,.d-section-map ul:after,.d-section-theme ul:before,.d-section-theme ul:after{display:table;line-height:0;content:""}.d-section-map ul:after,.d-section-theme ul:after{clear:both}.d-section-map li,.d-section-theme li{float:left;width:260px}.d-section-map .first-item,.d-section-theme .first-item{margin-right:160px}.hover-shadow{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out}.hover-shadow:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-extension-container h2{color:#293c55;margin-bottom:5px}#download-extension-container p{margin:5px 0}#builder .warn{color:#e43c59;margin-top:10px;font-size:16px;line-height:25px}#builder ul{margin:0px;padding:0px}#builder li{list-style:none}#title h1 span{margin-left:20px;font-size:34px;color:#888;font-weight:100}#title .download-version{margin:5px;font-size:18px;font-weight:bold}#configuration{width:1000px;margin:0 auto}#configuration p.desc{color:#6b7a89;font-size:16px}#configuration h3{font-family:noto-thin;margin:26px 0}#configuration>section{border-bottom:1px solid #e5e5e5;text-align:left}#configuration>section p{margin:20px 0}#configuration h3{margin:10px 0;color:#3c485c;font-size:26px;font-weight:normal}#configuration h3 span{font-size:16px;margin-left:5px}#configuration ul{margin:10px}#configuration li{display:inline-block;vertical-align:top;margin:20px 18px;text-align:center;width:120px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}#configuration li input{display:none}#configuration li img{margin-top:5px;width:90px;height:90px;padding:5px 10px}#configuration li h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#configuration li h5 span{font-size:12px;margin-left:3px}#configuration li:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}#configuration li.checked{-webkit-box-shadow:0px 0px 15px #293c55;box-shadow:0px 0px 15px #293c55;border:1px solid rgba(41,60,85,0.6)}#configuration li.checked h5::before{content:'';width:15px;height:15px;background-size:15px 15px;background-image:url(../images/builder/checked.png);display:inline-block;position:absolute;right:0;top:-105px}#other input{margin:0 10px 0 0;vertical-align:middle}#other label{font-size:16px}#other p.desc{font-size:14px;padding-left:10px}#other a{color:black}#other .other-option{margin-left:15px}#action{margin-top:50px;margin-bottom:100px;text-align:center}#email{border:1px solid #ccc;border-radius:20px;line-height:2em;width:250px;padding:5px 20px;outline:none;margin-top:20px}#build{margin-top:20px}.clear{clear:both}#about-page{margin-top:60px;text-align:center}#about-page section{padding:40px 15px}#about-page .contributor{max-width:800px}#about-page h3{margin-bottom:20px}#about-page p{color:#888;margin:5px 0}#about-page h4.group{text-align:left;border-left:4px solid;padding-left:15px}#about-page h4.group.mentors{margin:0px 0 10px 0;border-color:#E86C4B}#about-page h4.group.code{margin:40px 0 10px 0;border-color:#40A7DC}#about-page h4.group.contributor{margin:40px 0 40px 0;border-color:#40A7DC}#about-page h4.group.companie{margin:40px 0 40px 0;border-color:#58A77C}#about-page h5{margin:5px 0;font-weight:bold}#about-page .about-person{margin:20px 0;height:150px}#about-page .about-person>a{display:inline-block;height:90px}#about-page .about-person>a img{height:88px}#about-page .about-person>a:hover img{-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);border-color:white}#about-page .about-person img{display:block;margin:0 auto;margin-bottom:10px;width:90px;border-radius:50%;border:4px solid white;border-color:transparent;-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0);box-shadow:0 4px 9px 0 rgba(46,37,37,0);-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s;-webkit-transition-timing-function:ease-in-out;-o-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}#about-page .about-person .about-desc{color:#888}#about-page .about-person.wait-for-you img{border:1px solid #ececec;padding:10px;margin-bottom:20px}#about-page .company{border-top:1px solid rgba(78,97,118,0.25);max-width:800px}#about-page .company h3{margin-bottom:40px}#about-page .company .col-md-3{height:80px}#about-send-logo{margin:20px 0 50px 0}#about-send-logo p{margin-top:10px}.not-found{padding:150px 0 160px;height:100%;background-color:#2a3c54;overflow:hidden}.not-found img{display:block;width:60%;margin:0 auto}.not-found .text{margin-top:50px;text-align:center;font-size:20px;color:#fff}.not-found .link{margin-left:10px;color:#3183c6}@media (max-width: 768px){.not-found .text{padding:0 15px;font-size:14px}}#maps .links{text-align:center}#maps .links a{display:inline-block;margin:0 5px}#maps h3{margin-top:20px}#maps h3 span{font-size:0.7em;display:inline-block;margin:0 4px}#maps h5{text-align:center}#maps .province{margin-top:10px;margin-bottom:10px}#maps #map-list{padding-bottom:40px}#maps section p{margin-bottom:0;color:#6b7a89}#map-example{margin-top:30px;margin-bottom:100px;line-height:2em;font-size:14px}#map-example h4{margin:20px 0 10px 0}#map-example .prettyprint{padding:10px;border:#ccc 1px solid}#themes{max-width:800px}#themes p.desc{color:#888}#themes h1{text-align:center}#themes h3 span{font-size:16px;margin-left:5px}#themes .theme{text-align:center}#themes .theme img{margin-top:20px;width:285px;-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out;cursor:pointer}#themes .theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#theme-configure-section{margin-top:40px}#theme-example{margin:50px 0 80px 0;line-height:2em;font-size:14px}#theme-example h4{margin:20px 0 10px 0}#theme-example .prettyprint{padding:10px;border:#ccc 1px solid}#theme-builder{margin:30px 0;text-align:center}#changelog{width:700px;margin:0 auto;margin-top:100px;margin-bottom:100px;font-family:'Microsoft Yahei'}#changelog p.desc{margin:10px 0}#changelog p{font-weight:normal}#changelog .time{color:#888;float:right;margin-top:-35px;margin-right:10px}#changelog h2{margin-top:50px;border-bottom:1px solid #ccc;padding-bottom:5px;margin-bottom:10px}#changelog strong{color:#c12c2c}#changelog strong a{color:#3cafa4}#changelog>ul{margin-left:-10px}#changelog li{margin:10px 0;padding:0 20px}#changelog pre{margin:10px 20px;border:none}#ec-doc-main{position:absolute;left:0;right:0;top:0;bottom:0}@media (max-width: 600px){#ec-doc-main{-webkit-overflow-scrolling:touch;position:static}#ec-doc-nav{position:static;margin-bottom:0}}#extension{margin-bottom:-40px}#extension .nav-container{text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);height:43px}#extension .nav-tabs{display:inline-block;border-bottom:none}#extension .nav-tabs li>a{border:none;color:#293c55}#extension .nav-tabs li>a:hover{background:transparent}#extension .nav-tabs li.active>a{color:#a9334c;border-bottom:4px solid #a9334c}#extension .tab-content{margin:40px 0}.extension{margin:10px 0 40px 0}.extension-content{-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.1);border-radius:4px}.extension-head{display:block}.extension-img{width:100%}.extension-info{padding:10px 15px;height:132px;overflow:hidden}@media (min-width: 992px){.extension-info:lang(en){height:195px}.extension-info:lang(zh){height:155px}}@media (min-width: 768px){.extension-info:lang(en){height:215px}}.extension-name{font-size:18px}.extension-author{margin-bottom:5px}.extension-author-name{display:inline-block;margin-right:5px}.extension-author-name+.extension-author-name{opacity:0.5}#submit-extension{text-align:center;padding-top:60px;padding-bottom:40px;background:#F4F7FC}#submit-extension h3{margin-bottom:10px}#submit-extension p{margin:2px 0;color:#6b7a89}#submit-extension a.btn{margin:20px 0 5px 0}#faq-page .page-detail li{margin:10px 0;list-style:circle}#maillist ul{list-style:circle;font-size:16px;padding-left:40px}#maillist li{margin:10px 0}#cheat-selector{margin-bottom:20px}#cheat-selector .selected .btn{background-color:#293c55;border-color:#162436;color:white}#cheat-chart{width:100%;height:400px}#cheat-detail{min-height:100px}#cheat-detail .desc{margin:10px 0 20px 0;font-size:14px;color:#555}.page-cheatsheet h2{font-size:22px;margin-top:30px;margin-bottom:10px}.page-cheatsheet h2:first-child{margin-top:0}.cheat-chart-item{display:inline-block;vertical-align:top;margin:20px 11px;text-align:center;width:120.5px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}.cheat-chart-item:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}.cheat-chart-item a{text-decoration:none}.cheat-chart-item img{margin-top:5px;width:90px;height:90px;padding:5px 10px}.cheat-chart-item h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#apache-banner{position:fixed;left:0;right:0;bottom:0;padding:20px 40px 0;z-index:10000;background-color:rgba(0,0,0,0.6);color:#fff;display:none}#apache-banner .txt{width:80%;height:100%;display:inline-block}#apache-banner p{margin:5px 0}#apache-banner p a{color:#fff;text-decoration:underline}#apache-banner .btn{position:relative;bottom:20px;width:20%;height:100%;display:inline-block;background-color:#a9334c;border-radius:6px;color:#fff;padding:10px}#apache-banner .btn:hover{-webkit-box-shadow:none;box-shadow:none}#apache-banner .close-btn{position:absolute;padding:5px;right:15px;top:15px;color:#fff}#apache-banner .close-btn:hover{text-decoration:none}@media (max-width: 768px){#apache-banner{padding:15px}#apache-banner .txt{width:100%;height:auto;display:block;margin-top:20px}#apache-banner .btn{width:100%;height:auto;display:block;top:0}#apache-banner .close-btn{top:10px}}.pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pace-inactive{display:none}.pace .pace-progress{background:#e43c59;position:fixed;z-index:100000;top:0;right:100%;width:100%;height:2px}.pace .pace-progress-inner{display:block;position:absolute;right:0px;width:100px;height:100%;-webkit-box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;opacity:1.0;-webkit-transform:rotate(3deg) translate(0px, -4px);-ms-transform:rotate(3deg) translate(0px, -4px);transform:rotate(3deg) translate(0px, -4px)}.btn-main{border-radius:20px;padding:8px 50px;-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s}.btn-main+.btn{margin-left:15px}.btn-main img{width:20px;margin-right:10px;margin-top:-2px;margin-left:-5px}.btn-main:hover{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-main:focus,.btn-main:active{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-thirdary{width:180px;-webkit-box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);background-color:#3FA5DC;padding:9px 10px;color:white;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.btn-thirdary:hover{color:white;background-color:#45B4E8}.btn-thirdary:focus,.btn-thirdary:active{color:white;background-color:#2997D6}.btn-blue{background-color:#47ACE3;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4)}.btn-blue:hover{background-color:#46B5F1;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-blue:focus{background-color:#2E9FDC;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-red{background-color:#FF424F;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4);box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4)}.btn-red:hover{background-color:#FF4F4B;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-red:focus{background-color:#EE2A38;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-green{background-color:#80BB6A;color:white}.btn-green:hover,.btn-green:focus{background-color:#95CC81;color:white;-webkit-box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4);box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4)}.btn-index-home{background-color:transparent;border:1px solid white;color:white}.btn-index-home:hover,.btn-index-home:focus{background-color:white;color:#333743;-webkit-box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3);box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3)}.btn-default{background-color:white;color:#40A7DC;border:1px solid #40A7DC}.btn-default:hover,.btn-default:focus{background-color:#40A7DC;color:white;border:1px solid #40A7DC}.btn-group{margin:0 5px}.btn-group .caret{margin-left:5px}::-webkit-scrollbar{height:8px;width:8px;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-button{display:none}::-webkit-scrollbar-thumb{width:8px;min-height:15px;background:rgba(50,50,50,0.3) !important;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.5) !important}
+@font-face{font-family:'iconfont';src:url("font/iconfont.eot");src:url("font/iconfont.eot?#iefix") format("embedded-opentype"),url("font/iconfont.woff") format("woff"),url("font/iconfont.ttf") format("truetype"),url("font/iconfont.svg#iconfont") format("svg")}.iconfont{font-family:"iconfont" !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{height:100%}body{font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif}#lowie-main{display:none}.lower-ie #main{display:none}.lower-ie #lowie-main{display:block;height:100%;width:100%;padding:200px 0 100px;background-color:#2a3c54}.lower-ie #lowie-main img{display:block;width:60%;margin:0 auto}.navbar-default{border:none;background-color:#293c55;z-index:10000;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;height:50px}.navbar-default .navbar-nav{-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear}.navbar-default .navbar-nav li{position:relative}.navbar-default .navbar-nav li a{color:rgba(255,255,255,0.45);background-color:none !important;padding:15px 20px;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color;font-size:14px}.navbar-default .navbar-nav li a:before{content:'';position:absolute;left:50%;right:50%;top:0;background:#a9334c;height:4px;-webkit-transition-property:'left, right';-o-transition-property:'left, right';transition-property:'left, right';-webkit-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-nav li a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li a:hover:before,.navbar-default .navbar-nav li a:focus:before{left:0;right:0}.navbar-default .navbar-nav li a .iconfont{font-size:12px}.navbar-default .navbar-nav li a .new{display:inline-block;padding:2px 5px;background-color:#a9334c;color:#fff;font-size:12px;border-radius:3px;-webkit-transform:scale(0.65);-ms-transform:scale(0.65);transform:scale(0.65)}.navbar-default .navbar-nav li.open{background-color:#162436;color:#fff}.navbar-default .navbar-nav li.open>a:focus,.navbar-default .navbar-nav li.open>a:hover{color:#eee;background-color:#162436}.navbar-default .navbar-nav li.active>a{padding-top:11px;border-top:4px solid #a9334c;color:#fff;background-color:#0e151f;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color}.navbar-default .navbar-nav li.active>a:before{display:none}.navbar-default .navbar-nav li.active>a:hover,.navbar-default .navbar-nav li.active>a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li .dropdown-menu{width:250px;padding:0;background-color:#162436;-webkit-box-shadow:none;box-shadow:none;border:none}.navbar-default .navbar-nav li .dropdown-menu li{background-color:#162436;border-top:none;padding:5px 0}.navbar-default .navbar-nav li .dropdown-menu li a{padding:8px 20px}.navbar-default .navbar-nav li .dropdown-menu li:hover,.navbar-default .navbar-nav li .dropdown-menu li:focus{background-color:#a9334c}.navbar-default .navbar-nav li .dropdown-menu li:hover a,.navbar-default .navbar-nav li .dropdown-menu li:focus a{background-color:#a9334c}.navbar-default .navbar-nav li ul a:before{display:none}.navbar-default .navbar-logo{height:32px;margin-top:-6px;margin-left:-2px}.navbar-default .navbar-collapse{border-top:none}.navbar-default .navbar-toggle{padding:1px 5px;margin:7px 16px 0 0;border-color:#384E6B;background-color:#384E6B}.navbar-default .navbar-toggle .icon-bar{margin:7px 0 !important;height:1px;background-color:#fff}.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{border-color:#384E6B;background-color:#384E6B}.container-fluid{padding-left:25px}#menu-btn{display:none;float:right;height:45px;line-height:45px;margin:5px 20px 0 0;font-size:30px;color:#fff;cursor:pointer}.navbar-bg{background-color:rgba(41,60,85,0.3);-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-property:background-color, opacity;-o-transition-property:background-color, opacity;transition-property:background-color, opacity}.navbar-bg:hover{background-color:rgba(41,60,85,0.8)}.navbar-bg .navbar-nav li a{color:#fff}.navbar-bg .navbar-nav li.active a{color:#fff;background-color:transparent}.navbar-bg .navbar-nav #nav-apache{opacity:1}#nav-apache{margin-left:10px;margin-right:10px;opacity:0.6}#nav-apache:hover{opacity:1}#nav-apache a{padding:10px 15px}#nav-apache a img{width:127px;height:30px}.icon-external-link{position:relative;top:2px;left:5px;opacity:0.5}@media (max-width: 768px){.navbar-default .navbar-nav{background-color:#293c55;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;margin-top:0;margin-bottom:0}.navbar-default .navbar-nav .open .dropdown-menu{padding:0}.navbar-default .navbar-nav .open .dropdown-menu li a{color:#fff}.navbar-default .navbar-nav li.active>a{border-left:4px solid #a9334c;border-top:none;padding:10px 15px 10px 11px}#menu-btn{display:block}#nav-download{display:none}}@media (max-width: 992px) and (min-width: 768px){.navbar-default .navbar-nav li a{padding:15px 15px}}.page-main{position:absolute;left:0;right:0;top:50px;bottom:0;overflow-y:auto}.doc-version-change{position:absolute;top:70px;right:50px;z-index:100}.doc-version-change a{display:inline-block;margin-left:20px}.section-bg{background:#F4F7FC;padding:10px 0}.d-section.last-section{margin-bottom:30px;border-bottom:0}.page-info{margin-bottom:30px;text-align:center;padding:40px;color:#4e6167;background:#F4F7FC}.page-info h1{margin-bottom:5px;font-size:40px;font-weight:bold;color:#333}.page-info p{font-size:16px}.page-info-echarts{font-size:12px;margin-top:15px;color:#8E99AB}.page-content{min-height:300px;padding-bottom:40px;font-size:16px;line-height:22px}.page-content h2{color:#a9334c;padding-bottom:15px;border-bottom:1px solid #ddd;margin-top:40px;margin-bottom:20px}.page-content h2:first-child{margin-top:0}.page-content h3{margin:30px 0 10px 0}.page-content p{margin:10px 0}.page-content section{padding:40px 0;text-align:center}.page-content ul{padding-left:30px}.page-content li{margin:5px 0;list-style:disc}.page-nav{position:fixed;overflow:auto;width:200px;top:260px;bottom:0;margin:0 0 0 30px;padding:0 0 20px 0}.page-nav h4{margin:10px 0;color:#666;font-size:14px;padding-left:10px}.page-nav h4:first-child{margin-top:0}.page-nav h4.inner{margin:0;padding-left:0;font-size:18px}.page-nav a{border-left:1px solid rgba(78,97,103,0.25);color:#999;padding:7px 10px;display:block;position:relative}.page-nav a:before{content:'';position:absolute;top:50%;bottom:50%;background:#a9334c;width:3px;left:-1px;-webkit-transition-property:'top, bottom';-o-transition-property:'top, bottom';transition-property:'top, bottom';-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.page-nav a:hover{text-decoration:none;color:#333}.page-nav a:hover:before{top:0;bottom:0}.page-nav a.active{color:#a9334c}.page-nav .slide-btn{display:none}.page-detail{margin-left:220px;margin-bottom:20px;padding:0 40px 0 40px;overflow-x:hidden}.page-detail h2{margin:10px 0;padding-top:20px;font-size:22px}.page-detail h2:first-child{margin-top:0;padding-top:0}.page-detail h2+h3{margin-top:20px}.page-detail h3{margin:40px 0 15px 0;font-size:18px}.page-detail p{margin:15px 0}.page-detail li{padding-left:0}.page-detail li li{padding-left:20px;margin:5px 0}.page-detail .time{float:right;position:relative;top:-35px}@media screen and (max-device-width: 600px){.page-content.single-page{position:static}.page-content.slide-up .page-nav ul{display:none}.page-info{text-align:left;padding:15px;margin-bottom:10px}.page-info h1{margin-bottom:10px}.page-nav{position:static}.page-nav .slide-btn{display:block;color:#e43c59;position:absolute;right:20px;margin-top:10px}.page-detail{position:static;margin-left:0;padding:0 15px}.page-detail h2{padding-top:20px}.page-detail h2:first-child{padding-top:0}}#download-extension-container{max-width:800px}#download-extension-container .row{margin-top:40px;margin-bottom:40px}#reference{padding:90px 0 140px 0;text-align:center}footer{min-height:236px;background-color:#293c55;color:#808795;font-size:14px}footer.inner-footer{background-color:transparent;border-top:1px solid #eee;margin-top:40px;color:#aaa;font-size:12px}footer.inner-footer .container{padding:0}footer.inner-footer p{line-height:20px}footer.inner-footer .row{margin-top:20px !important}footer.inner-footer #footer-icon-panel{text-align:left}footer.inner-footer #footer-icon-panel img{margin-top:20px;width:250px}footer .row{margin-top:50px !important;margin-bottom:0 !important}footer .logo img{display:block;margin-bottom:20px;width:109px}footer .footer-apache-logo{width:300px;max-width:80%;margin:0 0 10px 0}footer #efe-product li{width:50%;display:inline-block}footer #echarts-copyright{color:rgba(255,255,255,0.4);margin:65px 0 20px 0;font-size:1.2rem}footer h3{color:#fff;font-size:1.5rem;margin:10px 0}footer ul{height:150px}footer ul dt{width:50%;float:left;font-weight:300}footer ul li{font-weight:300}footer ul a{color:rgba(255,255,255,0.4);font-size:1.2rem;margin:5px 0}footer ul a:hover{color:rgba(255,255,255,0.8)}footer #footer-icon-panel{text-align:right;font-weight:300;float:right}footer .footer-icon{display:inline-block;width:40px;height:40px;border-radius:50px;margin:5px 0 5px 10px;padding:8px 10px;border:1px solid white}@media (max-width: 992px){footer .footer-apache-logo{margin:10px -30px 0 0}footer .icon-panel{margin:-20px -50px 20px 0;text-align:center}footer #echarts-copyright{margin:20px 0;text-align:center}footer .footer-icon{margin:30px 5px 5px 5px}}@media (max-width: 768px){footer .logo img{margin:0 auto}footer #footer-icon-panel{text-align:center}footer #echarts-copyright{text-align:center}}html{overflow-x:hidden}body{width:100%;overflow-x:hidden;background-color:#fff}#page-index{top:0}#main-content{color:#9297A3;font-weight:300}#main-content h1,#main-content h2,#main-content h3,#main-content h4,#main-content h5,#main-content h6{color:#333743;font-weight:400}#main-content p{font-weight:300}#main-content footer{font-weight:400 !important}#main-content footer h3{color:white}#main-content #home-section{position:relative;background-color:white}#main-content #home-section .btn{letter-spacing:10px;-webkit-box-shadow:2px 4px 4px rgba(0,0,0,0.2);box-shadow:2px 4px 4px rgba(0,0,0,0.2);text-shadow:0 2px 4px rgba(0,0,0,0.5)}#main-content #home-section .btn:hover{text-shadow:none}#main-content #video-index{width:100%}#main-content #home-logo{width:1000px;max-width:95%}#main-content .video-btn{width:60px;height:60px;position:absolute;padding-top:18px;border-radius:50%;background-color:#fff;text-align:center;cursor:pointer;z-index:100}#main-content .video-index-btn{bottom:55px;left:70px}#main-content .video-play-btn{padding-left:4px}#main-content .video-pause-btn{display:none}@-webkit-keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}@keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}#main-content #video-index-play:before{-webkit-animation:fx-plyr-play-button 1.5s ease-out infinite;animation:fx-plyr-play-button 1.5s ease-out infinite;border:4px solid #fff;border-radius:150%;-webkit-box-shadow:0 0 5px #fff;box-shadow:0 0 5px #fff;-webkit-box-sizing:border-box;box-sizing:border-box;content:"";height:150%;left:-25%;position:absolute;top:-25%;width:150%}#main-content .feature-play-btn{-webkit-transform:scale(0.7);-ms-transform:scale(0.7);transform:scale(0.7)}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:5%;bottom:6%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:25%}#main-content .main-bg{width:100%;position:absolute;z-index:10;top:0;bottom:5px}#main-content .banner-section{position:relative;margin-top:-5px}#main-content .banner-section a{display:block;text-align:center}#main-content .banner-img{width:100%}#main-content h2{margin:35px 0 5px 0}#main-content .feature-btn{margin-top:40px}#main-content .feature-btn a{color:#40A7DC}#main-content .feature-btn .more-icon{display:inline-block;margin-left:8px;padding-top:2px}#main-content .row{margin:40px 0}#main-content .right-column{text-align:right}#main-content section.normal{padding-top:50px;padding-bottom:50px;text-align:center}#main-content .btn-panel{margin-top:30px;text-align:center}#main-content .btn-panel .btn{width:140px;padding:9px;margin-left:0;margin-right:36px;border-radius:25px;text-indent:10px}#efe-more{margin-top:-10px}#reference{font-size:1.6rem;font-weight:400;line-height:2.4rem;text-align:center;background-image:url("../images/map.png");background-repeat:no-repeat;background-position:center center;background-size:contain;color:#333}#reference #recommends{height:160px;position:relative;max-width:90%;width:600px;margin:0 auto;text-align:center}#reference .recommend{display:none;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;position:absolute;bottom:0;width:100%}#reference .recommend.active{display:block}#reference .recommend p{margin:10px auto;font-size:20px;font-weight:400;color:#333}#reference .recommend p:before{display:inline-block;content:'';width:41px;height:37px;background-image:url("../images/yinhao.png");background-size:100%;margin-right:20px}#reference .person{margin:10px 0 20px 0;color:#9297A3}#reference .person .name{margin-top:-5px}#reference .people{height:100px}#reference .people img{width:70px;border-radius:50%;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;border-color:white;opacity:0.5;display:inline-block;margin:15px 10px}#reference .people img.active{width:100px;margin:0;-webkit-box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);border:4px solid white;opacity:1}#main-content #reference{margin-top:100px}.companies{overflow-x:hidden;overflow-y:hidden;width:100%;height:80px;white-space:nowrap;background:white;margin:69px 0 90px 0;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.companies img{padding:15px;height:100%}#home-section{position:relative;overflow:hidden}#home-section .description{position:absolute;top:50%;left:50%;width:1000px;height:200px;margin-top:-100px;margin-left:-500px;z-index:20;color:white;text-align:center}#home-section .description h1{font-size:80px;text-shadow:0 2px 4px rgba(0,0,0,0.5)}#home-section .description p{font-size:15px;color:#eee;text-shadow:1px 1px 2px #333}#feature-section{padding-top:50px}#feature-section .container{max-width:1000px}#feature-section .features{margin-top:20px;margin-bottom:90px;text-align:center}#feature-section .features h3{font-size:22px}#feature-section .features p{margin-top:11px}#feature-section .feature-detail{margin-bottom:20px;position:relative;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}#feature-section .feature-detail>.col{position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}#feature-section .feature-detail::before,#feature-section .feature-detail::after{content:" ";display:table}#feature-section .feature-detail::after{clear:both}#feature-section .feature-detail h2{font-size:35px;margin-bottom:12px}#feature-section .feature-detail h3{font-size:18px;font-weight:300;color:#9297A3;margin-top:30px}#feature-section .feature-detail h3 ~ h3{margin-top:18px}#feature-section .feature-detail p{font-weight:300;margin-top:8px}#feature-section .feature-detail #col-analysis h2{margin-top:-45px}#feature-section .feature-detail #col-data h2{margin-top:100px}.feature-icon-panel{width:90px;height:90px;margin:0 auto;margin-bottom:22px;padding:27px;border-radius:50%;border:1px solid #F2F2F2}.feature-icon{width:36px}#video-feature-4{width:100%;-webkit-box-shadow:3px 5px 10px rgba(0,0,0,0.43);box-shadow:3px 5px 10px rgba(0,0,0,0.43);border-radius:10px;border:2px solid #000}#video-feature-4 h2 div{margin-bottom:10px}#feature-dimension{top:50px}#video-feature-1{position:absolute;left:13.8%;width:66%;top:7.5%}#publication{margin-top:50px;padding:50px 0;background-color:#f5f7fd}#publication h2{margin-top:10px;font-weight:normal;font-size:28px;line-height:36px}#publication .container{max-width:1000px}#publication p.note{margin-top:10px}#publication p.link{color:#555;margin-top:20px;font-size:18px}#publication p.link a{margin-left:10px}#publication .img-container{padding:50px 10px;background-color:#fff;-webkit-box-shadow:3px 3px 11px #ccc;box-shadow:3px 3px 11px #ccc}#about-section{padding-top:40px;padding-bottom:90px;background-color:#fff}#about-section p{margin-top:12px}#about-section .btn-panel .btn{margin:0 25px;margin-top:10px;margin-bottom:10px}#about-section .btn-panel .btn-red{padding-left:10px}#gongzhonghao{margin:40px 0}#gongzhonghao img{width:150px;-webkit-box-shadow:0px 6px 12px 0 #eee;box-shadow:0px 6px 12px 0 #eee}#about-section a{color:#fff;position:relative;background-color:transparent;width:140px;height:40px;display:inline-block;margin:0 15px}#about-section a:hover{text-decoration:none}.btn-content{border-radius:25px;width:100%;height:100%;padding:10px;padding-left:8px;text-indent:10px;position:relative;z-index:100;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}.btn-content img{margin-right:10px;position:relative;top:-2px}.btn-shadow{display:block;width:136px;height:37px;border-radius:19px;position:absolute;top:2px;left:1px;-webkit-box-shadow:1px 0 9px rgba(187,37,48,0.6);box-shadow:1px 0 9px rgba(187,37,48,0.6);-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}#btn-github .btn-content{background-color:#4D62F6}#btn-github .btn-content:hover{background-color:#7086FF;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content:active{background-color:#4151CA;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content img{width:20px;top:-3px}#btn-github .btn-shadow{-webkit-box-shadow:1px 0 9px rgba(52,57,107,0.6);box-shadow:1px 0 9px rgba(52,57,107,0.6)}#btn-github:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(52,57,107,0.7);box-shadow:1px 3px 9px rgba(52,57,107,0.7)}#btn-weibo .btn-content{background-color:#FF414F}#btn-weibo .btn-content:hover{background-color:#FF6060;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content:active{background-color:#D72D3A;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content.zh{letter-spacing:5px}#btn-weibo .btn-content img{width:22px}#btn-weibo .btn-shadow{-webkit-box-shadow:1px 2px 7px rgba(187,37,48,0.5);box-shadow:1px 2px 7px rgba(187,37,48,0.5)}#btn-weibo:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(187,37,48,0.7);box-shadow:1px 3px 9px rgba(187,37,48,0.7)}#btn-twitter .btn-content{background-color:#00ACED}#btn-twitter .btn-content:hover{background-color:#67CFF6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content:active{background-color:#019CD6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content img{width:22px}#btn-twitter .btn-shadow{-webkit-box-shadow:1px 0 7px rgba(11,126,170,0.4);box-shadow:1px 0 7px rgba(11,126,170,0.4)}#btn-twitter:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(11,126,170,0.7);box-shadow:1px 3px 9px rgba(11,126,170,0.7)}@media (max-width: 992px){#home-section .description{width:80%;left:0;margin-left:10%}#feature-section .feature-detail h2{font-size:30px;margin-top:-15px}#feature-section .feature-detail h3{margin-top:15px}#feature-section .feature-detail p{margin-top:8px}#main-content .feature-btn{margin-top:15px}#col-desktop>*{margin-left:0}#col-data{padding-top:100px}#video-feature-1{width:64%;left:15%}}.mobile{display:none}@media (max-width: 768px){#main-content h2{font-size:24px}#main-content .feature-btn{margin:0 auto;margin-top:50px;text-align:center}.features{margin-bottom:0}.features p{margin-bottom:70px}#feature-section .feature-detail{-webkit-transform:none;-ms-transform:none;transform:none}#feature-section .feature-detail>.col{top:0;-webkit-transform:none;-ms-transform:none;transform:none;text-align:center}#feature-section .feature-detail .col-sm-4{margin-bottom:80px;padding-top:0}#reference{background-size:cover}#reference .people{height:180px}.pc{display:none}.mobile{display:block}}@media (max-width: 480px){#home-section .description{text-align:center;top:40%}#home-section .description .btn{display:block;margin:25px auto}#main-content #home-logo{margin-bottom:20px}#main-content #index-play-btn{display:block;width:120px;height:120px;margin:0 auto}#main-content #home-section .btn{background-color:white;color:#333743;text-shadow:none}#main-content h2{margin-top:20px}#main-content .video-index-btn{left:50%;margin-left:-30px;bottom:40px}#main-content #video-index-play:before{display:none}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:9%;bottom:10%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:20%}#about-section .btn-panel a{display:block;margin:20px auto}}.ch-main{position:relative;margin-top:100px;margin-left:100px}.ch-pc-chart{width:90%;height:280px;border-radius:12px;-webkit-box-shadow:6px 6px 22px #ccc;box-shadow:6px 6px 22px #ccc}.ch-pc-chart div{z-index:50 !important}.ch-mobile{position:absolute;right:0;width:180px;top:-30px;z-index:300}.ch-mobile-box{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ch-mobile-content{position:absolute;overflow:hidden;border-bottom-left-radius:5px;border-bottom-right-radius:5px;left:12%;right:12%;top:16%;bottom:15.5%;background:#333;z-index:300;padding:0;margin:0}.ch-mobile-chart{width:200%;height:200%;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scale(0.5);-ms-transform:scale(0.5);transform:scale(0.5);padding:0;margin:0}.ch-mobile-chart div div{z-index:50 !important}.ch-on-touch .ch-pc-chart{width:auto}.ch-on-touch .ch-mobile{display:none}@media (max-width: 768px){.ch-main{margin-left:0}}@media (max-width: 480px){.ch-main{margin-top:0}}#ec-example-main #left-container{top:71px}h1,h2,h3,h4,h5,h6,h7,p{font-weight:400;margin:0;padding:0}ul{list-style:none;padding:0;margin:0}img{max-width:100%}.clear :after{display:block;content:'';clear:both}iframe{border:1px solid #ccc}#download-table{margin:20px 0}#download-table td{padding:8px;text-align:left}#download-main{max-width:800px}#download-main .d-section{margin-top:20px;padding-top:20px}#download-main h2{font-size:25px;border-bottom:0;text-align:center;color:#293c55;text-align:left}#download-main h3{margin-top:40px;font-size:18px;font-weight:bold;text-align:left}#download-main h3.first{margin-top:-20px}#download-main p{text-align:left}#download-main .center{text-align:center}#download-main h4{margin:10px auto;margin-top:20px;font-size:16px;font-weight:bold;text-align:left}#download-main h4 .warn{color:#A9334C}#download-main .list-wrap{margin:20px 0 0 0}#download-main .d-section-version h2{margin-top:-30px}#download-main .checksum{text-align:left;margin:20px 0;border-left:0;padding:0}#download-main .checksum p,#download-main .checksum li{font-size:14px}#download-main li{list-style:inherit;margin:5px 0}.download-note{margin-top:12px;line-height:20px;font-size:14px;color:#999;text-align:left}.paper-desc{text-align:left;margin:20px -20px;padding:20px;background-color:#f5f7fd}.paper-desc .paper-title{font-size:16px;margin-top:5px;font-weight:bold}.paper-desc .paper-author{font-size:12px;margin:10px 0px;color:#999}.paper-desc .paper-journal{font-size:14px}#download-row{text-align:center}.d-section{padding-top:50px;padding-bottom:25px;text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);color:#6b7a89}.d-section{*zoom:1}.d-section:before,.d-section:after{display:table;line-height:0;content:""}.d-section:after{clear:both}.download-theme img{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.download-theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-main .d-section-version a,#download-main .d-section-gl a{text-decoration:none}#download-main .d-section-version a:hover .circle-wrap,#download-main .d-section-gl a:hover .circle-wrap{color:#fff;background-color:#45B4E8;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version a:active .circle-wrap,#download-main .d-section-version a:focus .circle-wrap,#download-main .d-section-gl a:active .circle-wrap,#download-main .d-section-gl a:focus .circle-wrap{color:#fff;background-color:#2997D6;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version .mode,#download-main .d-section-gl .mode{display:block;margin:38px 0 2px;font-size:17px}#download-main .d-section-version .text,#download-main .d-section-gl .text{margin-left:-10px;text-align:center;color:#333}#download-main .d-section-version .text span,#download-main .d-section-gl .text span{color:#333;opacity:0.7}.d-section-version{padding-bottom:50px}.d-section-version .row>div{height:220px}#download-main .circle-wrap{width:120px;height:120px;border-radius:50%;background-color:white;border:1px solid rgba(78,97,118,0.2);margin:0 auto;margin-bottom:15px;color:#293c55;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}.more-btn{position:relative;display:block;margin:20px auto;margin-bottom:10px}.more-btn:after{display:block;content:'';width:19px;height:18px;background-image:url("../images/btn-arrow.png");background-size:80% 80%;position:absolute;background-repeat:no-repeat;right:20px;top:13px}.more-btn+p{color:#6b7a89}.btn-two{margin-left:15px;margin-right:15px;margin-bottom:10px;position:relative;text-align:left;padding-left:45px !important}.d-section-map ul,.d-section-theme ul{*zoom:1}.d-section-map ul:before,.d-section-map ul:after,.d-section-theme ul:before,.d-section-theme ul:after{display:table;line-height:0;content:""}.d-section-map ul:after,.d-section-theme ul:after{clear:both}.d-section-map li,.d-section-theme li{float:left;width:260px}.d-section-map .first-item,.d-section-theme .first-item{margin-right:160px}.hover-shadow{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out}.hover-shadow:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-extension-container h2{color:#293c55;margin-bottom:5px}#download-extension-container p{margin:5px 0}#builder .warn{color:#e43c59;margin-top:10px;font-size:16px;line-height:25px}#builder ul{margin:0px;padding:0px}#builder li{list-style:none}#title h1 span{margin-left:20px;font-size:34px;color:#888;font-weight:100}#title .download-version{margin:5px;font-size:18px;font-weight:bold}#configuration{width:1000px;margin:0 auto}#configuration p.desc{color:#6b7a89;font-size:16px}#configuration h3{font-family:noto-thin;margin:26px 0}#configuration>section{border-bottom:1px solid #e5e5e5;text-align:left}#configuration>section p{margin:20px 0}#configuration h3{margin:10px 0;color:#3c485c;font-size:26px;font-weight:normal}#configuration h3 span{font-size:16px;margin-left:5px}#configuration ul{margin:10px}#configuration li{display:inline-block;vertical-align:top;margin:20px 18px;text-align:center;width:120px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}#configuration li input{display:none}#configuration li img{margin-top:5px;width:90px;height:90px;padding:5px 10px}#configuration li h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#configuration li h5 span{font-size:12px;margin-left:3px}#configuration li:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}#configuration li.checked{-webkit-box-shadow:0px 0px 15px #293c55;box-shadow:0px 0px 15px #293c55;border:1px solid rgba(41,60,85,0.6)}#configuration li.checked h5::before{content:'';width:15px;height:15px;background-size:15px 15px;background-image:url(../images/builder/checked.png);display:inline-block;position:absolute;right:0;top:-105px}#other input{margin:0 10px 0 0;vertical-align:middle}#other label{font-size:16px}#other p.desc{font-size:14px;padding-left:10px}#other a{color:black}#other .other-option{margin-left:15px}#action{margin-top:50px;margin-bottom:100px;text-align:center}#email{border:1px solid #ccc;border-radius:20px;line-height:2em;width:250px;padding:5px 20px;outline:none;margin-top:20px}#build{margin-top:20px}.clear{clear:both}#about-page{margin-top:60px;text-align:center}#about-page section{padding:40px 15px}#about-page .contributor{max-width:800px}#about-page h3{margin-bottom:20px}#about-page p{color:#888;margin:5px 0}#about-page h4.group{text-align:left;border-left:4px solid;padding-left:15px}#about-page h4.group.mentors{margin:0px 0 10px 0;border-color:#E86C4B}#about-page h4.group.code{margin:40px 0 10px 0;border-color:#40A7DC}#about-page h4.group.contributor{margin:40px 0 40px 0;border-color:#40A7DC}#about-page h4.group.companie{margin:40px 0 40px 0;border-color:#58A77C}#about-page h5{margin:5px 0;font-weight:bold}#about-page .about-person{margin:20px 0;height:150px}#about-page .about-person>a{display:inline-block;height:90px}#about-page .about-person>a img{height:88px}#about-page .about-person>a:hover img{-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);border-color:white}#about-page .about-person img{display:block;margin:0 auto;margin-bottom:10px;width:90px;border-radius:50%;border:4px solid white;border-color:transparent;-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0);box-shadow:0 4px 9px 0 rgba(46,37,37,0);-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s;-webkit-transition-timing-function:ease-in-out;-o-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}#about-page .about-person .about-desc{color:#888}#about-page .about-person.wait-for-you img{border:1px solid #ececec;padding:10px;margin-bottom:20px}#about-page .company{border-top:1px solid rgba(78,97,118,0.25);max-width:800px}#about-page .company h3{margin-bottom:40px}#about-page .company .col-md-3{height:80px}#about-send-logo{margin:20px 0 50px 0}#about-send-logo p{margin-top:10px}.not-found{padding:150px 0 160px;height:100%;background-color:#2a3c54;overflow:hidden}.not-found img{display:block;width:60%;margin:0 auto}.not-found .text{margin-top:50px;text-align:center;font-size:20px;color:#fff}.not-found .link{margin-left:10px;color:#3183c6}@media (max-width: 768px){.not-found .text{padding:0 15px;font-size:14px}}#maps .links{text-align:center}#maps .links a{display:inline-block;margin:0 5px}#maps h3{margin-top:20px}#maps h3 span{font-size:0.7em;display:inline-block;margin:0 4px}#maps h5{text-align:center}#maps .province{margin-top:10px;margin-bottom:10px}#maps #map-list{padding-bottom:40px}#maps section p{margin-bottom:0;color:#6b7a89}#map-example{margin-top:30px;margin-bottom:100px;line-height:2em;font-size:14px}#map-example h4{margin:20px 0 10px 0}#map-example .prettyprint{padding:10px;border:#ccc 1px solid}#themes{max-width:800px}#themes p.desc{color:#888}#themes h1{text-align:center}#themes h3 span{font-size:16px;margin-left:5px}#themes .theme{text-align:center}#themes .theme img{margin-top:20px;width:285px;-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out;cursor:pointer}#themes .theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#theme-configure-section{margin-top:40px}#theme-example{margin:50px 0 80px 0;line-height:2em;font-size:14px}#theme-example h4{margin:20px 0 10px 0}#theme-example .prettyprint{padding:10px;border:#ccc 1px solid}#theme-builder{margin:30px 0;text-align:center}#changelog{width:700px;margin:0 auto;margin-top:100px;margin-bottom:100px;font-family:'Microsoft Yahei'}#changelog p.desc{margin:10px 0}#changelog p{font-weight:normal}#changelog .time{color:#888;float:right;margin-top:-35px;margin-right:10px}#changelog h2{margin-top:50px;border-bottom:1px solid #ccc;padding-bottom:5px;margin-bottom:10px}#changelog strong{color:#c12c2c}#changelog strong a{color:#3cafa4}#changelog>ul{margin-left:-10px}#changelog li{margin:10px 0;padding:0 20px}#changelog pre{margin:10px 20px;border:none}#ec-doc-main{position:absolute;left:0;right:0;top:0;bottom:0}@media (max-width: 600px){#ec-doc-main{-webkit-overflow-scrolling:touch;position:static}#ec-doc-nav{position:static;margin-bottom:0}}#extension{margin-bottom:-40px}#extension .nav-container{text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);height:52px}#extension .nav-tabs{display:inline-block;border-bottom:none}#extension .nav-tabs li>a{border:none;color:#293c55}#extension .nav-tabs li>a:hover{background:transparent}#extension .nav-tabs li.active>a{color:#a9334c;border-bottom:4px solid #a9334c}#extension .tab-content{margin:40px 0}.extension{margin:10px 0 40px 0}.extension-content{-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.1);border-radius:4px}.extension-head{display:block}.extension-img{width:100%}.extension-info{padding:10px 15px;height:132px;overflow:hidden}@media (min-width: 992px){.extension-info:lang(en){height:195px}.extension-info:lang(zh){height:155px}}@media (min-width: 768px){.extension-info:lang(en){height:215px}}.extension-name{font-size:18px}.extension-author{margin-bottom:5px}.extension-author-name{display:inline-block;margin-right:5px}.extension-author-name+.extension-author-name{opacity:0.5}#submit-extension{text-align:center;padding-top:60px;padding-bottom:40px;background:#F4F7FC}#submit-extension h3{margin-bottom:10px}#submit-extension p{margin:2px 0;color:#6b7a89}#submit-extension a.btn{margin:20px 0 5px 0}#faq-page .page-detail li{margin:10px 0;list-style:circle}#maillist ul{list-style:circle;font-size:16px;padding-left:40px}#maillist li{margin:10px 0}#cheat-selector{margin-bottom:20px}#cheat-selector .selected .btn{background-color:#293c55;border-color:#162436;color:white}#cheat-chart{width:100%;height:400px}#cheat-detail{min-height:100px}#cheat-detail .desc{margin:10px 0 20px 0;font-size:14px;color:#555}.page-cheatsheet h2{font-size:22px;margin-top:30px;margin-bottom:10px}.page-cheatsheet h2:first-child{margin-top:0}.cheat-chart-item{display:inline-block;vertical-align:top;margin:20px 11px;text-align:center;width:120.5px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}.cheat-chart-item:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}.cheat-chart-item a{text-decoration:none}.cheat-chart-item img{margin-top:5px;width:90px;height:90px;padding:5px 10px}.cheat-chart-item h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#apache-banner{position:fixed;left:0;right:0;bottom:0;padding:20px 40px 0;z-index:10000;background-color:rgba(0,0,0,0.6);color:#fff;display:none}#apache-banner .txt{width:80%;height:100%;display:inline-block}#apache-banner p{margin:5px 0}#apache-banner p a{color:#fff;text-decoration:underline}#apache-banner .btn{position:relative;bottom:20px;width:20%;height:100%;display:inline-block;background-color:#a9334c;border-radius:6px;color:#fff;padding:10px}#apache-banner .btn:hover{-webkit-box-shadow:none;box-shadow:none}#apache-banner .close-btn{position:absolute;padding:5px;right:15px;top:15px;color:#fff}#apache-banner .close-btn:hover{text-decoration:none}@media (max-width: 768px){#apache-banner{padding:15px}#apache-banner .txt{width:100%;height:auto;display:block;margin-top:20px}#apache-banner .btn{width:100%;height:auto;display:block;top:0}#apache-banner .close-btn{top:10px}}.pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pace-inactive{display:none}.pace .pace-progress{background:#e43c59;position:fixed;z-index:100000;top:0;right:100%;width:100%;height:2px}.pace .pace-progress-inner{display:block;position:absolute;right:0px;width:100px;height:100%;-webkit-box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;opacity:1.0;-webkit-transform:rotate(3deg) translate(0px, -4px);-ms-transform:rotate(3deg) translate(0px, -4px);transform:rotate(3deg) translate(0px, -4px)}.btn-main{border-radius:20px;padding:8px 50px;-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s}.btn-main+.btn{margin-left:15px}.btn-main img{width:20px;margin-right:10px;margin-top:-2px;margin-left:-5px}.btn-main:hover{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-main:focus,.btn-main:active{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-thirdary{width:180px;-webkit-box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);background-color:#3FA5DC;padding:9px 10px;color:white;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.btn-thirdary:hover{color:white;background-color:#45B4E8}.btn-thirdary:focus,.btn-thirdary:active{color:white;background-color:#2997D6}.btn-blue{background-color:#47ACE3;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4)}.btn-blue:hover{background-color:#46B5F1;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-blue:focus{background-color:#2E9FDC;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-red{background-color:#FF424F;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4);box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4)}.btn-red:hover{background-color:#FF4F4B;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-red:focus{background-color:#EE2A38;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-green{background-color:#80BB6A;color:white}.btn-green:hover,.btn-green:focus{background-color:#95CC81;color:white;-webkit-box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4);box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4)}.btn-index-home{background-color:transparent;border:1px solid white;color:white}.btn-index-home:hover,.btn-index-home:focus{background-color:white;color:#333743;-webkit-box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3);box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3)}.btn-default{background-color:white;color:#40A7DC;border:1px solid #40A7DC}.btn-default:hover,.btn-default:focus{background-color:#40A7DC;color:white;border:1px solid #40A7DC}.btn-group{margin:0 5px}.btn-group .caret{margin-left:5px}::-webkit-scrollbar{height:8px;width:8px;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-button{display:none}::-webkit-scrollbar-thumb{width:8px;min-height:15px;background:rgba(50,50,50,0.3) !important;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.5) !important}
diff --git a/en/dependencies.html b/en/dependencies.html
index a105e09..6be86e4 100644
--- a/en/dependencies.html
+++ b/en/dependencies.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Dependencies - Apache ECharts (incubating)</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Dependencies</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content"><div class="container"><h2>ZRender</h2><p>ECharts depends on <a href="https://github.com/ecomfe/zrender">ZRender</a>, a lightweight canvas library which provides 2d draw.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Dependencies</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content"><div class="container"><h2>ZRender</h2><p>ECharts depends on <a href="https://github.com/ecomfe/zrender">ZRender</a>, a lightweight canvas library which provides 2d draw.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/documents/tutorial-parts/tutorial.js b/en/documents/tutorial-parts/tutorial.js
index 6b138da..7028dc1 100644
--- a/en/documents/tutorial-parts/tutorial.js
+++ b/en/documents/tutorial-parts/tutorial.js
@@ -6,7 +6,7 @@
     "desc": "<p>In most cases, Apache ECharts (incubating)<sup>TM</sup> builds can be get from  <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> or from the <code class=\"codespan\">echarts/dist</code> directory in our <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub project</a>, where\nthese pre-builds are provided:</p>\n<ul>\n<li>Complete verion: <code class=\"codespan\">echarts/dist/echarts.js</code>, including all charts and components (see <code class=\"codespan\">echarts/echarts.all.js</code> for detail), but has maximum file size.</li>\n<li>Common version: <code class=\"codespan\">echarts/dist/echarts.common.js</code>, including common charts and components (see <code class=\"codespan\">echarts/echarts.common.js</code> for detail), moderate file size.</li>\n<li>Simple version: <code class=\"codespan\">echarts/dist/echarts.simple.js</code>, including a smaller subset of the most common charts and components (see <code class=\"codespan\">echarts/echarts.simple.js</code> for detail), small file size.</li>\n</ul>\n<p>We can also build echarts ourselves, which enables to only include the charts and components you needed. You can customize your ECharts build by using one of these approaches:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/en/builder.html\" target=\"_blank\">Online custom build tool</a> is relatively convenient.</li>\n<li>The script <code class=\"codespan\">echarts/build/build.js</code> found in the project is flexible for module selecting, and supports multi-language builds</li>\n<li>Build ECharts and your project directly by using tools such as <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>, <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a></li>\n</ul>\n<p>There are some examples to illustrate the latter two approaches below.</p>\n<h2 id=\"prepare-create-our-project-and-install-echarts\">Prepare: create our project and install echarts</h2>\n<p>Create a sample project using the command line</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>Then in the <code class=\"codespan\">myProject</code> directory, initialize <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> environment and install echarts (assume that <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> has been installed):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>The installed echarts is in the <code class=\"codespan\">myProject/node_modules</code> directory, which can be used in our project directly. For example:</p>\n<p>Use ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>Use CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>Next, we just describe our examples in ES Module way.</p>\n<h2 id=\"create-custom-build-by-echarts-build-build-js\">Create custom build by <code class=\"codespan\">echarts/build/build.js</code></h2>\n<p>In this example, for minimizing file size, we will build a echarts bundle with only pie chart included, and create a web page to show it.</p>\n<p>echarts has provided a script <code class=\"codespan\">echarts/build/build.js</code> as a build tool (<a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> is required to execute it). Now we can use the command below in the <code class=\"codespan\">myProject</code> directory to check its help info:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>These options can be used in this example:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>: Entry file of the echarts code. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">-o</code>: The bundle file path. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">--min</code>: Whether to compress file (not by default), and remove the code that is for printing error and warning info.</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>: Whether to use the specified language (Chinese by default). For example: <code class=\"codespan\">--lang en</code> means using English, <code class=\"codespan\">--lang my/langXX.js</code> means using <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> to substitute <code class=\"codespan\">echarts/lib/lang.js</code> while buiding.</li>\n<li><code class=\"codespan\">--sourcemap</code>: Whether to output source map, which is useful in debug.</li>\n<li><code class=\"codespan\">--format</code>: The format of output. Can be <code class=\"codespan\">&#39;umb&#39;</code>(default), <code class=\"codespan\">&#39;amd&#39;</code>, <code class=\"codespan\">&#39;iife&#39;</code>, <code class=\"codespan\">&#39;cjs&#39;</code>, <code class=\"codespan\">&#39;es&#39;</code>.</li>\n</ul>\n<p>Now we want to create a echarts bundle that only supports pie chart, we should firstly create an entry file (say <code class=\"codespan\">myProject/echarts.custom.js</code>) to import modules we need:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts and export them.\nexport * from &#39;echarts/src/echarts&#39;;\n// Import pie chart.\nimport &#39;echarts/src/chart/pie&#39;;\n// In this case, modules in either `echarts/src` or `echarts/lib`\n// can be imported (but should not be mixed). See\n// &quot;Use `echarts/lib/**` or `echarts/src/**`&quot; below.\n</code></pre>\n<p>Then we can use command below in <code class=\"codespan\">myProject</code> directory to build the bundle:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>Now the bundle <code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> has been created. Then we can create a web page (say <code class=\"codespan\">myProject/pie.html</code>) to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- import the bundle `lib/echarts.custom.js`. --&gt;\n    &lt;script src=&quot;lib/echarts.custom.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // Create a pie chart:\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/pie.html</code> in a browser, we can see the pie chart:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"modules-that-are-permitted-to-be-imported\">Modules that are permitted to be imported</h2>\n<p>All of the permitted modules are declared in <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> and <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a>. Other modules in the source code of echarts and zrender <strong>SHOULD NOT BE IMPORTED</strong>, because they are inner modules, whose interfaces and functionalities may be modified in the subsequent upgrades of echarts.</p>\n<h2 id=\"use-echarts-lib-or-echarts-src-\">Use <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code>?</h2>\n<ul>\n<li>If intending to import part of echarts modules in your project and build yourself, only <code class=\"codespan\">echarts/lib/**</code> can be used, <code class=\"codespan\">echarts/src/**</code> should not be used.</li>\n<li>If using <code class=\"codespan\">echarts/build/build.js</code> to make a bundle, either <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code> can be used (should not be mixed), where <code class=\"codespan\">echarts/src/**</code> brings smaller bundle size a little.</li>\n</ul>\n<blockquote>\n<p>Reason: currently, <code class=\"codespan\">echarts/src/**</code> is the source code that using ES Module, and they are transpiled to CommonJS code and placed in <code class=\"codespan\">echarts/lib/**</code>. (This transformation is for backward compatible with old version of NodeJS and webpack that do not support ES Module.)\nHistorically, echarts extensions and user projects have been using the package path <code class=\"codespan\">echarts/lib/**</code>. So it should not be changed, otherwise, mixed using both <code class=\"codespan\">echarts/src/**</code> and <code class=\"codespan\">echarts/lib/**</code> will generate two echarts namespace and bring some problems. But it is not an issue when using <code class=\"codespan\">echarts/build/build.js</code> to create a bundle, where ES modules in <code class=\"codespan\">echarts/src/**</code> can be analyzed statically for smaller bundle size.</p>\n</blockquote>\n<h2 id=\"build-echarts-and-our-project-directly-by-rollup\">Build echarts and our project directly by rollup</h2>\n<p>Now we have known that how to create custom build by <code class=\"codespan\">echarts/build/build.js</code>. Alternatively, we can bundle echarts and our project directly by the tool like <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> or <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>. In some project, this approach is required. Next we only go with <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, because <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> and <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> are in the similar way.</p>\n<p>Firstly install <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> in <code class=\"codespan\">myProject</code> directory:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>Then we create a project JS file <code class=\"codespan\">myProject/line.js</code> for line chart rendering:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts.\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// Import line chart.\nimport &#39;echarts/lib/chart/line&#39;;\n// Import components of tooltip, title and toolbox.\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// Render line chart and components.\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>The created module <code class=\"codespan\">myProject/line.js</code> can not work directly in the browsers that do not support ES Module. So we need to build them. Before we run <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, a config file <code class=\"codespan\">myProject/rollup.config.js</code> should be created:</p>\n<pre><code class=\"lang-js\">// Responsible for looking for modules in `node_module` directory. For example,\n// if there is code `import &#39;echarts/lib/chart/line&#39;;`, the module file\n// `node_module/echarts/lib/chart/line.js` can be find by this plugin.\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// Responsible for compress code.\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// Support multi-language.\nimport ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // The entry file.\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        ecLangPlugin({lang: &#39;en&#39;}), // Use english\n        // Remove the snippet in `__DEV__`, which mainly prints error log.\n        uglify()\n    ],\n    output: {\n        // Output file in the format of &#39;umd&#39;.\n        format: &#39;umd&#39;,\n        // Output source map.\n        sourcemap: true,\n        // The path of the output bundle.\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>Then execute the following command in <code class=\"codespan\">myProject</code> directory to start the build:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p><code class=\"codespan\">-c</code> indicate <code class=\"codespan\">rollup</code> to use <code class=\"codespan\">myProject/rollup.config.js</code> as the config file.</p>\n</blockquote>\n<p>The created bundle <code class=\"codespan\">myProject/lib/line.min.js</code> includes project code and part of echarts code that we requried. Now we create a web page <code class=\"codespan\">myProject/line.html</code> to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- Import the created bundle: --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/line.html</code> in a browser, we will get:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"multi-language\">Multi-language</h2>\n<p>In the example above, we can notice that the label of the <code class=\"codespan\">toolbox</code> component is in English. Essentially any text can be customized by <code class=\"codespan\">echarts option</code>, but if we want to show label in a certain language by default, we have to specify the language while building the code.</p>\n<p>For example:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>It means that the pre-defined English text is used. Moreover, can be <code class=\"codespan\">--lang fi</code>.</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>It means that <code class=\"codespan\">myProject/my/langXX.js</code> is used to substitute <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> while performing build. So we can customize text in our language in <code class=\"codespan\">myProject/my/langXX.js</code>. Notice, <code class=\"codespan\">-o</code> or <code class=\"codespan\">--output</code> must be specified in the approach.</p>\n<p>Besides, the same lang parameter can be pass to <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code>.</p>\n"
   },
   "Use ECharts with webpack": {
-    "desc": "<p><a href=\"https://webpack.js.org//\" target=\"_blank\">Webpack</a> is a popular module packaging tool, which can be used easily to import and packaging Apache ECharts (incubating)<sup>TM</sup>. Here we assume you already have certain understanding about webpack and used it in your project.</p>\n<h2 id=\"use-npm-to-install-echarts\">Use npm to install ECharts</h2>\n<p>You can use the following command to install ECharts with npm.</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"include-echarts\">Include ECharts</h2>\n<p>ECharts and zrender installed by npm will be placed under <code class=\"codespan\">node_modules</code>. You can obtain echarts directly in project with <code class=\"codespan\">require(&#39;echarts&#39;)</code>.</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts entry example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"include-echarts-charts-and-components-on-demand\">Include ECharts charts and components on demand</h2>\n<p>By default, <code class=\"codespan\">require(&#39;echarts&#39;)</code> returns the whole ECharts package including all charts and components, so the package size is a bit large. If you have a strict demand of package size, you may include packages on demand.</p>\n<p>For example, the code above only uses bar chart, tooltip and title component, so you only need to include these modules, effectively making the package size from more than 400 KB to about 170 KB.</p>\n<pre><code class=\"lang-js\">// include ECharts main module\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// include bar chart\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// include tooltip and title component\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts introductory example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>Available modules see <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>The same goes for another popular packaging tools <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>, which will not be introduced again here. Using <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> to make a custom build of echarts is introduced in <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">Create Custom Build of ECharts</a></p>\n"
+    "desc": "<p><a href=\"https://webpack.js.org/\" target=\"_blank\">Webpack</a> is a popular module packaging tool, which can be used easily to import and packaging Apache ECharts (incubating)<sup>TM</sup>. Here we assume you already have certain understanding about webpack and used it in your project.</p>\n<h2 id=\"use-npm-to-install-echarts\">Use npm to install ECharts</h2>\n<p>You can use the following command to install ECharts with npm.</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"include-echarts\">Include ECharts</h2>\n<p>ECharts and zrender installed by npm will be placed under <code class=\"codespan\">node_modules</code>. You can obtain echarts directly in project with <code class=\"codespan\">require(&#39;echarts&#39;)</code>.</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts entry example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"include-echarts-charts-and-components-on-demand\">Include ECharts charts and components on demand</h2>\n<p>By default, <code class=\"codespan\">require(&#39;echarts&#39;)</code> returns the whole ECharts package including all charts and components, so the package size is a bit large. If you have a strict demand of package size, you may include packages on demand.</p>\n<p>For example, the code above only uses bar chart, tooltip and title component, so you only need to include these modules, effectively making the package size from more than 400 KB to about 170 KB.</p>\n<pre><code class=\"lang-js\">// include ECharts main module\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// include bar chart\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// include tooltip and title component\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts introductory example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>Available modules see <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>The same goes for another popular packaging tools <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>, which will not be introduced again here. Using <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> to make a custom build of echarts is introduced in <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">Create Custom Build of ECharts</a></p>\n"
   },
   "ECharts Basic Concepts Overview": {
     "desc": "<p>This chapter describes some of the common concepts and terms of Apache ECharts (incubating)<sup>TM</sup>.</p>\n<h2 id=\"echarts-instance\">ECharts instance</h2>\n<p>We can create multiple <code class=\"codespan\">echarts instances</code> in a webpage. In each <code class=\"codespan\">echarts instance</code> we can create multiple diagrams, coordinate systems, etc. (described by <code class=\"codespan\">option</code>). With a DOM element prepared (as the container of an echarts instance), we can create a <code class=\"codespan\">echarts instance</code> based on that element. Each <code class=\"codespan\">echarts instance</code> takes its DOM element exclusively.</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"series\">Series</h2>\n<p><a href=\"option.html#series\" target=\"_blank\">series</a> is a very common term. In echarts, <a href=\"option.html#series\" target=\"_blank\">series</a> represents a series of value and the diagram generated from them. So the concept <a href=\"option.html#series\" target=\"_blank\">series</a> includes these key points: a series of value, the type of the diagram (<code class=\"codespan\">series.type</code>) and other parameters specified for the mapping from the values to a diagram.</p>\n<p>In echarts, the <code class=\"codespan\">series.type</code> and the &quot;diagram type&quot; are the same concept. <code class=\"codespan\">series.type</code> includes: <a href=\"option.html#series-line\" target=\"_blank\">line</a> (line plot), <a href=\"option.html#series-bar\" target=\"_blank\">bar</a> (bar chart), <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart), <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a> (scatter plot), <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> (graph plot), <a href=\"option.html#series-tree\" target=\"_blank\">tree</a> (tree plot), etc.</p>\n<p>In the example below, there are three <a href=\"option.html#series\" target=\"_blank\">series</a> (<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>) declared in the <code class=\"codespan\">option</code> on the right, where <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> are declared in each series:</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>Similarly, the following example shows another style of <code class=\"codespan\">option</code>, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"component\">Component</h2>\n<p>Over series, the entities in echarts are abstracted using the term &quot;component&quot;. For example, echarts includes these components: <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> (the x axis of Cartesian coordinate system), <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> (the y axis of Cartesian coordinate system), <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard of Cartesian coordinate system), <a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a> (the angle axis of polar coordinate system), <a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a> (the radius axis of polar coordinate system), <a href=\"option.html#polar\" target=\"_blank\">polar</a> (the baseboard of polar coordinate system), <a href=\"option.html#geo\" target=\"_blank\">geo</a> (GEO coordinate system), <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> (the component for changing the displayed range of data), <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> (the component for specifying the visual mapping), <a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a> (the tooltip component), <a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a> (the toolbox component), <a href=\"option.html#series\" target=\"_blank\">series</a>, etc.</p>\n<p>Notice that <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, a component for rendering diagram.</p>\n<p>Check the example below. Components (including series) are declared in <code class=\"codespan\">option</code> on the right, and the are finally rendered in the echarts instance.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>Notice: although <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, sometimes we can see phrases like &quot;series and components&quot;. The term &quot;component&quot; in this context actually means &quot;components except series&quot;.</p>\n<h2 id=\"define-charts-using-option\">Define charts using option</h2>\n<p>We have met the term <code class=\"codespan\">option</code> above. Users should use <code class=\"codespan\">option</code> to describe all of their requirements and input it to echarts. The requirements includes: &quot;what does the data like&quot;, &quot;what the diagram we need&quot;, &quot;what components we need&quot;, &quot;what the user interactions we need&quot;, etc. In short, <code class=\"codespan\">option</code> defines: <code class=\"codespan\">data</code>, <code class=\"codespan\">visual mapping</code>, <code class=\"codespan\">interaction</code>.</p>\n<pre><code class=\"lang-js\">// Create an echarts instance.\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// Use option to describe `data`, `visual mapping`, `interaction`, ...\n// `option` is a big JavaScript object.\nvar option = {\n    // Each property represents a kind of components.\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // If there are more than one components in one kind, we use an array.\n    // For example, there are three x axes here.\n    xAxis: [\n        // Each item represents an instance of component.\n        // `type` is used to indicate the sub-type of the component.\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // There are multiple series, using an array.\n    series: [\n        // `type` is also used to indicate the sub-type\n        // (i.e., diagram type) of each series.\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// Call `setOption` and input the `option`. And then the\n// echarts instance processes data and renders charts.\nchart.setOption(option);\n</code></pre>\n<p>Data is put in <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> in the above example. And we give another example showing another way, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // Each series retrieves data from `dataset`. The values in `encode`\n        // are the indices of the dimensions (i.e., column) of `dataset.source`.\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"position-a-component\">Position a component</h2>\n<p>These approaches are used to Position a component.</p>\n<p><br></p>\n<p><strong>[Absolute positioning like CSS]</strong></p>\n<p><br></p>\n<p>Most components and series can be absolutely positioned according to <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code>. This approach is like the absolute positioning in CSS. The absolute positioning is based on the container DOM element of the echarts.</p>\n<p>The value of each attribute can be:</p>\n<ul>\n<li>Absolute value (like <code class=\"codespan\">bottom: 54</code>, means: the distance from the boundary of the echarts container to bottom boundary of the component is <code class=\"codespan\">54</code> pixel).</li>\n<li>Or the percentage based on the width/height of the echarts container (like <code class=\"codespan\">right: &#39;20%&#39;</code>, means: the distance from the boundary of the echarts container to the right boundary of this component is <code class=\"codespan\">20%</code> of the width of the echarts container).</li>\n</ul>\n<p>Check the example below, where the <a href=\"option.html#grid\" target=\"_blank\">grid</a> component (that is the baseboard of a Cartesian coordinate system) are configured with <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code>.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>Note that <code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> are one group of attributes for horizontal layout, while <code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> are another group of attributes for vertical layout. The two groups have nothing to do with each other. In each group, it is enough to set only one or at most two attributes. For example, when <code class=\"codespan\">left</code> and <code class=\"codespan\">right</code> have been specified, <code class=\"codespan\">width</code> can be automatically calculated by them.</p>\n<p><br></p>\n<p><strong>[Center-radius positioning]</strong></p>\n<p><br></p>\n<p>A few circular components or series need to be positioned by &quot;center&quot; and &quot;radius&quot;. For example, <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a> (sunburst chart)、<a href=\"option.html#polar\" target=\"_blank\">polar</a> (polar coordinate system).</p>\n<p>As the name implies, it position the component according to <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a> and <a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>.</p>\n<p><br></p>\n<p><strong>[Other positioning]</strong></p>\n<p><br></p>\n<p>A few other components may has their own specific positioning approach. Check their docs before using them.</p>\n<h2 id=\"coordinate-system\">Coordinate system</h2>\n<p>Many series, like <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>, <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>, <a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>, etc., need to work on a coordinate system. Coordinate system is used to layout each graphic elements and display some ticks and labels. For example, echarts at least provides these coordinate systems: <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a>, <a href=\"option.html#singleAxis\" target=\"_blank\">single axis coordinate system</a>, <a href=\"option.html#calendar\" target=\"_blank\">calendar coordinate system</a>, etc. Some other series like <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-tree\" target=\"_blank\">tree</a>, work independently without any coordinate systems. And still some other series like <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> are available either independently or on some coordinate system, depending on user settings.</p>\n<p>A coordinate system may consist of several components. For example, Cartesian coordinate system consists of <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard). <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> are referenced and assembled by <code class=\"codespan\">grid</code> and work together cooperatively.</p>\n<p>The following example demonstrates the most simple way to use a Cartesian coordinate system, where only <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> are declared, and <code class=\"codespan\">echarts</code> create and a <code class=\"codespan\">grid</code> implicitly to link them.</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>And the following example demonstrates a more complicated case, where two <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> share one <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>. And the two <code class=\"codespan\">series</code> are also share the <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, but use different <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> respectively. The property <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> is used to specify which <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> is used.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>The following echarts instance contain more than one <a href=\"option.html#grid\" target=\"_blank\">grid</a>. Each <a href=\"option.html#grid\" target=\"_blank\">grid</a> has its own <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>. The properties <a href=\"option.html#series-line.xAxisIndex\" target=\"_blank\">xAxisIndex</a>, <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> and <a href=\"option.html#yAxis.gridIndex\" target=\"_blank\">gridIndex</a> are used to specify the reference relationships.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>Moreover, a type of series is usually available on various coordinate systems. For example, a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> can work on <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a> or other coordinate systems. Similarly, a coordinate system can serve different type of series. As the examples shown above, a <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a> serves several <a href=\"option.html#series-line\" target=\"_blank\">line series</a> and <a href=\"option.html#series-bar\" target=\"_blank\">bar series</a>.</p>\n"
diff --git a/en/documents/tutorial-parts/tutorial.json b/en/documents/tutorial-parts/tutorial.json
index 9a8ccd2..f258681 100644
--- a/en/documents/tutorial-parts/tutorial.json
+++ b/en/documents/tutorial-parts/tutorial.json
@@ -6,7 +6,7 @@
     "desc": "<p>In most cases, Apache ECharts (incubating)<sup>TM</sup> builds can be get from  <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> or from the <code class=\"codespan\">echarts/dist</code> directory in our <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub project</a>, where\nthese pre-builds are provided:</p>\n<ul>\n<li>Complete verion: <code class=\"codespan\">echarts/dist/echarts.js</code>, including all charts and components (see <code class=\"codespan\">echarts/echarts.all.js</code> for detail), but has maximum file size.</li>\n<li>Common version: <code class=\"codespan\">echarts/dist/echarts.common.js</code>, including common charts and components (see <code class=\"codespan\">echarts/echarts.common.js</code> for detail), moderate file size.</li>\n<li>Simple version: <code class=\"codespan\">echarts/dist/echarts.simple.js</code>, including a smaller subset of the most common charts and components (see <code class=\"codespan\">echarts/echarts.simple.js</code> for detail), small file size.</li>\n</ul>\n<p>We can also build echarts ourselves, which enables to only include the charts and components you needed. You can customize your ECharts build by using one of these approaches:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/en/builder.html\" target=\"_blank\">Online custom build tool</a> is relatively convenient.</li>\n<li>The script <code class=\"codespan\">echarts/build/build.js</code> found in the project is flexible for module selecting, and supports multi-language builds</li>\n<li>Build ECharts and your project directly by using tools such as <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>, <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a></li>\n</ul>\n<p>There are some examples to illustrate the latter two approaches below.</p>\n<h2 id=\"prepare-create-our-project-and-install-echarts\">Prepare: create our project and install echarts</h2>\n<p>Create a sample project using the command line</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>Then in the <code class=\"codespan\">myProject</code> directory, initialize <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> environment and install echarts (assume that <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> has been installed):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>The installed echarts is in the <code class=\"codespan\">myProject/node_modules</code> directory, which can be used in our project directly. For example:</p>\n<p>Use ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>Use CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>Next, we just describe our examples in ES Module way.</p>\n<h2 id=\"create-custom-build-by-echarts-build-build-js\">Create custom build by <code class=\"codespan\">echarts/build/build.js</code></h2>\n<p>In this example, for minimizing file size, we will build a echarts bundle with only pie chart included, and create a web page to show it.</p>\n<p>echarts has provided a script <code class=\"codespan\">echarts/build/build.js</code> as a build tool (<a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> is required to execute it). Now we can use the command below in the <code class=\"codespan\">myProject</code> directory to check its help info:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>These options can be used in this example:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>: Entry file of the echarts code. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">-o</code>: The bundle file path. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">--min</code>: Whether to compress file (not by default), and remove the code that is for printing error and warning info.</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>: Whether to use the specified language (Chinese by default). For example: <code class=\"codespan\">--lang en</code> means using English, <code class=\"codespan\">--lang my/langXX.js</code> means using <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> to substitute <code class=\"codespan\">echarts/lib/lang.js</code> while buiding.</li>\n<li><code class=\"codespan\">--sourcemap</code>: Whether to output source map, which is useful in debug.</li>\n<li><code class=\"codespan\">--format</code>: The format of output. Can be <code class=\"codespan\">&#39;umb&#39;</code>(default), <code class=\"codespan\">&#39;amd&#39;</code>, <code class=\"codespan\">&#39;iife&#39;</code>, <code class=\"codespan\">&#39;cjs&#39;</code>, <code class=\"codespan\">&#39;es&#39;</code>.</li>\n</ul>\n<p>Now we want to create a echarts bundle that only supports pie chart, we should firstly create an entry file (say <code class=\"codespan\">myProject/echarts.custom.js</code>) to import modules we need:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts and export them.\nexport * from &#39;echarts/src/echarts&#39;;\n// Import pie chart.\nimport &#39;echarts/src/chart/pie&#39;;\n// In this case, modules in either `echarts/src` or `echarts/lib`\n// can be imported (but should not be mixed). See\n// &quot;Use `echarts/lib/**` or `echarts/src/**`&quot; below.\n</code></pre>\n<p>Then we can use command below in <code class=\"codespan\">myProject</code> directory to build the bundle:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>Now the bundle <code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> has been created. Then we can create a web page (say <code class=\"codespan\">myProject/pie.html</code>) to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- import the bundle `lib/echarts.custom.js`. --&gt;\n    &lt;script src=&quot;lib/echarts.custom.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // Create a pie chart:\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/pie.html</code> in a browser, we can see the pie chart:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"modules-that-are-permitted-to-be-imported\">Modules that are permitted to be imported</h2>\n<p>All of the permitted modules are declared in <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> and <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a>. Other modules in the source code of echarts and zrender <strong>SHOULD NOT BE IMPORTED</strong>, because they are inner modules, whose interfaces and functionalities may be modified in the subsequent upgrades of echarts.</p>\n<h2 id=\"use-echarts-lib-or-echarts-src-\">Use <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code>?</h2>\n<ul>\n<li>If intending to import part of echarts modules in your project and build yourself, only <code class=\"codespan\">echarts/lib/**</code> can be used, <code class=\"codespan\">echarts/src/**</code> should not be used.</li>\n<li>If using <code class=\"codespan\">echarts/build/build.js</code> to make a bundle, either <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code> can be used (should not be mixed), where <code class=\"codespan\">echarts/src/**</code> brings smaller bundle size a little.</li>\n</ul>\n<blockquote>\n<p>Reason: currently, <code class=\"codespan\">echarts/src/**</code> is the source code that using ES Module, and they are transpiled to CommonJS code and placed in <code class=\"codespan\">echarts/lib/**</code>. (This transformation is for backward compatible with old version of NodeJS and webpack that do not support ES Module.)\nHistorically, echarts extensions and user projects have been using the package path <code class=\"codespan\">echarts/lib/**</code>. So it should not be changed, otherwise, mixed using both <code class=\"codespan\">echarts/src/**</code> and <code class=\"codespan\">echarts/lib/**</code> will generate two echarts namespace and bring some problems. But it is not an issue when using <code class=\"codespan\">echarts/build/build.js</code> to create a bundle, where ES modules in <code class=\"codespan\">echarts/src/**</code> can be analyzed statically for smaller bundle size.</p>\n</blockquote>\n<h2 id=\"build-echarts-and-our-project-directly-by-rollup\">Build echarts and our project directly by rollup</h2>\n<p>Now we have known that how to create custom build by <code class=\"codespan\">echarts/build/build.js</code>. Alternatively, we can bundle echarts and our project directly by the tool like <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> or <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>. In some project, this approach is required. Next we only go with <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, because <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> and <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> are in the similar way.</p>\n<p>Firstly install <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> in <code class=\"codespan\">myProject</code> directory:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>Then we create a project JS file <code class=\"codespan\">myProject/line.js</code> for line chart rendering:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts.\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// Import line chart.\nimport &#39;echarts/lib/chart/line&#39;;\n// Import components of tooltip, title and toolbox.\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// Render line chart and components.\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>The created module <code class=\"codespan\">myProject/line.js</code> can not work directly in the browsers that do not support ES Module. So we need to build them. Before we run <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, a config file <code class=\"codespan\">myProject/rollup.config.js</code> should be created:</p>\n<pre><code class=\"lang-js\">// Responsible for looking for modules in `node_module` directory. For example,\n// if there is code `import &#39;echarts/lib/chart/line&#39;;`, the module file\n// `node_module/echarts/lib/chart/line.js` can be find by this plugin.\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// Responsible for compress code.\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// Support multi-language.\nimport ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // The entry file.\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        ecLangPlugin({lang: &#39;en&#39;}), // Use english\n        // Remove the snippet in `__DEV__`, which mainly prints error log.\n        uglify()\n    ],\n    output: {\n        // Output file in the format of &#39;umd&#39;.\n        format: &#39;umd&#39;,\n        // Output source map.\n        sourcemap: true,\n        // The path of the output bundle.\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>Then execute the following command in <code class=\"codespan\">myProject</code> directory to start the build:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p><code class=\"codespan\">-c</code> indicate <code class=\"codespan\">rollup</code> to use <code class=\"codespan\">myProject/rollup.config.js</code> as the config file.</p>\n</blockquote>\n<p>The created bundle <code class=\"codespan\">myProject/lib/line.min.js</code> includes project code and part of echarts code that we requried. Now we create a web page <code class=\"codespan\">myProject/line.html</code> to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- Import the created bundle: --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/line.html</code> in a browser, we will get:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"multi-language\">Multi-language</h2>\n<p>In the example above, we can notice that the label of the <code class=\"codespan\">toolbox</code> component is in English. Essentially any text can be customized by <code class=\"codespan\">echarts option</code>, but if we want to show label in a certain language by default, we have to specify the language while building the code.</p>\n<p>For example:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>It means that the pre-defined English text is used. Moreover, can be <code class=\"codespan\">--lang fi</code>.</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>It means that <code class=\"codespan\">myProject/my/langXX.js</code> is used to substitute <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> while performing build. So we can customize text in our language in <code class=\"codespan\">myProject/my/langXX.js</code>. Notice, <code class=\"codespan\">-o</code> or <code class=\"codespan\">--output</code> must be specified in the approach.</p>\n<p>Besides, the same lang parameter can be pass to <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code>.</p>\n"
   },
   "Use ECharts with webpack": {
-    "desc": "<p><a href=\"https://webpack.js.org//\" target=\"_blank\">Webpack</a> is a popular module packaging tool, which can be used easily to import and packaging Apache ECharts (incubating)<sup>TM</sup>. Here we assume you already have certain understanding about webpack and used it in your project.</p>\n<h2 id=\"use-npm-to-install-echarts\">Use npm to install ECharts</h2>\n<p>You can use the following command to install ECharts with npm.</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"include-echarts\">Include ECharts</h2>\n<p>ECharts and zrender installed by npm will be placed under <code class=\"codespan\">node_modules</code>. You can obtain echarts directly in project with <code class=\"codespan\">require(&#39;echarts&#39;)</code>.</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts entry example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"include-echarts-charts-and-components-on-demand\">Include ECharts charts and components on demand</h2>\n<p>By default, <code class=\"codespan\">require(&#39;echarts&#39;)</code> returns the whole ECharts package including all charts and components, so the package size is a bit large. If you have a strict demand of package size, you may include packages on demand.</p>\n<p>For example, the code above only uses bar chart, tooltip and title component, so you only need to include these modules, effectively making the package size from more than 400 KB to about 170 KB.</p>\n<pre><code class=\"lang-js\">// include ECharts main module\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// include bar chart\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// include tooltip and title component\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts introductory example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>Available modules see <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>The same goes for another popular packaging tools <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>, which will not be introduced again here. Using <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> to make a custom build of echarts is introduced in <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">Create Custom Build of ECharts</a></p>\n"
+    "desc": "<p><a href=\"https://webpack.js.org/\" target=\"_blank\">Webpack</a> is a popular module packaging tool, which can be used easily to import and packaging Apache ECharts (incubating)<sup>TM</sup>. Here we assume you already have certain understanding about webpack and used it in your project.</p>\n<h2 id=\"use-npm-to-install-echarts\">Use npm to install ECharts</h2>\n<p>You can use the following command to install ECharts with npm.</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"include-echarts\">Include ECharts</h2>\n<p>ECharts and zrender installed by npm will be placed under <code class=\"codespan\">node_modules</code>. You can obtain echarts directly in project with <code class=\"codespan\">require(&#39;echarts&#39;)</code>.</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts entry example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"include-echarts-charts-and-components-on-demand\">Include ECharts charts and components on demand</h2>\n<p>By default, <code class=\"codespan\">require(&#39;echarts&#39;)</code> returns the whole ECharts package including all charts and components, so the package size is a bit large. If you have a strict demand of package size, you may include packages on demand.</p>\n<p>For example, the code above only uses bar chart, tooltip and title component, so you only need to include these modules, effectively making the package size from more than 400 KB to about 170 KB.</p>\n<pre><code class=\"lang-js\">// include ECharts main module\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// include bar chart\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// include tooltip and title component\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts introductory example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>Available modules see <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>The same goes for another popular packaging tools <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>, which will not be introduced again here. Using <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> to make a custom build of echarts is introduced in <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">Create Custom Build of ECharts</a></p>\n"
   },
   "ECharts Basic Concepts Overview": {
     "desc": "<p>This chapter describes some of the common concepts and terms of Apache ECharts (incubating)<sup>TM</sup>.</p>\n<h2 id=\"echarts-instance\">ECharts instance</h2>\n<p>We can create multiple <code class=\"codespan\">echarts instances</code> in a webpage. In each <code class=\"codespan\">echarts instance</code> we can create multiple diagrams, coordinate systems, etc. (described by <code class=\"codespan\">option</code>). With a DOM element prepared (as the container of an echarts instance), we can create a <code class=\"codespan\">echarts instance</code> based on that element. Each <code class=\"codespan\">echarts instance</code> takes its DOM element exclusively.</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"series\">Series</h2>\n<p><a href=\"option.html#series\" target=\"_blank\">series</a> is a very common term. In echarts, <a href=\"option.html#series\" target=\"_blank\">series</a> represents a series of value and the diagram generated from them. So the concept <a href=\"option.html#series\" target=\"_blank\">series</a> includes these key points: a series of value, the type of the diagram (<code class=\"codespan\">series.type</code>) and other parameters specified for the mapping from the values to a diagram.</p>\n<p>In echarts, the <code class=\"codespan\">series.type</code> and the &quot;diagram type&quot; are the same concept. <code class=\"codespan\">series.type</code> includes: <a href=\"option.html#series-line\" target=\"_blank\">line</a> (line plot), <a href=\"option.html#series-bar\" target=\"_blank\">bar</a> (bar chart), <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart), <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a> (scatter plot), <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> (graph plot), <a href=\"option.html#series-tree\" target=\"_blank\">tree</a> (tree plot), etc.</p>\n<p>In the example below, there are three <a href=\"option.html#series\" target=\"_blank\">series</a> (<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>) declared in the <code class=\"codespan\">option</code> on the right, where <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> are declared in each series:</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>Similarly, the following example shows another style of <code class=\"codespan\">option</code>, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"component\">Component</h2>\n<p>Over series, the entities in echarts are abstracted using the term &quot;component&quot;. For example, echarts includes these components: <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> (the x axis of Cartesian coordinate system), <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> (the y axis of Cartesian coordinate system), <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard of Cartesian coordinate system), <a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a> (the angle axis of polar coordinate system), <a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a> (the radius axis of polar coordinate system), <a href=\"option.html#polar\" target=\"_blank\">polar</a> (the baseboard of polar coordinate system), <a href=\"option.html#geo\" target=\"_blank\">geo</a> (GEO coordinate system), <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> (the component for changing the displayed range of data), <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> (the component for specifying the visual mapping), <a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a> (the tooltip component), <a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a> (the toolbox component), <a href=\"option.html#series\" target=\"_blank\">series</a>, etc.</p>\n<p>Notice that <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, a component for rendering diagram.</p>\n<p>Check the example below. Components (including series) are declared in <code class=\"codespan\">option</code> on the right, and the are finally rendered in the echarts instance.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>Notice: although <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, sometimes we can see phrases like &quot;series and components&quot;. The term &quot;component&quot; in this context actually means &quot;components except series&quot;.</p>\n<h2 id=\"define-charts-using-option\">Define charts using option</h2>\n<p>We have met the term <code class=\"codespan\">option</code> above. Users should use <code class=\"codespan\">option</code> to describe all of their requirements and input it to echarts. The requirements includes: &quot;what does the data like&quot;, &quot;what the diagram we need&quot;, &quot;what components we need&quot;, &quot;what the user interactions we need&quot;, etc. In short, <code class=\"codespan\">option</code> defines: <code class=\"codespan\">data</code>, <code class=\"codespan\">visual mapping</code>, <code class=\"codespan\">interaction</code>.</p>\n<pre><code class=\"lang-js\">// Create an echarts instance.\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// Use option to describe `data`, `visual mapping`, `interaction`, ...\n// `option` is a big JavaScript object.\nvar option = {\n    // Each property represents a kind of components.\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // If there are more than one components in one kind, we use an array.\n    // For example, there are three x axes here.\n    xAxis: [\n        // Each item represents an instance of component.\n        // `type` is used to indicate the sub-type of the component.\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // There are multiple series, using an array.\n    series: [\n        // `type` is also used to indicate the sub-type\n        // (i.e., diagram type) of each series.\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// Call `setOption` and input the `option`. And then the\n// echarts instance processes data and renders charts.\nchart.setOption(option);\n</code></pre>\n<p>Data is put in <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> in the above example. And we give another example showing another way, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // Each series retrieves data from `dataset`. The values in `encode`\n        // are the indices of the dimensions (i.e., column) of `dataset.source`.\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"position-a-component\">Position a component</h2>\n<p>These approaches are used to Position a component.</p>\n<p><br></p>\n<p><strong>[Absolute positioning like CSS]</strong></p>\n<p><br></p>\n<p>Most components and series can be absolutely positioned according to <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code>. This approach is like the absolute positioning in CSS. The absolute positioning is based on the container DOM element of the echarts.</p>\n<p>The value of each attribute can be:</p>\n<ul>\n<li>Absolute value (like <code class=\"codespan\">bottom: 54</code>, means: the distance from the boundary of the echarts container to bottom boundary of the component is <code class=\"codespan\">54</code> pixel).</li>\n<li>Or the percentage based on the width/height of the echarts container (like <code class=\"codespan\">right: &#39;20%&#39;</code>, means: the distance from the boundary of the echarts container to the right boundary of this component is <code class=\"codespan\">20%</code> of the width of the echarts container).</li>\n</ul>\n<p>Check the example below, where the <a href=\"option.html#grid\" target=\"_blank\">grid</a> component (that is the baseboard of a Cartesian coordinate system) are configured with <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code>.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>Note that <code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> are one group of attributes for horizontal layout, while <code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> are another group of attributes for vertical layout. The two groups have nothing to do with each other. In each group, it is enough to set only one or at most two attributes. For example, when <code class=\"codespan\">left</code> and <code class=\"codespan\">right</code> have been specified, <code class=\"codespan\">width</code> can be automatically calculated by them.</p>\n<p><br></p>\n<p><strong>[Center-radius positioning]</strong></p>\n<p><br></p>\n<p>A few circular components or series need to be positioned by &quot;center&quot; and &quot;radius&quot;. For example, <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a> (sunburst chart)、<a href=\"option.html#polar\" target=\"_blank\">polar</a> (polar coordinate system).</p>\n<p>As the name implies, it position the component according to <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a> and <a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>.</p>\n<p><br></p>\n<p><strong>[Other positioning]</strong></p>\n<p><br></p>\n<p>A few other components may has their own specific positioning approach. Check their docs before using them.</p>\n<h2 id=\"coordinate-system\">Coordinate system</h2>\n<p>Many series, like <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>, <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>, <a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>, etc., need to work on a coordinate system. Coordinate system is used to layout each graphic elements and display some ticks and labels. For example, echarts at least provides these coordinate systems: <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a>, <a href=\"option.html#singleAxis\" target=\"_blank\">single axis coordinate system</a>, <a href=\"option.html#calendar\" target=\"_blank\">calendar coordinate system</a>, etc. Some other series like <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-tree\" target=\"_blank\">tree</a>, work independently without any coordinate systems. And still some other series like <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> are available either independently or on some coordinate system, depending on user settings.</p>\n<p>A coordinate system may consist of several components. For example, Cartesian coordinate system consists of <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard). <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> are referenced and assembled by <code class=\"codespan\">grid</code> and work together cooperatively.</p>\n<p>The following example demonstrates the most simple way to use a Cartesian coordinate system, where only <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> are declared, and <code class=\"codespan\">echarts</code> create and a <code class=\"codespan\">grid</code> implicitly to link them.</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>And the following example demonstrates a more complicated case, where two <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> share one <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>. And the two <code class=\"codespan\">series</code> are also share the <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, but use different <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> respectively. The property <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> is used to specify which <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> is used.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>The following echarts instance contain more than one <a href=\"option.html#grid\" target=\"_blank\">grid</a>. Each <a href=\"option.html#grid\" target=\"_blank\">grid</a> has its own <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>. The properties <a href=\"option.html#series-line.xAxisIndex\" target=\"_blank\">xAxisIndex</a>, <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> and <a href=\"option.html#yAxis.gridIndex\" target=\"_blank\">gridIndex</a> are used to specify the reference relationships.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>Moreover, a type of series is usually available on various coordinate systems. For example, a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> can work on <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a> or other coordinate systems. Similarly, a coordinate system can serve different type of series. As the examples shown above, a <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a> serves several <a href=\"option.html#series-line\" target=\"_blank\">line series</a> and <a href=\"option.html#series-bar\" target=\"_blank\">bar series</a>.</p>\n"
diff --git a/en/documents/tutorial.json b/en/documents/tutorial.json
index 15c57f2..e16f48e 100644
--- a/en/documents/tutorial.json
+++ b/en/documents/tutorial.json
@@ -1 +1 @@
-{"$schema":"https://echarts.apache.org/doc/json-schem","option":{"type":"Object","properties":{"Get Started with ECharts in 5 minutes":{"type":["*"],"description":"<h2 id=\"installing-echarts\">Installing ECharts</h2>\n<p>First, install Apache ECharts (incubating)<sup>TM</sup> using one of the following methods:</p>\n<ul>\n<li><p>Download official source release from <a href=\"https://echarts.apache.org/en/download.html\" target=\"_blank\">Apache ECharts (incubating) website</a>. Then <a href=\"https://github.com/apache/incubator-echarts#build\" target=\"_blank\">build</a> from the source release.</p>\n</li>\n<li><p>Download from <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a></p>\n</li>\n<li><p>Using npm: <code class=\"codespan\">npm install echarts --save</code>. <a href=\"tutorial.html#Use%20ECharts%20with%20webpack\" target=\"_blank\">Using ECharts with webpack</a></p>\n</li>\n<li><p>Use CDN like <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">jsDelivr</a>.</p>\n</li>\n</ul>\n<h2 id=\"including-echarts\">Including ECharts</h2>\n<p>Load <code class=\"codespan\">echarts.min.js</code> with a script tag.</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;!-- including ECharts file --&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;/html&gt;\n</code></pre>\n<h2 id=\"draw-a-simple-chart\">Draw a simple chart</h2>\n<p>Before drawing charts, we need to prepare a DOM container with width and height for ECharts.</p>\n<pre><code>&lt;body&gt;\n    &lt;!-- preparing a DOM with width and height for ECharts --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width:600px; height:400px;&quot;&gt;&lt;/div&gt;\n&lt;/body&gt;\n</code></pre><p>Then we can initialize an ECharts instance using <a href=\"api.html#echarts.init\" target=\"_blank\">echarts.init</a>, and create a simple bar chart with <a href=\"api.html#echartsInstance.setOption\" target=\"_blank\">setOption</a>. Below is the complete code.</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;ECharts&lt;/title&gt;\n    &lt;!-- including ECharts file --&gt;\n    &lt;script src=&quot;echarts.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- prepare a DOM container with width and height --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n        // based on prepared DOM, initialize echarts instance\n        var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n        // specify chart configuration item and data\n        var option = {\n            title: {\n                text: &#39;ECharts entry example&#39;\n            },\n            tooltip: {},\n            legend: {\n                data:[&#39;Sales&#39;]\n            },\n            xAxis: {\n                data: [&quot;shirt&quot;,&quot;cardign&quot;,&quot;chiffon shirt&quot;,&quot;pants&quot;,&quot;heels&quot;,&quot;socks&quot;]\n            },\n            yAxis: {},\n            series: [{\n                name: &#39;Sales&#39;,\n                type: &#39;bar&#39;,\n                data: [5, 20, 36, 10, 10, 20]\n            }]\n        };\n\n        // use configuration item and data specified to show chart\n        myChart.setOption(option);\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>You&#39;ve made your first chart!</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/getting-started&reset=1&edit=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p>For more examples, go to the <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=doc-example/getting-started\" target=\"_blank\">ECharts Gallery</a></p>\n"},"Create Custom Build of ECharts":{"type":["*"],"description":"<p>In most cases, Apache ECharts (incubating)<sup>TM</sup> builds can be get from  <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> or from the <code class=\"codespan\">echarts/dist</code> directory in our <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub project</a>, where\nthese pre-builds are provided:</p>\n<ul>\n<li>Complete verion: <code class=\"codespan\">echarts/dist/echarts.js</code>, including all charts and components (see <code class=\"codespan\">echarts/echarts.all.js</code> for detail), but has maximum file size.</li>\n<li>Common version: <code class=\"codespan\">echarts/dist/echarts.common.js</code>, including common charts and components (see <code class=\"codespan\">echarts/echarts.common.js</code> for detail), moderate file size.</li>\n<li>Simple version: <code class=\"codespan\">echarts/dist/echarts.simple.js</code>, including a smaller subset of the most common charts and components (see <code class=\"codespan\">echarts/echarts.simple.js</code> for detail), small file size.</li>\n</ul>\n<p>We can also build echarts ourselves, which enables to only include the charts and components you needed. You can customize your ECharts build by using one of these approaches:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/en/builder.html\" target=\"_blank\">Online custom build tool</a> is relatively convenient.</li>\n<li>The script <code class=\"codespan\">echarts/build/build.js</code> found in the project is flexible for module selecting, and supports multi-language builds</li>\n<li>Build ECharts and your project directly by using tools such as <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>, <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a></li>\n</ul>\n<p>There are some examples to illustrate the latter two approaches below.</p>\n<h2 id=\"prepare-create-our-project-and-install-echarts\">Prepare: create our project and install echarts</h2>\n<p>Create a sample project using the command line</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>Then in the <code class=\"codespan\">myProject</code> directory, initialize <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> environment and install echarts (assume that <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> has been installed):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>The installed echarts is in the <code class=\"codespan\">myProject/node_modules</code> directory, which can be used in our project directly. For example:</p>\n<p>Use ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>Use CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>Next, we just describe our examples in ES Module way.</p>\n<h2 id=\"create-custom-build-by-echarts-build-build-js\">Create custom build by <code class=\"codespan\">echarts/build/build.js</code></h2>\n<p>In this example, for minimizing file size, we will build a echarts bundle with only pie chart included, and create a web page to show it.</p>\n<p>echarts has provided a script <code class=\"codespan\">echarts/build/build.js</code> as a build tool (<a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> is required to execute it). Now we can use the command below in the <code class=\"codespan\">myProject</code> directory to check its help info:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>These options can be used in this example:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>: Entry file of the echarts code. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">-o</code>: The bundle file path. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">--min</code>: Whether to compress file (not by default), and remove the code that is for printing error and warning info.</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>: Whether to use the specified language (Chinese by default). For example: <code class=\"codespan\">--lang en</code> means using English, <code class=\"codespan\">--lang my/langXX.js</code> means using <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> to substitute <code class=\"codespan\">echarts/lib/lang.js</code> while buiding.</li>\n<li><code class=\"codespan\">--sourcemap</code>: Whether to output source map, which is useful in debug.</li>\n<li><code class=\"codespan\">--format</code>: The format of output. Can be <code class=\"codespan\">&#39;umb&#39;</code>(default), <code class=\"codespan\">&#39;amd&#39;</code>, <code class=\"codespan\">&#39;iife&#39;</code>, <code class=\"codespan\">&#39;cjs&#39;</code>, <code class=\"codespan\">&#39;es&#39;</code>.</li>\n</ul>\n<p>Now we want to create a echarts bundle that only supports pie chart, we should firstly create an entry file (say <code class=\"codespan\">myProject/echarts.custom.js</code>) to import modules we need:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts and export them.\nexport * from &#39;echarts/src/echarts&#39;;\n// Import pie chart.\nimport &#39;echarts/src/chart/pie&#39;;\n// In this case, modules in either `echarts/src` or `echarts/lib`\n// can be imported (but should not be mixed). See\n// &quot;Use `echarts/lib/**` or `echarts/src/**`&quot; below.\n</code></pre>\n<p>Then we can use command below in <code class=\"codespan\">myProject</code> directory to build the bundle:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>Now the bundle <code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> has been created. Then we can create a web page (say <code class=\"codespan\">myProject/pie.html</code>) to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- import the bundle `lib/echarts.custom.js`. --&gt;\n    &lt;script src=&quot;lib/echarts.custom.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // Create a pie chart:\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/pie.html</code> in a browser, we can see the pie chart:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"modules-that-are-permitted-to-be-imported\">Modules that are permitted to be imported</h2>\n<p>All of the permitted modules are declared in <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> and <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a>. Other modules in the source code of echarts and zrender <strong>SHOULD NOT BE IMPORTED</strong>, because they are inner modules, whose interfaces and functionalities may be modified in the subsequent upgrades of echarts.</p>\n<h2 id=\"use-echarts-lib-or-echarts-src-\">Use <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code>?</h2>\n<ul>\n<li>If intending to import part of echarts modules in your project and build yourself, only <code class=\"codespan\">echarts/lib/**</code> can be used, <code class=\"codespan\">echarts/src/**</code> should not be used.</li>\n<li>If using <code class=\"codespan\">echarts/build/build.js</code> to make a bundle, either <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code> can be used (should not be mixed), where <code class=\"codespan\">echarts/src/**</code> brings smaller bundle size a little.</li>\n</ul>\n<blockquote>\n<p>Reason: currently, <code class=\"codespan\">echarts/src/**</code> is the source code that using ES Module, and they are transpiled to CommonJS code and placed in <code class=\"codespan\">echarts/lib/**</code>. (This transformation is for backward compatible with old version of NodeJS and webpack that do not support ES Module.)\nHistorically, echarts extensions and user projects have been using the package path <code class=\"codespan\">echarts/lib/**</code>. So it should not be changed, otherwise, mixed using both <code class=\"codespan\">echarts/src/**</code> and <code class=\"codespan\">echarts/lib/**</code> will generate two echarts namespace and bring some problems. But it is not an issue when using <code class=\"codespan\">echarts/build/build.js</code> to create a bundle, where ES modules in <code class=\"codespan\">echarts/src/**</code> can be analyzed statically for smaller bundle size.</p>\n</blockquote>\n<h2 id=\"build-echarts-and-our-project-directly-by-rollup\">Build echarts and our project directly by rollup</h2>\n<p>Now we have known that how to create custom build by <code class=\"codespan\">echarts/build/build.js</code>. Alternatively, we can bundle echarts and our project directly by the tool like <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> or <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>. In some project, this approach is required. Next we only go with <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, because <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> and <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> are in the similar way.</p>\n<p>Firstly install <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> in <code class=\"codespan\">myProject</code> directory:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>Then we create a project JS file <code class=\"codespan\">myProject/line.js</code> for line chart rendering:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts.\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// Import line chart.\nimport &#39;echarts/lib/chart/line&#39;;\n// Import components of tooltip, title and toolbox.\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// Render line chart and components.\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>The created module <code class=\"codespan\">myProject/line.js</code> can not work directly in the browsers that do not support ES Module. So we need to build them. Before we run <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, a config file <code class=\"codespan\">myProject/rollup.config.js</code> should be created:</p>\n<pre><code class=\"lang-js\">// Responsible for looking for modules in `node_module` directory. For example,\n// if there is code `import &#39;echarts/lib/chart/line&#39;;`, the module file\n// `node_module/echarts/lib/chart/line.js` can be find by this plugin.\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// Responsible for compress code.\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// Support multi-language.\nimport ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // The entry file.\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        ecLangPlugin({lang: &#39;en&#39;}), // Use english\n        // Remove the snippet in `__DEV__`, which mainly prints error log.\n        uglify()\n    ],\n    output: {\n        // Output file in the format of &#39;umd&#39;.\n        format: &#39;umd&#39;,\n        // Output source map.\n        sourcemap: true,\n        // The path of the output bundle.\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>Then execute the following command in <code class=\"codespan\">myProject</code> directory to start the build:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p><code class=\"codespan\">-c</code> indicate <code class=\"codespan\">rollup</code> to use <code class=\"codespan\">myProject/rollup.config.js</code> as the config file.</p>\n</blockquote>\n<p>The created bundle <code class=\"codespan\">myProject/lib/line.min.js</code> includes project code and part of echarts code that we requried. Now we create a web page <code class=\"codespan\">myProject/line.html</code> to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- Import the created bundle: --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/line.html</code> in a browser, we will get:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"multi-language\">Multi-language</h2>\n<p>In the example above, we can notice that the label of the <code class=\"codespan\">toolbox</code> component is in English. Essentially any text can be customized by <code class=\"codespan\">echarts option</code>, but if we want to show label in a certain language by default, we have to specify the language while building the code.</p>\n<p>For example:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>It means that the pre-defined English text is used. Moreover, can be <code class=\"codespan\">--lang fi</code>.</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>It means that <code class=\"codespan\">myProject/my/langXX.js</code> is used to substitute <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> while performing build. So we can customize text in our language in <code class=\"codespan\">myProject/my/langXX.js</code>. Notice, <code class=\"codespan\">-o</code> or <code class=\"codespan\">--output</code> must be specified in the approach.</p>\n<p>Besides, the same lang parameter can be pass to <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code>.</p>\n"},"Use ECharts with webpack":{"type":["*"],"description":"<p><a href=\"https://webpack.js.org//\" target=\"_blank\">Webpack</a> is a popular module packaging tool, which can be used easily to import and packaging Apache ECharts (incubating)<sup>TM</sup>. Here we assume you already have certain understanding about webpack and used it in your project.</p>\n<h2 id=\"use-npm-to-install-echarts\">Use npm to install ECharts</h2>\n<p>You can use the following command to install ECharts with npm.</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"include-echarts\">Include ECharts</h2>\n<p>ECharts and zrender installed by npm will be placed under <code class=\"codespan\">node_modules</code>. You can obtain echarts directly in project with <code class=\"codespan\">require(&#39;echarts&#39;)</code>.</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts entry example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"include-echarts-charts-and-components-on-demand\">Include ECharts charts and components on demand</h2>\n<p>By default, <code class=\"codespan\">require(&#39;echarts&#39;)</code> returns the whole ECharts package including all charts and components, so the package size is a bit large. If you have a strict demand of package size, you may include packages on demand.</p>\n<p>For example, the code above only uses bar chart, tooltip and title component, so you only need to include these modules, effectively making the package size from more than 400 KB to about 170 KB.</p>\n<pre><code class=\"lang-js\">// include ECharts main module\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// include bar chart\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// include tooltip and title component\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts introductory example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>Available modules see <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>The same goes for another popular packaging tools <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>, which will not be introduced again here. Using <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> to make a custom build of echarts is introduced in <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">Create Custom Build of ECharts</a></p>\n"},"ECharts Basic Concepts Overview":{"type":["*"],"description":"<p>This chapter describes some of the common concepts and terms of Apache ECharts (incubating)<sup>TM</sup>.</p>\n<h2 id=\"echarts-instance\">ECharts instance</h2>\n<p>We can create multiple <code class=\"codespan\">echarts instances</code> in a webpage. In each <code class=\"codespan\">echarts instance</code> we can create multiple diagrams, coordinate systems, etc. (described by <code class=\"codespan\">option</code>). With a DOM element prepared (as the container of an echarts instance), we can create a <code class=\"codespan\">echarts instance</code> based on that element. Each <code class=\"codespan\">echarts instance</code> takes its DOM element exclusively.</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"series\">Series</h2>\n<p><a href=\"option.html#series\" target=\"_blank\">series</a> is a very common term. In echarts, <a href=\"option.html#series\" target=\"_blank\">series</a> represents a series of value and the diagram generated from them. So the concept <a href=\"option.html#series\" target=\"_blank\">series</a> includes these key points: a series of value, the type of the diagram (<code class=\"codespan\">series.type</code>) and other parameters specified for the mapping from the values to a diagram.</p>\n<p>In echarts, the <code class=\"codespan\">series.type</code> and the &quot;diagram type&quot; are the same concept. <code class=\"codespan\">series.type</code> includes: <a href=\"option.html#series-line\" target=\"_blank\">line</a> (line plot), <a href=\"option.html#series-bar\" target=\"_blank\">bar</a> (bar chart), <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart), <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a> (scatter plot), <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> (graph plot), <a href=\"option.html#series-tree\" target=\"_blank\">tree</a> (tree plot), etc.</p>\n<p>In the example below, there are three <a href=\"option.html#series\" target=\"_blank\">series</a> (<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>) declared in the <code class=\"codespan\">option</code> on the right, where <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> are declared in each series:</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>Similarly, the following example shows another style of <code class=\"codespan\">option</code>, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"component\">Component</h2>\n<p>Over series, the entities in echarts are abstracted using the term &quot;component&quot;. For example, echarts includes these components: <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> (the x axis of Cartesian coordinate system), <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> (the y axis of Cartesian coordinate system), <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard of Cartesian coordinate system), <a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a> (the angle axis of polar coordinate system), <a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a> (the radius axis of polar coordinate system), <a href=\"option.html#polar\" target=\"_blank\">polar</a> (the baseboard of polar coordinate system), <a href=\"option.html#geo\" target=\"_blank\">geo</a> (GEO coordinate system), <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> (the component for changing the displayed range of data), <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> (the component for specifying the visual mapping), <a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a> (the tooltip component), <a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a> (the toolbox component), <a href=\"option.html#series\" target=\"_blank\">series</a>, etc.</p>\n<p>Notice that <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, a component for rendering diagram.</p>\n<p>Check the example below. Components (including series) are declared in <code class=\"codespan\">option</code> on the right, and the are finally rendered in the echarts instance.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>Notice: although <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, sometimes we can see phrases like &quot;series and components&quot;. The term &quot;component&quot; in this context actually means &quot;components except series&quot;.</p>\n<h2 id=\"define-charts-using-option\">Define charts using option</h2>\n<p>We have met the term <code class=\"codespan\">option</code> above. Users should use <code class=\"codespan\">option</code> to describe all of their requirements and input it to echarts. The requirements includes: &quot;what does the data like&quot;, &quot;what the diagram we need&quot;, &quot;what components we need&quot;, &quot;what the user interactions we need&quot;, etc. In short, <code class=\"codespan\">option</code> defines: <code class=\"codespan\">data</code>, <code class=\"codespan\">visual mapping</code>, <code class=\"codespan\">interaction</code>.</p>\n<pre><code class=\"lang-js\">// Create an echarts instance.\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// Use option to describe `data`, `visual mapping`, `interaction`, ...\n// `option` is a big JavaScript object.\nvar option = {\n    // Each property represents a kind of components.\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // If there are more than one components in one kind, we use an array.\n    // For example, there are three x axes here.\n    xAxis: [\n        // Each item represents an instance of component.\n        // `type` is used to indicate the sub-type of the component.\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // There are multiple series, using an array.\n    series: [\n        // `type` is also used to indicate the sub-type\n        // (i.e., diagram type) of each series.\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// Call `setOption` and input the `option`. And then the\n// echarts instance processes data and renders charts.\nchart.setOption(option);\n</code></pre>\n<p>Data is put in <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> in the above example. And we give another example showing another way, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // Each series retrieves data from `dataset`. The values in `encode`\n        // are the indices of the dimensions (i.e., column) of `dataset.source`.\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"position-a-component\">Position a component</h2>\n<p>These approaches are used to Position a component.</p>\n<p><br></p>\n<p><strong>[Absolute positioning like CSS]</strong></p>\n<p><br></p>\n<p>Most components and series can be absolutely positioned according to <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code>. This approach is like the absolute positioning in CSS. The absolute positioning is based on the container DOM element of the echarts.</p>\n<p>The value of each attribute can be:</p>\n<ul>\n<li>Absolute value (like <code class=\"codespan\">bottom: 54</code>, means: the distance from the boundary of the echarts container to bottom boundary of the component is <code class=\"codespan\">54</code> pixel).</li>\n<li>Or the percentage based on the width/height of the echarts container (like <code class=\"codespan\">right: &#39;20%&#39;</code>, means: the distance from the boundary of the echarts container to the right boundary of this component is <code class=\"codespan\">20%</code> of the width of the echarts container).</li>\n</ul>\n<p>Check the example below, where the <a href=\"option.html#grid\" target=\"_blank\">grid</a> component (that is the baseboard of a Cartesian coordinate system) are configured with <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code>.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>Note that <code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> are one group of attributes for horizontal layout, while <code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> are another group of attributes for vertical layout. The two groups have nothing to do with each other. In each group, it is enough to set only one or at most two attributes. For example, when <code class=\"codespan\">left</code> and <code class=\"codespan\">right</code> have been specified, <code class=\"codespan\">width</code> can be automatically calculated by them.</p>\n<p><br></p>\n<p><strong>[Center-radius positioning]</strong></p>\n<p><br></p>\n<p>A few circular components or series need to be positioned by &quot;center&quot; and &quot;radius&quot;. For example, <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a> (sunburst chart)、<a href=\"option.html#polar\" target=\"_blank\">polar</a> (polar coordinate system).</p>\n<p>As the name implies, it position the component according to <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a> and <a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>.</p>\n<p><br></p>\n<p><strong>[Other positioning]</strong></p>\n<p><br></p>\n<p>A few other components may has their own specific positioning approach. Check their docs before using them.</p>\n<h2 id=\"coordinate-system\">Coordinate system</h2>\n<p>Many series, like <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>, <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>, <a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>, etc., need to work on a coordinate system. Coordinate system is used to layout each graphic elements and display some ticks and labels. For example, echarts at least provides these coordinate systems: <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a>, <a href=\"option.html#singleAxis\" target=\"_blank\">single axis coordinate system</a>, <a href=\"option.html#calendar\" target=\"_blank\">calendar coordinate system</a>, etc. Some other series like <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-tree\" target=\"_blank\">tree</a>, work independently without any coordinate systems. And still some other series like <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> are available either independently or on some coordinate system, depending on user settings.</p>\n<p>A coordinate system may consist of several components. For example, Cartesian coordinate system consists of <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard). <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> are referenced and assembled by <code class=\"codespan\">grid</code> and work together cooperatively.</p>\n<p>The following example demonstrates the most simple way to use a Cartesian coordinate system, where only <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> are declared, and <code class=\"codespan\">echarts</code> create and a <code class=\"codespan\">grid</code> implicitly to link them.</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>And the following example demonstrates a more complicated case, where two <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> share one <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>. And the two <code class=\"codespan\">series</code> are also share the <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, but use different <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> respectively. The property <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> is used to specify which <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> is used.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>The following echarts instance contain more than one <a href=\"option.html#grid\" target=\"_blank\">grid</a>. Each <a href=\"option.html#grid\" target=\"_blank\">grid</a> has its own <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>. The properties <a href=\"option.html#series-line.xAxisIndex\" target=\"_blank\">xAxisIndex</a>, <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> and <a href=\"option.html#yAxis.gridIndex\" target=\"_blank\">gridIndex</a> are used to specify the reference relationships.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>Moreover, a type of series is usually available on various coordinate systems. For example, a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> can work on <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a> or other coordinate systems. Similarly, a coordinate system can serve different type of series. As the examples shown above, a <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a> serves several <a href=\"option.html#series-line\" target=\"_blank\">line series</a> and <a href=\"option.html#series-bar\" target=\"_blank\">bar series</a>.</p>\n"},"Customized Chart Styles":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> provides a rich amount of configurable items, which can be set in global, series, and data three different levels. Next, let&#39;s see an example of how to use ECharts to implement the following Nightingale rose chart:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n<h2 id=\"drawing-nightingale-rose-chart\">Drawing Nightingale Rose Chart</h2>\n<p><a href=\"#Get%20Started%20with%20ECharts%20in%205%20minutes\">Getting started tutorial</a> introduced how to make a simple bar chart. This time, we are going to make a pie chart. Pie charts use arc length of fans to represent ratio of a certain series in total share. It&#39;s data format is simpler than bar chart, because it only contains one dimension without category. Besides, since it&#39;s not in rectangular system, it doesn&#39;t need <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> either.</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    series : [\n        {\n            name: &#39;Reference Page&#39;,\n            type: &#39;pie&#39;,\n            radius: &#39;55%&#39;,\n            data:[\n                {value:400, name:&#39;Searching Engine&#39;},\n                {value:335, name:&#39;Direct&#39;},\n                {value:310, name:&#39;Email&#39;},\n                {value:274, name:&#39;Alliance Advertisement&#39;},\n                {value:235, name:&#39;Video Advertisement&#39;}\n            ]\n        }\n    ]\n})\n</code></pre>\n<p>With the above code, we can create a simple pie chart:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step0&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>Here, the value of <code class=\"codespan\">data</code> is not a single value, as that of the example in get started. Instead, it&#39;s an object containing <code class=\"codespan\">name</code> and <code class=\"codespan\">value</code>. Data in ECharts can always be a single value, or a configurable object with name, style and label. You may refer to <a href=\"option.html#series-pie.data\" target=\"_blank\">data</a> for more information.</p>\n<p><a href=\"option.html#series-pie\" target=\"_blank\">Pie charts</a> of EChart can be made into Nightingale rose charts with <a href=\"option.html#series-pie.roseType\" target=\"_blank\">roseType</a> field.</p>\n<pre><code class=\"lang-js\">roseType: &#39;angle&#39;\n</code></pre>\n<p>Nightingale rose charts use radius to represent data value.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step1&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"configuring-shadow\">Configuring Shadow</h2>\n<p>Commonly used styles of ECharts, like shadow, opacity, color, border-color, border-width, and etc., are set by <a href=\"#series-pie.itemStyle\">itemStyle</a> in series.</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // shadow size\n    shadowBlur: 200,\n    // horizontal offset of shadow\n    shadowOffsetX: 0,\n    // vertical offset of shadow\n    shadowOffsetY: 0,\n    // shadow color\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<p>The effect after added shadow is:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step2&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>Each <code class=\"codespan\">itemStyle</code> has <code class=\"codespan\">emphasis</code> as the highlighted style when mouse hovered. The last example shows the effect of adding shadow by default. But in most situations, we may probably need to add shadow to emphasis when mouse is hovered.</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    emphasis: {\n        shadowBlur: 200,\n        shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n    }\n}\n</code></pre>\n<h2 id=\"dark-background-and-light-text\">Dark Background and Light Text</h2>\n<p>Now, we need to change the whole theme as that shown in the example at the beginning of this tutorial. This can be achieved by changing background color and text color.</p>\n<p>Background is a global configurable object, so we can set it directly with <a href=\"option.html#backgroundColor\" target=\"_blank\">backgroundColor</a> of option.</p>\n<pre><code class=\"lang-js\">setOption({\n    backgroundColor: &#39;#2c343c&#39;\n})\n</code></pre>\n<p>Text style can also be set globally in <a href=\"option.html#textStyle\" target=\"_blank\">textStyle</a>.</p>\n<pre><code class=\"lang-js\">setOption({\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n})\n</code></pre>\n<p>On the other hand, we can also set them in <a href=\"option.html#series-pie.label.textStyle\" target=\"_blank\">label.textStyle</a> of each series.</p>\n<pre><code class=\"lang-js\">label: {\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>We also need to set line color of pie chart to be lighter.</p>\n<pre><code class=\"lang-js\">labelLine: {\n    lineStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>Thus, we can get the following effect.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step3&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>Similar to <code class=\"codespan\">itemStyle</code>, <code class=\"codespan\">label</code> and <code class=\"codespan\">labelLine</code> also have <code class=\"codespan\">emphasis</code> children.</p>\n<h2 id=\"setting-fan-colors\">Setting Fan Colors</h2>\n<p>Fan colors can be set in <code class=\"codespan\">itemStyle</code>:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // 设置扇形的颜色\n    color: &#39;#c23531&#39;,\n    shadowBlur: 200,\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step4&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>This is quite similar to our expect effect, except that fan colors should be made darker within shadow area, so as to make a sense of layering and space with blocked light.</p>\n<p>Each fan&#39;s color can be set under <code class=\"codespan\">data</code>:</p>\n<pre><code class=\"lang-js\">data: [{\n    value:400,\n    name:&#39;搜索引擎&#39;,\n    itemStyle: {\n        color: &#39;#c23531&#39;\n    }\n}, ...]\n</code></pre>\n<p>But since we only need the variation of color in this example, there&#39;s a simpler way to map data value to lightness through <a href=\"#option.html#visualMap\">visualMap</a>.</p>\n<pre><code class=\"lang-js\">visualMap: {\n    // hide visualMap component; use lightness mapping only\n    show: false,\n    // mapping with min value at 80\n    min: 80,\n    // mapping with max value at 600\n    max: 600,\n    inRange: {\n        // mapping lightness from 0 to 1\n        colorLightness: [0, 1]\n    }\n}\n</code></pre>\n<p>The final effect is:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n\n"},"Overview of Style Customization":{"type":["*"],"description":"<p>This article provides an overview of the different approaches about Apache ECharts (incubating)<sup>TM</sup> style customization. For example, how to config the color, size, shadow of the graphic elements and labels.</p>\n<blockquote>\n<p>The term &quot;style&quot; may not follow the convention of data visualization, but we use it in this article because it is popular and easy to understand.</p>\n</blockquote>\n<p>These approaches below will be introduced. The functionalities of them might be overlapped, but they are suitable for different scenarios.</p>\n<ul>\n<li>Theme</li>\n<li>Pallette</li>\n<li>Customize style explicitly (itemStyle, lineStyle, areaStyle, label, ...)</li>\n<li>Visual encoding (visualMap component)</li>\n</ul>\n<p>Other article about styling can be check in <a href=\"#Customized%20Chart%20Styles\">Customized Chart Styles</a> and <a href=\"#Visual%20Map%20of%20Data\">Visual Map of Data</a>.</p>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Theme</strong></p>\n<p>Setting a theme is the simplest way to change the color style. For example, in <a href=\"https://echarts.apache.org/examples/en/index.html\" target=\"_blank\">Examples page</a>, &quot;Theme&quot; can be selected, and view the result directly.</p>\n<p>Since ECharts4, besides the original default theme, ECharts provide another two built-in themes, named &#39;<code class=\"codespan\">&#39;light&#39;</code> and <code class=\"codespan\">&#39;dark&#39;</code>. They can be used as follows:</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;light&#39;);\n</code></pre>\n<p>or</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;dark&#39;);\n</code></pre>\n<p>Other themes are not included in ECharts package by default, and need to load them ourselves if we want to use them. Themes can be visited and downloaded in <a href=\"https://www.echartsjs.com/theme-builder/\" target=\"_blank\">Theme Builder</a>. Theme can also be created or edited in it. The downloaded theme can be used as follows:</p>\n<p>If a theme is downloaded as a JSON file, we should register it by ourselves, for example:</p>\n<pre><code class=\"lang-js\">var xhr = new XMLHttpRequest();\n// Assume the theme name is &quot;vintage&quot;.\nxhr.open(&#39;GET&#39;, &#39;xxx/xxx/vintage.json&#39;, true);\nxhr.onload = function () {\n    var themeJSON = this.response;\n    echarts.registerTheme(&#39;vintage&#39;, JSON.parse(themeJSON))\n    var chart = echarts.init(dom, &#39;vintage&#39;);\n    // ...\n});\nxhr.send();\n</code></pre>\n<p>If a them is downloaded as a JS file, it will auto register itself:</p>\n<pre><code class=\"lang-js\">// Import the `vintage.js` file in HTML, then:\nvar chart = echarts.init(dom, &#39;vintage&#39;);\n// ...\n</code></pre>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Palette</strong></p>\n<p>Pallettes can be given in option. They provide a group of colors, which will be auto picked by series and data. We can give a global palette, or exclusive pallette for certain series.</p>\n<pre><code class=\"lang-js\">option = {\n    // Global palette:\n    color: [&#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\n    series: [{\n        type: &#39;bar&#39;,\n        // A palette only work for the series:\n        color: [&#39;#dd6b66&#39;,&#39;#759aa0&#39;,&#39;#e69d87&#39;,&#39;#8dc1a9&#39;,&#39;#ea7e53&#39;,&#39;#eedd78&#39;,&#39;#73a373&#39;,&#39;#73b9bc&#39;,&#39;#7289ab&#39;, &#39;#91ca8c&#39;,&#39;#f49f42&#39;],\n        ...\n    }, {\n        type: &#39;pie&#39;,\n        // A palette only work for the series:\n        color: [&#39;#37A2DA&#39;, &#39;#32C5E9&#39;, &#39;#67E0E3&#39;, &#39;#9FE6B8&#39;, &#39;#FFDB5C&#39;,&#39;#ff9f7f&#39;, &#39;#fb7293&#39;, &#39;#E062AE&#39;, &#39;#E690D1&#39;, &#39;#e7bcf3&#39;, &#39;#9d96f5&#39;, &#39;#8378EA&#39;, &#39;#96BFFF&#39;],\n        ...\n    }]\n}\n</code></pre>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Customize style explicitly (itemStyle, lineStyle, areaStyle, label, ...)</strong></p>\n<p>It is a common way to set style explicitly. Throughout ECharts <a href=\"option.html\" target=\"_blank\">option</a>, style related options can be set in various place, including <a href=\"option.html#series.itemStyle\" target=\"_blank\">itemStyle</a>, <a href=\"option.html#series-line.lineStyle\" target=\"_blank\">lineStyle</a>, <a href=\"option.html#series-line.areaStyle\" target=\"_blank\">areaStyle</a>, <a href=\"option.html#series.label\" target=\"_blank\">label</a>, etc.</p>\n<p>Generally speaking, all of the built-in components and series follow the naming convention like <code class=\"codespan\">itemStyle</code>, <code class=\"codespan\">lineStyle</code>, <code class=\"codespan\">areaStyle</code>, <code class=\"codespan\">label</code> etc., although they may occur in different place according to different series or components.</p>\n<p>There is another article for style setting, <a href=\"#Customized%20Chart%20Styles\">Customized Chart Styles</a>.</p>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Style of emphasis state</strong></p>\n<p>When mouse hovering a graphic elements, usually the emphasis style will be displayed. By default, the emphasis style is auto generated by the normal style. However they can be specified by <a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphasis</a> property. The options in <a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphasis</a> is the same as the ones for normal state, for example:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        // Styles for normal state.\n        itemStyle: {\n            // Color of the point.\n            color: &#39;red&#39;\n        },\n        label: {\n            show: true,\n            // Text of labels.\n            formatter: &#39;This is a normal label.&#39;\n        },\n\n        // Styles for emphasis state.\n        emphasis: {\n            itemStyle: {\n                // Color in emphasis state.\n                color: &#39;blue&#39;\n            },\n            label: {\n                show: true,\n                // Text in emphasis.\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>Notice: Before ECharts4, the emphasis style should be written like this:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        itemStyle: {\n            // Styles for normal state.\n            normal: {\n                color: &#39;red&#39;\n            },\n            // Styles for emphasis state.\n            emphasis: {\n                color: &#39;blue&#39;\n            }\n        },\n\n        label: {\n            // Styles for normal state.\n            normal: {\n                show: true,\n                formatter: &#39;This is a normal label.&#39;\n            },\n            // Styles for emphasis state.\n            emphasis: {\n                show: true,\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>The option format is still <strong>compatible</strong>, but not recommended. In fact, in most cases, users only set normal style, and use the default emphasis style. So since ECharts4, we support to write style without the &quot;normal&quot; term, which makes the option more simple and neat.</p>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Visual encoding (visualMap component)</strong></p>\n<p><a href=\"option.html#visualMap\" target=\"_blank\">visualMap component</a> supports config the rule that mapping value to visual channel (color, size, ...). More details can be check in <a href=\"#Visual%20Map%20of%20Data\">Visual Map of Data</a>.</p>\n"},"Loading and Updating of Asynchronous Data":{"type":["*"],"description":"<h2 id=\"asynchronous-loading\">Asynchronous Loading</h2>\n<p>Data in <a href=\"#getting-started\">Get started</a> is directly filled in <code class=\"codespan\">setOption</code> after initialization, but in some cases, data may be filled after asynchronous loading. Data updating asynchronously in Apache ECharts (incubating)<sup>TM</sup> is very easy. After initialization, you can pass in data and configuration item through <code class=\"codespan\">setOption</code> after data obtained through  jQuery and other tools at any time.</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.setOption({\n        title: {\n            text: &#39;asynchronous data loading example&#39;\n        },\n        tooltip: {},\n        legend: {\n            data:[&#39;Sales&#39;]\n        },\n        xAxis: {\n            data: [&quot;shirts&quot;,&quot;cardigan&quot;,&quot;chiffon shirt&quot;,&quot;pants&quot;,&quot;heels&quot;,&quot;sockes&quot;]\n        },\n        yAxis: {},\n        series: [{\n            name: &#39;Sales&#39;,\n            type: &#39;bar&#39;,\n            data: [5, 20, 36, 10, 10, 20]\n        }]\n    });\n});\n</code></pre>\n<p>Or, you may set other styles, displaying an empty rectangular axis, and then fill in data when ready.</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// show title. legend and empty axis\nmyChart.setOption({\n    title: {\n        text: &#39;asynchronous data loading example&#39;\n    },\n    tooltip: {},\n    legend: {\n        data:[&#39;Sales&#39;]\n    },\n    xAxis: {\n        data: []\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;Sales&#39;,\n        type: &#39;bar&#39;,\n        data: []\n    }]\n});\n\n// Asynchronous data loading\n$.get(&#39;data.json&#39;).done(function (data) {\n    // fill in data\n    myChart.setOption({\n        xAxis: {\n            data: data.categories\n        },\n        series: [{\n            // find series by name\n            name: &#39;Sales&#39;,\n            data: data.data\n        }]\n    });\n});\n</code></pre>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-async&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>In ECharts, updating data need to find the corresponding series through <code class=\"codespan\">name</code>. In the above example, updating can be performed correctly according to series order if <code class=\"codespan\">name</code> is not defined. But in most cases, it is recommended to update data with series <code class=\"codespan\">name</code> information.</p>\n<h2 id=\"loading-animation\">Loading Animation</h2>\n<p>If data loading time is too long, an empty axis on the canvas may confuse users. In this case, a loading animation is needed to tell the user that it&#39;s still loading.</p>\n<p>ECharts provides a simple loading animation by default. You only need <a href=\"api.html#echartsInstance.showLoading\" target=\"_blank\">showLoading</a> to show, and then use <a href=\"api.html#echartsInstance.hideLoading\" target=\"_blank\">hideLoading</a> to hide loading animation after data loading.</p>\n<pre><code class=\"lang-js\">myChart.showLoading();\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.hideLoading();\n    myChart.setOption(...);\n});\n</code></pre>\n<p>Effects are as followed:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-loading&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"dynamic-data-updating\">Dynamic Data Updating</h2>\n<p>ECharts is driven by data. Change of data changes the presentation of chart, therefore, implementing dynamic data updating is extremely easy.</p>\n<p>All data updating are through <a href=\"#api.html#echartsInstance.setOption\">setOption</a>. You only need to get data as you wish, fill in data to <a href=\"#api.html#echartsInstance.setOption\">setOption</a> without considering the changes brought by data, ECharts will find the difference between two group of data and present the difference through proper animation.</p>\n<blockquote>\n<p>In ECharts 3, addData in ECharts 2 is removed.If a single data needs to be added, you can first data.push(value) and then setOption.</p>\n</blockquote>\n<p>See details in the following example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-dynamic-data&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n\n"},"Dataset":{"type":["*"],"description":"<p><code class=\"codespan\">dataset</code> component is published since Apache ECharts (incubating)<sup>TM</sup> 4. <code class=\"codespan\">dataset</code> brings convenience in data management separated with styles and enables data reuse by different series. More importantly, it enables data encoding from data to visual, which brings convenience in some scenarios.</p>\n<p>Before ECharts 4, data was only able to declared in each series, for example:</p>\n<pre><code class=\"lang-js\">option = {\n    xAxis: {\n        type: &#39;category&#39;,\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2015&#39;,\n            data: [89.3, 92.1, 94.4, 85.4]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2016&#39;,\n            data: [95.8, 89.4, 91.2, 76.9]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2017&#39;,\n            data: [97.7, 83.1, 92.5, 78.1]\n        }\n    ]\n}\n</code></pre>\n<p>This approach is easy to be understand and is flexible when some series needs special data definitions. But the shortcomings are also obvious: some data extra works are usually needed to split the original data to each series, and it not supports sharing data in different series, moreover, it is not good for encode.</p>\n<p>ECharts4 starts to provide <code class=\"codespan\">dataset</code> component, which brings benefits below:</p>\n<ul>\n<li>Benefit from <code class=\"codespan\">dataset</code>, we can follow the common methodology of data visualization: based on data, specify the mapping (via the option <a href=\"option.html#series.encode\" target=\"_blank\">encode</a>) from data to visual.</li>\n<li>Data can be managed and configured separately from other configurations.</li>\n<li>Data can be reused by different series and components.</li>\n<li>Support more common data format (like 2d-array, object-array), to avoid data transform works for users.</li>\n</ul>\n<h2 id=\"get-started\">Get started</h2>\n<p>This is a simplest example of <code class=\"codespan\">dataset</code>:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // Provide data.\n        source: [\n            [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n            [&#39;Matcha Latte&#39;, 43.3, 85.8, 93.7],\n            [&#39;Milk Tea&#39;, 83.1, 73.4, 55.1],\n            [&#39;Cheese Cocoa&#39;, 86.4, 65.2, 82.5],\n            [&#39;Walnut Brownie&#39;, 72.4, 53.9, 39.1]\n        ]\n    },\n    // Declare X axis, which is a category axis, mapping\n    // to the first column by default.\n    xAxis: {type: &#39;category&#39;},\n    // Declare Y axis, which is a value axis.\n    yAxis: {},\n    // Declare several series, each of them mapped to a\n    // column of the dataset by default.\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n}\n</code></pre>\n<p>This is the result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n<p>Or the common format object-array is also supported:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // Here the declared `dimensions` is mainly for providing the order of\n        // the dimensions, which enables ECharts to apply the default mapping\n        // from dimensions to axes.\n        // Alternatively, we can declare `series.encode` to specify the mapping,\n        // which will be introduced later.\n        dimensions: [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n        source: [\n            {product: &#39;Matcha Latte&#39;, &#39;2015&#39;: 43.3, &#39;2016&#39;: 85.8, &#39;2017&#39;: 93.7},\n            {product: &#39;Milk Tea&#39;, &#39;2015&#39;: 83.1, &#39;2016&#39;: 73.4, &#39;2017&#39;: 55.1},\n            {product: &#39;Cheese Cocoa&#39;, &#39;2015&#39;: 86.4, &#39;2016&#39;: 65.2, &#39;2017&#39;: 82.5},\n            {product: &#39;Walnut Brownie&#39;, &#39;2015&#39;: 72.4, &#39;2016&#39;: 53.9, &#39;2017&#39;: 39.1}\n        ]\n    },\n    xAxis: {type: &#39;category&#39;},\n    yAxis: {},\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n};\n</code></pre>\n<h2 id=\"mapping-from-data-to-graphic\">Mapping from data to graphic</h2>\n<p>In this tutorial, we make charts following this methodology: base on data, config the rule to map data to graphic, namely, encode the data to graphic.</p>\n<p>Generally, this mapping can be performed:</p>\n<ul>\n<li>Configure whether columns or rows of a dataset will mapped to series, namely, the series layout on the columns or rows of a dataset. This can be specified by <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">series.seriesLayoutBy</a>. <code class=\"codespan\">&#39;column&#39;</code> is the default value.</li>\n<li>Configure the mapping rule from dimensions (a dimension means a column/row) to axes in coordinate system, tooltip, labels, color, symbol size, etc. This can be specified by <a href=\"option.html#series.encode\" target=\"_blank\">series.encode</a> and <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> (if visual encoding is required). The example above does not give a mapping rule, so ECharts make default mapping by common sense: because x axis is a category axis, the first column is mapped to the x axis, and each series use each subsequent column in order.</li>\n</ul>\n<p>Let&#39;s illustrate them in detail below.</p>\n<h2 id=\"mapping-by-column-or-row\">Mapping by column or row</h2>\n<p>Giving dataset, users can configure whether columns or rows of a dataset will be mapped to series, namely, the series layout on the columns or rows of a dataset. This can be specified by <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">series.seriesLayoutBy</a>. The optional values are:</p>\n<ul>\n<li>&#39;column&#39;: series are positioned on each columns of the dataset. Default value.</li>\n<li>&#39;row&#39;: series are positioned on each row of the dataset.</li>\n</ul>\n<p>See the example below:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        source: [\n            [&#39;product&#39;, &#39;2012&#39;, &#39;2013&#39;, &#39;2014&#39;, &#39;2015&#39;],\n            [&#39;Matcha Latte&#39;, 41.1, 30.4, 65.1, 53.3],\n            [&#39;Milk Tea&#39;, 86.5, 92.1, 85.7, 83.1],\n            [&#39;Cheese Cocoa&#39;, 24.1, 67.2, 79.5, 86.4]\n        ]\n    },\n    xAxis: [\n        {type: &#39;category&#39;, gridIndex: 0},\n        {type: &#39;category&#39;, gridIndex: 1}\n    ],\n    yAxis: [\n        {gridIndex: 0},\n        {gridIndex: 1}\n    ],\n    grid: [\n        {bottom: &#39;55%&#39;},\n        {top: &#39;55%&#39;}\n    ],\n    series: [\n        // These series is in the first cartesian (grid), and each\n        // is mapped to a row.\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        // These series is in the second cartesian (grid), and each\n        // is mapped to a column.\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1}\n    ]\n}\n</code></pre>\n<p>This is the result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-series-layout-by&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n<h2 id=\"dimension\">Dimension</h2>\n<p>Before introducing <code class=\"codespan\">encode</code>, we should clarify the concept of <code class=\"codespan\">dimension</code>.</p>\n<p>Most of common charts describe data in the format of &quot;two-dimensions table&quot; (note that the meaning of the word &quot;dimension&quot; in &quot;two-dimension table&quot; is not the same as the dimensions in ECharts. \bIn order not to be confusing, we use &quot;2d-table&quot;, &quot;2d-array&quot; below). In the examples above, we use 2d-array to carry the 2d-table. When we set <code class=\"codespan\">seriesLayoutBy</code> as <code class=\"codespan\">&#39;column&#39;</code>, namely, mapping columns to series, each column is called a dimension, and each row is a data item. When we set <code class=\"codespan\">seriesLayoutBy</code> as <code class=\"codespan\">&#39;row&#39;</code>, namely, mapping rows to series, each row is called a dimension, and each column is a data item.</p>\n<p>Dimension can have its name to displayed on charts. Dimension name can be defined on the first row/column. Take the code above as an example, <code class=\"codespan\">&#39;score&#39;</code>、<code class=\"codespan\">&#39;amount&#39;</code>、<code class=\"codespan\">&#39;product&#39;</code> are dimension names, and data start from the second row. By default ECharts auto detect whether the first row/column of <code class=\"codespan\">dataset.source</code> is dimension name or data. Use can also set <code class=\"codespan\">dataset.sourceHeader</code> as <code class=\"codespan\">true</code> to mandatorily specify the first row/column is dimension name, or set as <code class=\"codespan\">false</code> to indicate the data start from the first row/column.</p>\n<p>The definitions of the dimensions can also be provided separately in <code class=\"codespan\">dataset.dimensions</code> or <code class=\"codespan\">series.dimensions</code>, where not only dimension name, but also dimension type can be specified:</p>\n<pre><code class=\"lang-js\">var option1 = {\n    dataset: {\n        dimensions: [\n            // Each item can be object or string.\n            {name: &#39;score&#39;},\n            // A string indicates the dimension name.\n            &#39;amount&#39;,\n            // Dimension type can be specified.\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ],\n        source: [...]\n    },\n    ...\n};\n\nvar option2 = {\n    dataset: {\n        source: [...]\n    },\n    series: {\n        type: &#39;line&#39;,\n        // Dimensions declared in series will be adapted with higher priority.\n        dimensions: [\n            null, // Set as null means we dont want to set dimension name.\n            &#39;amount&#39;,\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ]\n    },\n    ...\n};\n</code></pre>\n<p>Generally, we do not need to set dimensions types, because it can be auto detected based on data by ECharts. But in some cases, for example, the data is empty, the detection might not be accurate, where dimension type can be set manually.</p>\n<p>The optional values of dimension types can be:</p>\n<ul>\n<li><code class=\"codespan\">&#39;number&#39;</code>: Normal data, default value.</li>\n<li><code class=\"codespan\">&#39;ordinal&#39;</code>: Represents string data like category data or text data. ECharts will auto detect them by default. They can be set manually if the detection fail.</li>\n<li><code class=\"codespan\">&#39;time&#39;</code>: Represents time data, where it is supported that parse time string to timestamp. For example, if users need to parse &#39;2017-05-10&#39; to timestamp, it should be set as <code class=\"codespan\">time</code> type. If the dimension is used on a time axis (<a href=\"option.html#xAxis.type\" target=\"_blank\">axis.type</a> is <code class=\"codespan\">&#39;time&#39;</code>), it will be auto set to <code class=\"codespan\">time</code> type. The supported time string is listed in <a href=\"option.html#series.data\" target=\"_blank\">data</a>.</li>\n<li><code class=\"codespan\">&#39;float&#39;</code>: If set as <code class=\"codespan\">&#39;float&#39;</code>, it will be stored in <code class=\"codespan\">TypedArray</code>, which is good for performance optimization.</li>\n<li><code class=\"codespan\">&#39;int&#39;</code>: If set as <code class=\"codespan\">&#39;int&#39;</code>, it will be stored in <code class=\"codespan\">TypedArray</code>, which is good for performance optimization.</li>\n</ul>\n<h2 id=\"mapping-from-data-to-graphic-encode-\">Mapping from data to graphic (encode)</h2>\n<p>Having the concept of dimension clarified, we can use <a href=\"option.html#series.encode\" target=\"_blank\">encode</a> to map data to graphic:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [&#39;score&#39;, &#39;amount&#39;, &#39;product&#39;],\n            [89.3, 58212, &#39;Matcha Latte&#39;],\n            [57.1, 78254, &#39;Milk Tea&#39;],\n            [74.4, 41032, &#39;Cheese Cocoa&#39;],\n            [50.1, 12755, &#39;Cheese Brownie&#39;],\n            [89.7, 20145, &#39;Matcha Cocoa&#39;],\n            [68.1, 79146, &#39;Tea&#39;],\n            [19.6, 91852, &#39;Orange Juice&#39;],\n            [10.6, 101852, &#39;Lemon Juice&#39;],\n            [32.7, 20112, &#39;Walnut Brownie&#39;]\n        ]\n    },\n    xAxis: {},\n    yAxis: {type: &#39;category&#39;},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            encode: {\n                // Map dimension &quot;amount&quot; to the X axis.\n                x: &#39;amount&#39;,\n                // Map dimension &quot;product&quot; to the Y axis.\n                y: &#39;product&#39;\n            }\n        }\n    ]\n};\n</code></pre>\n<p>This is the result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/dataset-encode-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n\n<p>The basic structure of <a href=\"option.html#series.encode\" target=\"_blank\">encode</a> is illustrated as follows, where the left part of colon is the name of axis like <code class=\"codespan\">&#39;x&#39;</code>, <code class=\"codespan\">&#39;y&#39;</code>, <code class=\"codespan\">&#39;radius&#39;</code>, <code class=\"codespan\">&#39;angle&#39;</code> or some special reserved names like &quot;tooltip&quot;, &quot;itemName&quot; etc., and the right part of the colon is the dimension names or dimension indices (based on 0). One or more dimensions can be specified. Usually not all of mappings need to be specified, only specify needed ones.</p>\n<p>The properties available in <code class=\"codespan\">encode</code> listed as follows:</p>\n<pre><code class=\"lang-js\">// In any of the series and coordinate systems,\n// these properties are available:\nencode: {\n    // Display dimension &quot;product&quot; and &quot;score&quot; in the tooltip.\n    tooltip: [&#39;product&#39;, &#39;score&#39;]\n    // Set the series name as the concat of the names of dimensions[1] and dimensions[3].\n    // (sometimes the dimension names are too long to type in series.name manually).\n    seriesName: [1, 3],\n    // Using dimensions[2] as the id of each data item. This is useful when dynamically\n    // update data by `chart.setOption()`, where the new and old data item can be\n    // corresponded by id, by which the appropriate animation can be performed when updating.\n    itemId: 2,\n    // Using dimensions[3] as the name of each data item. This is useful in charts like\n    // &#39;pie&#39;, &#39;funnel&#39;, where data item name can be displayed in legend.\n    itemName: 3\n}\n\n// These properties only work in cartesian(grid) coordinate system:\nencode: {\n    // Map dimensions[1], dimensions[5] and dimension &quot;score&quot; to the X axis.\n    x: [1, 5, &#39;score&#39;],\n    // Map dimensions[0] to the Y axis.\n    y: 0\n}\n\n// These properties only work in polar coordinate system:\nencode: {\n    radius: 3,\n    angle: 2,\n    ...\n}\n\n// These properties only work in geo coordinate system:\nencode: {\n    lng: 3,\n    lat: 2\n}\n\n// For some type of series that are not in any coordinate system,\n// like &#39;pie&#39;, &#39;funnel&#39; etc.:\nencode: {\n    value: 3\n}\n</code></pre>\n<p>There is an other example for <code class=\"codespan\">encode</code>:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n\n\n<h2 id=\"visual-encoding-color-symbol-etc-\">Visual encoding (color, symbol, etc.)</h2>\n<p>We can use <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> component to map data to visual channel like color, symbol size, etc.. More info about it can be checked in its <a href=\"option.html#visualMap\" target=\"_blank\">doc</a>.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode0&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n\n<h2 id=\"default-encoding\">Default encoding</h2>\n<p>For some common cases (line chart, bar chart, scatter plot, candlestick, pie, funnel, etc.), EChart provides default encoding settings, by which chart will be displayed even if no <code class=\"codespan\">encode</code> option is specified. (If <code class=\"codespan\">encode</code> option is specified, default encoding will not be applied.) The rule of default encoding should not be too complicated. Basically it is:</p>\n<ul>\n<li>In coordinate system (like cartesian(grid), polar):<ul>\n<li>If category axis (i.e., axis.type is <code class=\"codespan\">&#39;category&#39;</code>) exists, map the first column/row to the axis, and each series use a following column/row.</li>\n<li>If no category axis exists, and the coordinate system contains two axis (like X Y in cartesian), each series use two columns/rows, one for a axis.</li>\n</ul>\n</li>\n<li>If no coordinate system (like pie chart):<ul>\n<li>Use the first column/row as item name, and the second column/row as item value.</li>\n</ul>\n</li>\n</ul>\n<p>If the default rule does not meet the requirements, configure the <code class=\"codespan\">encode</code> yourself please.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-default&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n\n<h2 id=\"q-a\">Q &amp; A</h2>\n<p>Q: How to map the third column to X axis, and map the fifth column to Y axis?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">series: {\n    // Notice that the dimension index is based on 0,\n    // thus the third column is dimensions[2].\n    encode: {x: 2, y: 4},\n    ...\n}\n</code></pre>\n<p>Q: How to map the third row th X axis, and map the fifth row to Y axis?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {x: 2, y: 4},\n    seriesLayoutBy: &#39;row&#39;,\n    ...\n}\n</code></pre>\n<p>Q: How to use the values in the second column in label.</p>\n<p>A:\nThe <a href=\"option.html#series.label.formatter\" target=\"_blank\">label.formatter</a> supports refer value in a certain dimension. For example:</p>\n<pre><code class=\"lang-js\">series: {\n    label: {\n        // `&#39;{@score}&#39;` means use the value in the &quot;score&quot; dimension.\n        // `&#39;{@[4]}&#39;` means use the value in dimensions[4].\n        formatter: &#39;aaa{@product}bbb{@score}ccc{@[4]}ddd&#39;\n    }\n}\n</code></pre>\n<p>Q: How to display the second column and the third column in tooltip?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {\n        tooltip: [1, 2]\n        ...\n    },\n    ...\n}\n</code></pre>\n<p>Q: If there is no dimension name in dataset.source, how to give dimension name?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">dataset: {\n    dimensions: [&#39;score&#39;, &#39;amount&#39;],\n    source: [\n        [89.3, 3371],\n        [92.1, 8123],\n        [94.4, 1954],\n        [85.4, 829]\n    ]\n}\n</code></pre>\n<p>Q: How to encode the third column in bubble size in bubble plot?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [12, 323, 11.2],\n            [23, 167, 8.3],\n            [81, 284, 12],\n            [91, 413, 4.1],\n            [13, 287, 13.5]\n        ]\n    },\n    // Use visualMap to perform visual encoding.\n    visualMap: {\n        show: false,\n        dimension: 2, // Encode the third column.\n        min: 2, // Min value is required in visualMap component.\n        max: 15, // Max value is required in visualMap component.\n        inRange: {\n            // The range of bubble size, from 5 pixel to 60 pixel.\n            symbolSize: [5, 60]\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: {\n        type: &#39;scatter&#39;\n    }\n};\n</code></pre>\n<p>Q: We have specified <code class=\"codespan\">encode</code>, but why it does not work?</p>\n<p>A: Maybe we can try to check typo, for example, the dimension name is <code class=\"codespan\">&#39;Life Expectancy&#39;</code>, be we typed <code class=\"codespan\">&#39;Life Expectency&#39;</code> in <code class=\"codespan\">encode</code> option.</p>\n<h2 id=\"various-formats-in-dataset\">Various formats in dataset</h2>\n<p>In lots of cases, data is described in 2d-table. For example, some data processing software like MS Excel, Numbers are based on 2d-table. The data can be exported as JSON format and input to <code class=\"codespan\">dataset.source</code>.</p>\n<blockquote>\n<p>Some csv tools can be used to export the table data to JSON, for example, <a href=\"https://github.com/d3/d3-dsv\" target=\"_blank\">dsv</a> or <a href=\"https://github.com/mholt/PapaParse\" target=\"_blank\">PapaParse</a>.</p>\n</blockquote>\n<p>In common used data transfer formats in JavaScript, 2d-array is a good choice to carry table data, which has been illustrated in the examples above.</p>\n<p>Besides, 2d-array, <code class=\"codespan\">dataset</code> also support key-value format as follows, which is also commonly used. But notice, the option <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">seriesLayoutBy</a> is not supported in this format.</p>\n<pre><code class=\"lang-js\">dataset: [{\n    // Row based key-value format, namely, object array, is a commonly used format.\n    source: [\n        {product: &#39;Matcha Latte&#39;, count: 823, score: 95.8},\n        {product: &#39;Milk Tea&#39;, count: 235, score: 81.4},\n        {product: &#39;Cheese Cocoa&#39;, count: 1042, score: 91.2},\n        {product: &#39;Walnut Brownie&#39;, count: 988, score: 76.9}\n    ]\n}, {\n    // Column based key-value format is also supported.\n    source: {\n        &#39;product&#39;: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;],\n        &#39;count&#39;: [823, 235, 1042, 988],\n        &#39;score&#39;: [95.8, 81.4, 91.2, 76.9]\n    }\n}]\n</code></pre>\n<h2 id=\"multiple-datasets-and-references\">Multiple datasets and references</h2>\n<p>Multiple datasets can be defined, and series can refer them by <a href=\"option.html#series.datasetIndex\" target=\"_blank\">series.datasetIndex</a>.</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: [{\n        source: [...],\n    }, {\n        source: [...]\n    }, {\n        source: [...]\n    }],\n    series: [{\n        // Use the third dataset.\n        datasetIndex: 2\n    }, {\n        // Use the second dataset.\n        datasetIndex: 1\n    }]\n}\n</code></pre>\n<h2 id=\"echarts3-data-setting-approach-series-data-can-be-used-normally\">ECharts3 data setting approach (series.data) can be used normally</h2>\n<p>The data setting approach before ECharts4 can still be used normally. If a series has declared <a href=\"option.html#series.data\" target=\"_blank\">series.data</a>, it will be used but not <code class=\"codespan\">dataset</code>.</p>\n<pre><code class=\"lang-js\">{\n    xAxis: {\n        type: &#39;category&#39;\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [{\n        type: &#39;bar&#39;,\n        name: &#39;2015&#39;,\n        data: [89.3, 92.1, 94.4, 85.4]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2016&#39;,\n        data: [95.8, 89.4, 91.2, 76.9]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2017&#39;,\n        data: [97.7, 83.1, 92.5, 78.1]\n    }]\n}\n</code></pre>\n<p>In fact, setting data via <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> is not deprecated and useful in some cases. For example, for some charts, like <a href=\"option.html#series-treemap\" target=\"_blank\">treemap</a>, <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>, <a href=\"option.html#series-lines\" target=\"_blank\">lines</a>, that do not apply table data, <code class=\"codespan\">dataset</code> is not supported for yet. Moreover, for the case of large data rendering (for example, millions of data), <a href=\"api.html#echartsInstance.appendData\" target=\"_blank\">appendData</a> is probably needed to load data incrementally. <code class=\"codespan\">dataset</code> is not supported in the case.</p>\n<h2 id=\"others\">Others</h2>\n<p>Currently, not all types of series support dataset. Series that support dataset includes:</p>\n<p><code class=\"codespan\">line</code>, <code class=\"codespan\">bar</code>, <code class=\"codespan\">pie</code>, <code class=\"codespan\">scatter</code>, <code class=\"codespan\">effectScatter</code>, <code class=\"codespan\">parallel</code>, <code class=\"codespan\">candlestick</code>, <code class=\"codespan\">map</code>, <code class=\"codespan\">funnel</code>, <code class=\"codespan\">custom</code>.</p>\n<p>More types of series will support dataset in our further work.</p>\n<p>Finally, this is an example, multiple series sharing one <code class=\"codespan\">dataset</code> and having interactions:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-link&edit=1&reset=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n\n\n\n"},"Add interaction to the chart component":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> provides many interaction components besides chart. For example:</p>\n<p><code class=\"codespan\">legend component</code> <a href=\"option.html#legend\" target=\"_blank\">legend</a>、<code class=\"codespan\">title component</code> <a href=\"option.html#title\" target=\"_blank\">title</a>、<code class=\"codespan\">visualmap component</code> <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>、<code class=\"codespan\">datazoom component</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>、<code class=\"codespan\">dataline component</code> <a href=\"option.html#timeline\" target=\"_blank\">timeline</a></p>\n<p>Following is an example of <code class=\"codespan\">datazoom component</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> as an introduction of how to add this kind of component.</p>\n<h2 id=\"introduction-of-data-zoom-component-datazoom-\">Introduction of data zoom component (dataZoom)</h2>\n<p>Data overview by default, and detail by requirement is a basic interaction need of data visualization. <code class=\"codespan\">dataZoom</code> component can implement this function in rectangular coordinate (<a href=\"option.html#grid\" target=\"_blank\">grid</a>) and polar coordinate (<a href=\"option.html#polar\" target=\"_blank\">polar</a>.</p>\n<p><strong>For example: </strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-dataZoom-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<ul>\n<li><code class=\"codespan\">dataZoom</code> component operates <em>data window zoom</em> and <em>data window translation</em> on <code class=\"codespan\">axis</code>.</li>\n</ul>\n<blockquote>\n<p>Use <a href=\"option.html#dataZoom.xAxisIndex\" target=\"_blank\">dataZoom.xAxisIndex</a>, <a href=\"option.html#dataZoom.yAxisIndex\" target=\"_blank\">dataZoom.yAxisIndex</a> to specify which axis <code class=\"codespan\">dataZoom</code> controls.</p>\n</blockquote>\n<ul>\n<li><p>Multiple <code class=\"codespan\">dataZoom</code> components can exist at the same time to control function together. Components controling the same axis will be connected automatically. The example below explains in detail.</p>\n</li>\n<li><p>Operation principle of <code class=\"codespan\">dataZoom</code> achieves <em>data window zooming</em> through <em>data filtering</em>.</p>\n<p>  Different settings of data filtering modes lead to different data window zooming effects, please see: <a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a>.</p>\n</li>\n<li><p>Setting of <code class=\"codespan\">dataZoom</code> data window range supports two formats currently:</p>\n<ul>\n<li><p>Percentage: see <a href=\"option.html#dataZoom.start\" target=\"_blank\">dataZoom.start</a> and <a href=\"option.html#dataZoom.end\" target=\"_blank\">dataZoom.end</a>.</p>\n</li>\n<li><p>Absolute value: see <a href=\"option.html#dataZoom.startValue\" target=\"_blank\">dataZoom.startValue</a> and <a href=\"option.html#dataZoom.endValue\" target=\"_blank\">dataZoom.endValue</a>.</p>\n</li>\n</ul>\n</li>\n</ul>\n<p><strong>dataZoom component supports several child components: </strong></p>\n<ul>\n<li><p><a href=\"option.html#dataZoom-inside\" target=\"_blank\">Inside data zoom component (dataZoomInside)</a>: inside coordinates.</p>\n</li>\n<li><p><a href=\"option.html#dataZoom-slider\" target=\"_blank\">Slider data zoom component (dataZoomSlider)</a>: has seperate slide option.</p>\n</li>\n<li><p><a href=\"option.html#toolbox.feature.dataZoom\" target=\"_blank\">Select data zoom component (dataZoomSelect)</a>: full-screen box for zoom data area. Entrance and configuration item are both in <code class=\"codespan\">toolbox</code>.</p>\n</li>\n</ul>\n<h2 id=\"adding-datazoom-component\">Adding dataZoom component</h2>\n<p>First, only add dataZoom component to x-axis. Following examples shows the code.</p>\n<pre><code class=\"lang-javascript\">\noption = {\n    xAxis: {\n        type: &#39;value&#39;\n    },\n    yAxis: {\n        type: &#39;value&#39;\n    },\n    dataZoom: [\n        {   // This dataZoom component controls x-axis by dafault\n            type: &#39;slider&#39;, // this dataZoom component is dataZoom component of slider\n            start: 10,      // the left is located at 10%\n            end: 60         // the right is located at 60%\n        }\n    ],\n    series: [\n        {\n            type: &#39;scatter&#39;, // this is scatter chart\n            itemStyle: {\n                opacity: 0.8\n            },\n            symbolSize: function (val) {\n                return val[2] * 40;\n            },\n            data: [[&quot;14.616&quot;,&quot;7.241&quot;,&quot;0.896&quot;],[&quot;3.958&quot;,&quot;5.701&quot;,&quot;0.955&quot;],[&quot;2.768&quot;,&quot;8.971&quot;,&quot;0.669&quot;],[&quot;9.051&quot;,&quot;9.710&quot;,&quot;0.171&quot;],[&quot;14.046&quot;,&quot;4.182&quot;,&quot;0.536&quot;],[&quot;12.295&quot;,&quot;1.429&quot;,&quot;0.962&quot;],[&quot;4.417&quot;,&quot;8.167&quot;,&quot;0.113&quot;],[&quot;0.492&quot;,&quot;4.771&quot;,&quot;0.785&quot;],[&quot;7.632&quot;,&quot;2.605&quot;,&quot;0.645&quot;],[&quot;14.242&quot;,&quot;5.042&quot;,&quot;0.368&quot;]]\n        }\n    ]\n}\n</code></pre>\n<p>which will show the following result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-1&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p><br></p>\n<p>The chart above can only change window by dragging dataZoom component. If you want to drag in coordinate, or use mouse wheel (or slides with two fingers on mobile) to zoom, then another inside dataZoom component needs to be added. You can just add in the <code class=\"codespan\">option.dataZoom</code> above:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {   // this dataZoom component controls x-axis by dafault\n            type: &#39;slider&#39;, // this dataZoom component is dataZoom component of slider\n            start: 10,      // the left is located at 10%\n            end: 60         // the right is located at 60%\n        },\n        {   // This dataZoom component controls x-axis by dafault\n            type: &#39;inside&#39;, // this dataZoom component is dataZoom component of inside\n            start: 10,      // the left is located at 10%\n            end: 60         // the right is located at 60%\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>Following results can be seen (you can now slide or use mouse wheel to zoom in coordinate) :</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-2&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<p><br></p>\n<p>If you want to enable zooming on y-axis, then you need to add dataZoom componet on y-axis:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {\n            type: &#39;slider&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;inside&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;slider&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        },\n        {\n            type: &#39;inside&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>Following result can be seen:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-3&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n\n\n\n\n\n"},"Responsive Mobile-End":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> works in DOM nodes with user defined width and height. ECharts <em>component</em> and <em>series</em> are both in this DOM node, whose location can be assigned by user seperately. Inner components of charts are not suitable for implementing DOM flow layout. Instead, we use a simpler and more understandable layout similar to absolute layout. But sometimes when container is of extreme size, this method cannot avoid component overlapping automatically, especially on small screens on mobile-end.</p>\n<p>Besides, sometimes one chart may need to be displayed on both PC and mobile-end, which involves the ability of ECharts inner components to be responsive with different container sizes.</p>\n<p>To solve this problem, ECharts improved component location algorithm, and implemented responsive ability similar to <a href=\"https://www.w3.org/TR/css3-mediaqueries/\" target=\"_blank\">CSS Media Query</a>.</p>\n<h2 id=\"location-and-layout-of-echarts-components\">Location and layout of ECharts components</h2>\n<p>Most <em>component</em> and <em>series</em> follow two locating methods:</p>\n<p><br>\n<strong>left/right/top/bottom/width/height locating method:</strong></p>\n<p>Each of those six parameters can be <em>absolute value</em> or <em>percentage</em> or <em>location description</em>.</p>\n<ul>\n<li><p>Absolute value</p>\n<p>  in browser pixels (px); in form of <code class=\"codespan\">number</code> (no unit); e.g.: <code class=\"codespan\">{left: 23, height: 400}</code>.</p>\n</li>\n<li><p>Percentage</p>\n<p>  to the width and height of DOM container; in form of <code class=\"codespan\">string</code>; e.g.: <code class=\"codespan\">{right: &#39;30%&#39;, bottom: &#39;40%&#39;}</code>.</p>\n</li>\n<li><p>Location Description</p>\n<ul>\n<li>can be set to <code class=\"codespan\">left: &#39;center&#39;</code>, for horizontally centering.</li>\n<li>can be set to <code class=\"codespan\">top: &#39;middle&#39;</code>, for vertically centering.</li>\n</ul>\n</li>\n</ul>\n<p>The concept of these six parameters is similar to that in CSS:</p>\n<ul>\n<li>left: distance to left border of DOM container.</li>\n<li>right: distance to right border of DOM container.</li>\n<li>top: distance to top border of DOM container.</li>\n<li>bottom: distance to bottom border of DOM container.</li>\n<li>width: width.</li>\n<li>height: height.</li>\n</ul>\n<p>Two out of the three horizontal parameters, <code class=\"codespan\">left</code>, <code class=\"codespan\">right</code>, <code class=\"codespan\">width</code>, are enough to determine the component location. For example, <code class=\"codespan\">left</code> and <code class=\"codespan\">right</code>, or <code class=\"codespan\">right</code> and <code class=\"codespan\">width</code> can both determine component location and size.\nThe same goes for vertical paramters <code class=\"codespan\">top</code>, <code class=\"codespan\">bottom</code> and <code class=\"codespan\">height</code>.</p>\n<p><br>\n<strong>Locating method of <code class=\"codespan\">center</code> / <code class=\"codespan\">radius</code>: </strong></p>\n<ul>\n<li><p><code class=\"codespan\">center</code></p>\n<p>  an array in form of <code class=\"codespan\">[x, y]</code>, in which <code class=\"codespan\">x</code> and <code class=\"codespan\">y</code> can either be <em>absolute value</em> or <em>percentage</em>, as described above.</p>\n</li>\n<li><p><code class=\"codespan\">radius</code></p>\n<p>  an array in form of <code class=\"codespan\">[innerRadius, outerRadius]</code>, in which <code class=\"codespan\">innerRadius</code> and <code class=\"codespan\">outerRadius</code> can either be <em>absolute value</em> or <em>percentage</em>, as described above.</p>\n<p>  Percentage location turns out to be very useful for responsive positioning.</p>\n</li>\n</ul>\n<p><br>\n<strong>Horizontal and vertical</strong></p>\n<p>Most of ECharts&#39;s long and narrow components (such as <code class=\"codespan\">legend</code>,<code class=\"codespan\">visualMap</code>,<code class=\"codespan\">dataZoom</code>,<code class=\"codespan\">timeline</code> and so on), provide option to set them to be horizontal or vertical. For example, long and narrow screen of mobile-end, vertical layout may be a more suitable choice, while horizontal may more suit for PC&#39;s wide screen.</p>\n<p>Setting of horizontal or vertical layout is usually with component or series&#39;s <code class=\"codespan\">orient</code> or <code class=\"codespan\">layout</code> option, which can be set to <code class=\"codespan\">&#39;horizontal&#39;</code> or <code class=\"codespan\">&#39;vertical&#39;</code>.</p>\n<p><br>\n<strong>Compatibility with ECharts2: </strong></p>\n<p>Naming of <code class=\"codespan\">x/x2/y/y2</code> in ECharts2 is still compatible, as well as the newly added <code class=\"codespan\">left/right/top/bottom</code>. But <code class=\"codespan\">left/right/top/bottom</code> is recommended.</p>\n<p>To be compatible with ECharts2, there may be settings that seems to be odd, e.g.: <code class=\"codespan\">left: &#39;right&#39;</code>, <code class=\"codespan\">left: &#39;left&#39;</code>, <code class=\"codespan\">top: &#39;bottom&#39;</code>, <code class=\"codespan\">top: &#39;top&#39;</code>, which are equal to: <code class=\"codespan\">right: 0</code>, <code class=\"codespan\">left: 0</code>, <code class=\"codespan\">bottom: 0</code>, <code class=\"codespan\">top: 0</code>, in a more normal expression.</p>\n<h2 id=\"media-query\">Media Query</h2>\n<p><a href=\"https://www.w3.org/TR/css3-mediaqueries/#media1\" target=\"_blank\">Media Query</a> provides the ability to be responsive with container size.</p>\n<p>As shown in the following example, you may drag <strong>the circle in bottom-right corner</strong> to see the legend and series change layout position and method with container size.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-media&edit=1&reset=1\" width=\"750\" height=\"600\" ></iframe>\n\n\n<p>The following format should be followed if you need to set Media Query in option:</p>\n<pre><code class=\"lang-javascript\">option = {\n    baseOption: { // here defines base option\n        title: {...},\n        legend: {...},\n        series: [{...}, {...}, ...],\n        ...\n    },\n    media: [ // each rule of media query is defined here\n        {\n            query: {...},   // write rule here\n            option: {       // write options accordingly\n                legend: {...},\n                ...\n            }\n        },\n        {\n            query: {...},   // the second rule\n            option: {       // the second option\n                legend: {...},\n                ...\n            }\n        },\n        {                   // default with no rules,\n            option: {       // when all rules fail, use this option\n                legend: {...},\n                ...\n            }\n        }\n    ]\n};\n</code></pre>\n<p>In the above example, <code class=\"codespan\">baseOption</code> and every option in <code class=\"codespan\">media</code> are all <em>simple options</em>, which are regular options containing components and series. <code class=\"codespan\">baseOption</code> is always be used, while options of every will be merged with <code class=\"codespan\">chart.mergeOption()</code> when given <code class=\"codespan\">query</code> condition is satisfied with.</p>\n<p><strong>query: </strong></p>\n<p>A <code class=\"codespan\">query</code> is in the following format:</p>\n<pre><code class=\"lang-javascript\">{\n    minWidth: 200,\n    maxHeight: 300,\n    minAspectRatio: 1.3\n}\n</code></pre>\n<p>Currently there are three supported attributes:<code class=\"codespan\">width</code>, <code class=\"codespan\">height</code>, <code class=\"codespan\">aspectRatio</code> (length-to-width ratio), each of which can add <code class=\"codespan\">min</code> or <code class=\"codespan\">max</code> as prefix. E.g., <code class=\"codespan\">minWidth: 200</code> stands for when width is greater than or equal to 200px. When two attributes are written together, it means <em>and</em> in Bool logic. For example, <code class=\"codespan\">{minWidth: 200, maxHeight: 300}</code> stands for when width is greater than or equal to 200px and height is smaller than or equal to 300px.</p>\n<p><strong>option: </strong></p>\n<p>Since option in <code class=\"codespan\">media</code> is <em>simple option</em>, technically speaking, you can write every option configuration item. But usually we only write those related to layout. Take part of the above query option as example:</p>\n<pre><code class=\"lang-javascript\">media: [\n    ...,\n    {\n        query: {\n            maxAspectRatio: 1           // when length-to-width ratio is less than 1\n        },\n        option: {\n            legend: {                   // legend is placed in middle-bottom\n                right: &#39;center&#39;,\n                bottom: 0,\n                orient: &#39;horizontal&#39;    // horizontal layout of legend\n            },\n            series: [                   // left and right layout of two pie charts\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;70%&#39;]\n                }\n            ]\n        }\n    },\n    {\n        query: {\n            maxWidth: 500               // when container width is smaller than 500\n        },\n        option: {\n            legend: {\n                right: 10,              // legend is placed in middle-right\n                top: &#39;15%&#39;,\n                orient: &#39;vertical&#39;      // vertical layout\n            },\n            series: [                   // top and bottom layout of two pie charts\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;75%&#39;]\n                }\n            ]\n        }\n    },\n    ...\n]\n</code></pre>\n<p><strong>Priority when multiple queries are satisfied: </strong></p>\n<p>Attention: When multiple <code class=\"codespan\">query</code> are satisfied at the same time, all of them will be merged with <code class=\"codespan\">mergeOption</code> and those are defined later will be merged later, thus provides them with higher priority.</p>\n<p><strong>Query by default: </strong></p>\n<p>If an item in <code class=\"codespan\">media</code> has no not <code class=\"codespan\">query</code>, then it means <em>default value</em>, which will be used when all other rules fail.</p>\n<p><strong>Pay attention when container size changes:</strong></p>\n<p>In many cases, container DOM node doesn&#39;t need to change size with user dragging. Instead, it may set to several sizes on varied ends.</p>\n<p>But if the container DOM node needs to change size with dragging, you need to pay attention to this: if certain configuration item appears in one <code class=\"codespan\">query option</code>, then it should also appeared in other <code class=\"codespan\">query option</code>, or it will not be able to return to the original state. (<code class=\"codespan\">left/right/top/bottom/width/height</code> are not restricted to this rule.)</p>\n<p><strong><code class=\"codespan\">media</code> in <em>composite option</em> does not support merge</strong></p>\n<p>When <code class=\"codespan\">chart.setOption(rawOption)</code> for the second, third, fourth, fifth, and etc. times, if <code class=\"codespan\">rawOption</code> is <code class=\"codespan\">composite option</code> (which means it contains <code class=\"codespan\">media</code> list), then, the new <code class=\"codespan\">rawOption.media</code> list will not merge with the old <code class=\"codespan\">media</code>. instead, it will simply replace the option. Of course, <code class=\"codespan\">rawOption.baseOption</code> will still merge with the old option normally.</p>\n<p><br>\nFinally, let&#39;s see an example combining with timeline:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/bar-media-timeline&edit=1&reset=1\" width=\"750\" height=\"700\" ></iframe>\n\n\n\n\n\n\n"},"Visual Map of Data":{"type":["*"],"description":"<p>Data visualization is a procedure of mapping data into visual elements. This procedure can also be called visual coding, and visual elements can also be called visual tunnels.</p>\n<p>Every type of charts in Apache ECharts (incubating)<sup>TM</sup> has this built-in mapping procedure. For example, line charts map data into <em>lines</em>, bar charts map data into <em>length</em>. Some more complicated charts, like <code class=\"codespan\">graph</code>, <code class=\"codespan\">themeRiver</code>, and <code class=\"codespan\">treemap</code> have their own built-in mapping.</p>\n<p>Besides, ECharts provides <a href=\"option.html#visualMap\" target=\"_blank\">visualMap component</a> for general visual mapping. Visual elements allowed in <code class=\"codespan\">visualMap</code> component are:<br>\n<code class=\"codespan\">symbol</code>, <code class=\"codespan\">symbolSize</code><br>\n<code class=\"codespan\">color</code>, <code class=\"codespan\">opacity</code>, <code class=\"codespan\">colorAlpha</code>, <br>\n<code class=\"codespan\">colorLightness</code>, <code class=\"codespan\">colorSaturation</code>, <code class=\"codespan\">colorHue</code></p>\n<p>Next, we are going to introduce how to use <code class=\"codespan\">visualMap</code> component.</p>\n<h2 id=\"data-and-dimension\">Data and Dimension</h2>\n<p>Data are usually stored in <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> in ECharts. Depending on chart types, like list, tree, graph, and so on, the form of data may vary somehow. But they have one common feature, that they are a collection of <code class=\"codespan\">dataItem</code>s. Every data item contains data value, and other information if needed. Every data value can be a single value (one dimension) or an array (multiple dimensions).</p>\n<p>For example, <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> is the most common form, which is a <code class=\"codespan\">list</code>, a common array:</p>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {       // every item here is a dataItem\n            value: 2323, // this is data value\n            itemStyle: {...}\n        },\n        1212,   // it can also be a value of dataItem, which is a more common case\n        2323,   // every data value here is one dimension\n        4343,\n        3434\n    ]\n}\n</code></pre>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {                        // every item here is a dataItem\n            value: [3434, 129,  &#39;San Marino&#39;], // this is data value\n            itemStyle: {...}\n        },\n        [1212, 5454, &#39;Vatican&#39;],   // it can also be a value of dataItem, which is a more common case\n        [2323, 3223, &#39;Nauru&#39;],     // every data value here is three dimension\n        [4343, 23,   &#39;Tuvalu&#39;]    // If is scatter chart, usually map the first dimension to x axis,\n                                 // the second dimension to y axis,\n                                 // and the third dimension to symbolSize\n    ]\n}\n</code></pre>\n<p>Usually the first one or two dimensions are used for mapping. For example, map the first dimension to x axis, and the second dimension to y axis. If you want to represent more dimensions, <code class=\"codespan\">visualMap</code> is what you need. Most likely, <a href=\"option.html#series-scatter\" target=\"_blank\">scatter charts</a> use radius to represent the third dimension.</p>\n<h2 id=\"visualmap-component\">visualMap Component</h2>\n<p>visualMap component defines the mapping from <em>which dimension of data</em> to <em>what visual elements</em>.</p>\n<p>The following two types of visualMap components are supported, identified with <a href=\"option.html#visualMap.type\" target=\"_blank\">visualMap.type</a>.</p>\n<p>Its structure is defined as:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [ // can define multiple visualMap components at the same time\n        { // the first visualMap component\n            type: &#39;continuous&#39;, // defined as continuous visualMap\n            ...\n        },\n        { // the second visualMap component\n            type: &#39;piecewise&#39;, // defined as discrete visualMap\n            ...\n        }\n    ],\n    ...\n};\n</code></pre>\n<p><br>\n<a href=\"option.html#visualMap-continuous\" target=\"_blank\">visualMapContinuous</a>:</p>\n<p><a href=\"option.html#visualMap-piecewise\" target=\"_blank\">visualMapPiecewise</a>:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-visualMap-piecewise&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<p>Piecewise visual map component(visualMapPiecewise)has three types:</p>\n<ul>\n<li>Equal division of continuous data: divide equally based on <a href=\"option.html#visualMap-piecewise.splitNumber\" target=\"_blank\">visualMap-piecewise.splitNumber</a>;</li>\n<li>User-defined division of continuous data: divide with range in <a href=\"option.html#visualMap-piecewise.pieces\" target=\"_blank\">visualMap-piecewise.pieces</a>;</li>\n<li>Discrete data (data in category type): divide with <a href=\"option.html#visualMap-piecewise.categories\" target=\"_blank\">visualMap-piecewise.categories</a>.</li>\n</ul>\n<p><br>\n<strong>Configuration of visualMap mapping method</strong></p>\n<p>As we have introduced above, <code class=\"codespan\">visualMap</code> maps a certain dimension to a certain visual element, we can configure which dimension of the data (see in <a href=\"#visualMap.dimension\">visualMap.dimension</a>) to be mapped to which visual elements (see in <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> and <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>).</p>\n<p>Example A:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            type: &#39;piecewise&#39;,\n            min: 0,\n            max: 5000,\n            dimension: 3,       // the fourth dimension of series.data, or value[3], is mapped\n            seriesIndex: 4,     // map with the fourth series\n            inRange: {          // visual configuration items in selected range\n                color: [&#39;blue&#39;, &#39;#121122&#39;, &#39;red&#39;], // defines color list of mapping\n                                                   // The largest value will be mapped to &#39;red&#39;,\n                                                   // and others will be interpolated\n                symbolSize: [30, 100]              // the smallest value will be mapped to size of 30,\n                                                   // the largest to 100,\n                                                   // and others will be interpolated\n            },\n            outOfRange: {       // visual configuration items out of selected range\n                symbolSize: [30, 100]\n            }\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>Example B:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            ...,\n            inRange: {          // visual configuration items in selected range\n                colorLightness: [0.2, 1], // map to lightness, which will process lightness based on original color\n                                          // original color may be selected from global color palette,\n                                          // which is not concerned by visualMap component\n                symbolSize: [30, 100]\n            },\n            ...\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>For more information, please refer to <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> and <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>.</p>\n"},"Events and Actions in ECharts":{"type":["*"],"description":"<p>User interactions trigger corresponding events in Apache ECharts (incubating)<sup>TM</sup>. Developers can listen to these events and handle accordingly through callback functions, e.g., redirecting to an address, popping out a dialog box, or drilling down data and so on.</p>\n<p>Binding events in ECharts 3 is though <a href=\"api.html#EChartsInstance.on\" target=\"_blank\">on</a> method, same as in ECharts 2. But event names are much simpler than it is in 2. Event names in ECharts 3 are the same as DOM event names, in lowercases. Below is an example of binding clicking operation.</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    // printing data name in console\n    console.log(params.name);\n});\n</code></pre>\n<p>Event in ECharts can be divided in two kinds. One is mouse event, which is triggered when mouse clicks on certain component, the other is triggered with interaction components, such as triggering <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;legendselectchanged&#39;</a> event when toggling legend (Notice here, that <code class=\"codespan\">&#39;legendselected&#39;</code> event will not be triggered when toggling legend), triggering <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;datazoom&#39;</a> event when data zooming in some area.</p>\n<h2 id=\"mouse-events-handling\">Mouse Events Handling</h2>\n<p>ECharts support regular mouse events, which includes <code class=\"codespan\">&#39;click&#39;</code>, <code class=\"codespan\">&#39;dblclick&#39;</code>, <code class=\"codespan\">&#39;mousedown&#39;</code>, <code class=\"codespan\">&#39;mousemove&#39;</code>, <code class=\"codespan\">&#39;mouseup&#39;</code>, <code class=\"codespan\">&#39;mouseover&#39;</code>, <code class=\"codespan\">&#39;mouseout&#39;</code>, <code class=\"codespan\">&#39;globalout&#39;</code>, <code class=\"codespan\">&#39;contextmenu&#39;</code>. Next let&#39;s see an example of opening Baidu search page when clicks a bar chart.</p>\n<pre><code class=\"lang-js\">// initialize ECharts instance based on prepared dom\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n// data and configuration item of specific chart\nvar option = {\n    xAxis: {\n        data: [&quot;shirt&quot;,&quot;cardign&quot;,&quot;chiffon shirt&quot;,&quot;pants&quot;,&quot;heels&quot;,&quot;socks&quot;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n};\n// use specified configuration item and data to show chart\nmyChart.setOption(option);\n// handle click event and redirect to corresponding Baidu search page\nmyChart.on(&#39;click&#39;, function (params) {\n    window.open(&#39;https://www.baidu.com/s?wd=&#39; + encodeURIComponent(params.name));\n});\n</code></pre>\n<p>All types of mouse events have a common parameter called <code class=\"codespan\">params</code>, which is an object that contains data information of the clicked chart, whose format is as followed:</p>\n<pre><code class=\"lang-js\">{\n    // component name of clicked component\n    // e.g., &#39;series&#39;, &#39;markLine&#39;, &#39;markPoint&#39;, &#39;timeLine&#39;\n    componentType: string,\n    // series type (useful when componentType is &#39;series&#39;)\n    // e.g., &#39;line&#39;, &#39;bar&#39;, &#39;pie&#39;\n    seriesType: string,\n    // series index in option.series (useful when componentType is &#39;series&#39;)\n    seriesIndex: number,\n    // series name (useful when componentType is &#39;series&#39;)\n    seriesName: string,\n    // data name, or category name\n    name: string,\n    // data index in input data array\n    dataIndex: number,\n    // raw input data item\n    data: Object,\n    // Some series, such as sankey or graph, maintains both nodeData and edgeData,\n    // in which case, dataType is set to be &#39;node&#39; or &#39;edge&#39; to identify.\n    // On the other hand, most other series have only one type of data,\n    // where dataType is not needed.\n    dataType: string,\n    // input data value\n    value: number|Array\n    // color of component (useful when componentType is &#39;series&#39;)\n    color: string\n}\n</code></pre>\n<p>How to know where the mouse clicked:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    if (params.componentType === &#39;markPoint&#39;) {\n        // clicked on markPoint\n        if (params.seriesIndex === 5) {\n            // clicked on a markPoint which belongs to a series indexed with 5\n        }\n    }\n    else if (params.componentType === &#39;series&#39;) {\n        if (params.seriesType === &#39;graph&#39;) {\n            if (params.dataType === &#39;edge&#39;) {\n                // clicked on an edge of the graph\n            }\n            else {\n                // clicked on a node of the graph\n            }\n        }\n    }\n});\n</code></pre>\n<p>Use <code class=\"codespan\">query</code> to call handler only on the graphic elements of the specified components:</p>\n<pre><code class=\"lang-js\">chart.on(eventName, query, handler);\n</code></pre>\n<p><code class=\"codespan\">query</code> can be <code class=\"codespan\">string</code> or <code class=\"codespan\">Object</code>.</p>\n<p>If <code class=\"codespan\">string</code>, the formatter can be &#39;mainType&#39; or &#39;mainType.subType&#39;. For example:</p>\n<pre><code class=\"lang-js\">chart.on(&#39;click&#39;, &#39;series&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;series.line&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;dataZoom&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;xAxis.category&#39;, function () {...});\n</code></pre>\n<p>If <code class=\"codespan\">Object</code>, one or more properties below can be included, and any of them is optional.</p>\n<pre><code class=\"lang-js\">{\n    &lt;mainType&gt;Index: number // component index\n    &lt;mainType&gt;Name: string // component name\n    &lt;mainType&gt;Id: string // component id\n    dataIndex: number // data item index\n    name: string // data item name\n    dataType: string // data item type, e.g.,\n                     // &#39;node&#39; and &#39;edge&#39; in graph.\n    element: string // element name in custom series\n}\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        name: &#39;uuu&#39;\n        // ...\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesName: &#39;uuu&#39;}, function () {\n    // When the graphic elements in the series with name &#39;uuu&#39; mouse overed, this method called.\n});\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        // ...\n    }, {\n        // ...\n        data: [\n            {name: &#39;xx&#39;, value: 121},\n            {name: &#39;yy&#39;, value: 33}\n        ]\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesIndex: 1, name: &#39;xx&#39;}, function () {\n    // When the graphic elements of the data item with name &#39;xx&#39; in the series with index 1 mouse overed, this method called.\n});\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        type: &#39;graph&#39;,\n        nodes: [{name: &#39;a&#39;, value: 10}, {name: &#39;b&#39;, value: 20}],\n        edges: [{source: 0, target: 1}]\n    }]\n});\nchart.on(&#39;click&#39;, {dataType: &#39;node&#39;}, function () {\n    // When the nodes of the graph clicked, this method is called.\n});\nchart.on(&#39;click&#39;, {dataType: &#39;edge&#39;}, function () {\n    // When the edges of the graph clicked, this method is called.\n});\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        // ...\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;,\n                    name: &#39;my_el&#39;,\n                    // ...\n                }, {\n                    // ...\n                }]\n            }\n        },\n        data: [[12, 33]]\n    }\n})\nchart.on(&#39;click&#39;, {element: &#39;my_el&#39;}, function () {\n    // When the element with name &#39;my_el&#39; clicked, this method called.\n});\n</code></pre>\n<p>You may update chart or show customized layer with information got from your own data warehouse, indexed from data name or series name of an object received from a callback function. Sample code is shown as followed:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (parmas) {\n    $.get(&#39;detail?q=&#39; + params.name, function (detail) {\n        myChart.setOption({\n            series: [{\n                name: &#39;pie&#39;,\n                // present data distribution  of a single bar through pie chart\n                data: [detail.data]\n            }]\n        });\n    });\n});\n</code></pre>\n<h2 id=\"interaction-events-with-components\">Interaction Events with Components</h2>\n<p>Basically all component interactions in ECharts trigger corresponding events. Frequently used events and corresponding parameters are listed in <a href=\"api.html#events\" target=\"_blank\">events</a>.</p>\n<p>Below is example that listens to a legend toggling:</p>\n<pre><code class=\"lang-js\">// legend toggling triggers legendselectchanged event only\nmyChart.on(&#39;legendselectchanged&#39;, function (params) {\n    // obtain selecting status of clicked legend\n    var isSelected = params.selected[params.name];\n    // print in console\n    console.log((isSelected ? &#39;select&#39; : &#39;unselect&#39;) + &#39;legend&#39; + params.name);\n    // print all legend status\n    console.log(params.selected);\n});\n</code></pre>\n<h2 id=\"triggering-component-actions-through-code-in-echarts\">Triggering Component Actions through Code in ECharts</h2>\n<p>Actions like <code class=\"codespan\">&#39;legendselectchanged&#39;</code> mentioned above will be triggered by component interaction. Besides that, sometimes we need to trigger certain actions in our program, such as showing tooltip, or selecting legend.</p>\n<p>ECharts 2.x triggers actions through <code class=\"codespan\">myChart.component.tooltip.showTip</code>, whose entrance is deep and involves organization of inner components. On the other hand, ECharts 3 triggers actions through <code class=\"codespan\">myChart.dispatchAction({ type: &#39;&#39; })</code>, which manages all actions in a uniformed way, and may record user&#39;s event path when need.</p>\n<p>Frequently used actions and the parameters are listed in <a href=\"api.html#action\" target=\"_blank\">action</a>.</p>\n<p>Below displays how to highlight each sector of pie chart in turn through <code class=\"codespan\">dispatchAction</code>.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-highlight&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n\n"},"An Example: Implement Dragging":{"type":["*"],"description":"<p>This is a tiny example, introducing how to implement dragging of graphic elements in Apache ECharts (incubating)<sup>TM</sup>. From this example, we will see how to make an application with rich intractivity based on echarts API.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=line-draggable&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>This example mainly implements that dragging points of a curve and by which the curve is modified. Although it is simple example, but we can do more based on that, like edit charts viually. So let&#39;s get started from this simple example.</p>\n<h2 id=\"-part-1-implement-basic-dragging\">[ Part 1 ] Implement basic dragging</h2>\n<p>First of all, we create a basic <a href=\"option.html#series-line\" target=\"_blank\">line chart (line series)</a>:</p>\n<pre><code class=\"lang-js\">var symbolSize = 20;\nvar data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\nmyChart.setOption({\n    xAxis: {\n        min: -100,\n        max: 80,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    yAxis: {\n        min: -30,\n        max: 60,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    series: [\n        {\n            id: &#39;a&#39;,\n            type: &#39;line&#39;,\n            smooth: true,\n            // Set a big symbolSize for dragging convenience.\n            symbolSize: symbolSize,\n            data: data\n        }\n    ]\n});\n</code></pre>\n<p>Since the symbols in line is not draggable, we make them draggable by using <a href=\"option.html#graphic\" target=\"_blank\">graphic component</a> to add draggable circular elements to symbols respectively.</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    // Declare a graphic component, which contains some graphic elements\n    // with the type of &#39;circle&#39;.\n    // Here we have used the method `echarts.util.map`, which has the same\n    // behavior as Array.prototype.map, and is compatible with ES5-.\n    graphic: echarts.util.map(data, function (dataItem, dataIndex) {\n        return {\n            // &#39;circle&#39; means this graphic element is a shape of circle.\n            type: &#39;circle&#39;,\n\n            shape: {\n                // The radius of the circle.\n                r: symbolSize / 2\n            },\n            // Transform is used to located the circle. position:\n            // [x, y] means translate the circle to the position [x, y].\n            // The API `convertToPixel` is used to get the position of\n            // the circle, which will introduced later.\n            position: myChart.convertToPixel(&#39;grid&#39;, dataItem),\n\n            // Make the circle invisible (but mouse event works as normal).\n            invisible: true,\n            // Make the circle draggable.\n            draggable: true,\n            // Give a big z value, which makes the circle cover the symbol\n            // in line series.\n            z: 100,\n            // This is the event handler of dragging, which will be triggered\n            // repeatly while dragging. See more details below.\n            // A util method `echarts.util.curry` is used here to generate a\n            // new function the same as `onPointDragging`, except that the\n            // first parameter is fixed to be the `dataIndex` here.\n            ondrag: echarts.util.curry(onPointDragging, dataIndex)\n        };\n    })\n});\n</code></pre>\n<p>In the code above, API <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a> is used to convert data to its &quot;pixel coodinate&quot;, based on which each graphic elements can be rendered on canvas. The term &quot;pixel coodinate&quot; means the coordinate is in canvas pixel, whose origin is the top-left of the canvas. In the sentence <code class=\"codespan\">myChart.convertToPixel(&#39;grid&#39;, dataItem)</code>, the first parameter <code class=\"codespan\">&#39;grid&#39;</code> indicates that <code class=\"codespan\">dataItem</code> should be converted in the first <a href=\"option.html#grid\" target=\"_blank\">grid component (cartesian)</a>.</p>\n<p><strong>Notice:</strong> <code class=\"codespan\">convertToPixel</code> should not be called before the first time that <code class=\"codespan\">setOption</code> called. Namely, it can only be used after coordinate systems (grid/polar/...) initialized.</p>\n<p>Now points have been made draggable. Then we will bind event listeners on dragging to those points.</p>\n<pre><code class=\"lang-js\">// This function will be called repeatly while dragging.\n// The mission of this function is to update `series.data` based on\n// the new points updated by dragging, and to re-render the line\n// series based on the new data, by which the graphic elements of the\n// line series can be synchronized with dragging.\nfunction onPointDragging(dataIndex) {\n    // Here the `data` is declared in the code block in the beginning\n    // of this article. The `this` refers to the dragged circle.\n    // `this.position` is the current position of the circle.\n    data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n    // Re-render the chart based on the updated `data`.\n    myChart.setOption({\n        series: [{\n            id: &#39;a&#39;,\n            data: data\n        }]\n    });\n}\n</code></pre>\n<p>In the code above, API <a href=\"api.html#echartsInstance.convertFromPixel\" target=\"_blank\">convertFromPixel</a> is used, which is the reversed process of <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a>. <code class=\"codespan\">myChart.convertFromPixel(&#39;grid&#39;, this.position)</code> converts a pixel coordinate to data item in <a href=\"option.html#grid\" target=\"_blank\">grid (cartesian)</a>.</p>\n<p>Finally, add those code to make graphic elements responsive to change of canvas size.</p>\n<pre><code class=\"lang-js\">window.addEventListener(&#39;resize&#39;, function () {\n    // Re-calculate the position of each circle and update chart using `setOption`.\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                position: myChart.convertToPixel(&#39;grid&#39;, item)\n            };\n        })\n    });\n});\n\n</code></pre>\n<h2 id=\"-part-2-add-tooltip-component\">[ Part 2 ] Add tooltip component</h2>\n<p>Now basic functionality have been implemented by parte 1. If we need the data can be displayed realtime when dragging, we can use <a href=\"option.html#tooltip\" target=\"_blank\">tooltip component</a> to do that. Nevertheless, tooltip component has its default &quot;show/hide rule&quot;, which is not applicable in this case. So we need to customize the &quot;show/hide rule&quot; for our case.</p>\n<p>Add these snippets to the code block above:</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    ...,\n    tooltip: {\n        // Means disable default &quot;show/hide rule&quot;.\n        triggerOn: &#39;none&#39;,\n        formatter: function (params) {\n            return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n        }\n    }\n});\n</code></pre>\n<pre><code class=\"lang-js\">myChart.setOption({\n    graphic: echarts.util.map(data, function (item, dataIndex) {\n        return {\n            type: &#39;circle&#39;,\n            ...,\n            // Customize &quot;show/hide rule&quot;, show when mouse over, hide when mouse out.\n            onmousemove: echarts.util.curry(showTooltip, dataIndex),\n            onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n        };\n    })\n});\n\nfunction showTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;showTip&#39;,\n        seriesIndex: 0,\n        dataIndex: dataIndex\n    });\n}\n\nfunction hideTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;hideTip&#39;\n    });\n}\n</code></pre>\n<p>The API <a href=\"api.html#echartsInstance.dispatchAction\" target=\"_blank\">dispatchAction</a> is used to show/hide tooltip content, where actions <a href=\"api.html#action.tooltip.showTip\" target=\"_blank\">showTip</a> and <a href=\"api.html#action.tooltip.hideTip\" target=\"_blank\">hideTip</a> is dispatched.</p>\n<h2 id=\"-part-3-full-code\">[ Part 3 ] Full code</h2>\n<p>Full code is shown as follow:</p>\n<pre><code>&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;script src=&quot;dist/echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n\n    var symbolSize = 20;\n    var data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\n    var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n    myChart.setOption({\n        tooltip: {\n            triggerOn: &#39;none&#39;,\n            formatter: function (params) {\n                return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n            }\n        },\n        xAxis: {\n            min: -100,\n            max: 80,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        yAxis: {\n            min: -30,\n            max: 60,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        series: [\n            {\n                id: &#39;a&#39;,\n                type: &#39;line&#39;,\n                smooth: true,\n                symbolSize: symbolSize,\n                data: data\n            }\n        ],\n    });\n\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                type: &#39;circle&#39;,\n                position: myChart.convertToPixel(&#39;grid&#39;, item),\n                shape: {\n                    r: symbolSize / 2\n                },\n                invisible: true,\n                draggable: true,\n                ondrag: echarts.util.curry(onPointDragging, dataIndex),\n                onmousemove: echarts.util.curry(showTooltip, dataIndex),\n                onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n                z: 100\n            };\n        })\n    });\n\n    window.addEventListener(&#39;resize&#39;, function () {\n        myChart.setOption({\n            graphic: echarts.util.map(data, function (item, dataIndex) {\n                return {\n                    position: myChart.convertToPixel(&#39;grid&#39;, item)\n                };\n            })\n        });\n    });\n\n    function showTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;showTip&#39;,\n            seriesIndex: 0,\n            dataIndex: dataIndex\n        });\n    }\n\n    function hideTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;hideTip&#39;\n        });\n    }\n\n    function onPointDragging(dataIndex, dx, dy) {\n        data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n        myChart.setOption({\n            series: [{\n                id: &#39;a&#39;,\n                data: data\n            }]\n        });\n    }\n\n&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre><p><br></p>\n<p>With knowledge introduced above, more feature can be implemented. For example, <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom component</a> can be added to cooperate with the cartesian, or we can make a plotting board on coordinate systems. Use your imagination ~</p>\n"},"Custom Series":{"type":["*"],"description":"<p><a href=\"option.html#series-custom\" target=\"_blank\">custom series</a> is a type of series, which enable develpers to customize graphic elements rendering and generate new types of chart.</p>\n<p>Why does Apache ECharts (incubating)<sup>TM</sup> supports <code class=\"codespan\">custom series</code>?</p>\n<p>There are endless chart types in the world of data visualization, which are not enumerable. Thus only most common used chart types are built-in supported in echarts. For other chart types, it is necessary to provide an approach to make new types of chart for developers. This approach should be as simple as possible, which had better not to bothered developers with some details of implementation, such as creating and deleting graphic elements, transition animation, tooltip supporting, working with <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> or <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>. Having considered the factors above, a solution <a href=\"option.html#series-custom\" target=\"_blank\">custom series</a> is published.</p>\n<p><strong>For example, a &quot;x-range&quot; chart is made by custom sereis:</strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=custom-profile&reset=1&edit=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n<p><strong><a href=\"https://echarts.apache.org/examples/en/index.html#chart-type-custom\" target=\"_blank\">More samples of custom series</a></strong></p>\n<p>Let&#39;s begin the tutorial.</p>\n<h2 id=\"-i-the-method-renderitem\">(I) The method <code class=\"codespan\">renderItem</code></h2>\n<p>The snippet of graphic elements rendering should be written in <code class=\"codespan\">renderItem</code> method my developers. For example:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // ...\n        },\n        data: data\n    }]\n}\n</code></pre>\n<p>In the rendering phase of echarts workflow, <a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> is called respectively for each <code class=\"codespan\">dataItem</code> in <a href=\"option.html#series-custom.data\" target=\"_blank\">series.data</a>. <code class=\"codespan\">renderItem</code> is responsible for build a group of definitions of graphic elements, including graphic type, size, location, style, etc. echarts will then build graphic elements according to those definitions. For example:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // This method will be called for each dataItem repectively.\n            // Notice: it does not ensure that called according to the order\n            // of `dataItem`.\n\n            // Some processes, such as coordinate conversion.\n            // `api.value(0)` is used to retrieve the value on the first\n            // dimension in the current `dataItem`.\n            var categoryIndex = api.value(0);\n            // `api.coord(...)` is used to convert data values to pixel values,\n            // will are necessary for graphic elements rendering.\n            var startPoint = api.coord([api.value(1), categoryIndex]);\n            var endPoint = api.coord([api.value(2), categoryIndex]);\n            // `api.size(...)` is used to calculate the pixel size corresponding to\n            // the a value range that the length is 1 on Y axis.\n            var height = api.size([0, 1])[1] * 0.6;\n\n            // The property `shape` incicates the location and size of thsi\n            // element.\n            // `echarts.graphic.clipRectByRect` is used for clipping the\n            // rectangular when it overflow the bounding box of the current\n            // coordinate system (cartesian).\n            // If the rect is totally clipped, returns undefined.\n            var rectShape = echarts.graphic.clipRectByRect({\n                // position and location of the rectangular.\n                x: startPoint[0],\n                y: startPoint[1] - height / 2,\n                width: endPoint[0] - startPoint[0],\n                height: height\n            }, {\n                // Bounding box of the current cooridinate system (cartesian).\n                x: params.coordSys.x,\n                y: params.coordSys.y,\n                width: params.coordSys.width,\n                height: params.coordSys.height\n            })\n\n            // Returns definitions for the current `dataItem`.\n            return rectShape &amp;&amp; {\n                // &#39;rect&#39; indicates that the graphic element is rectangular.\n                // Can also be &#39;circle&#39;, &#39;sector&#39;, &#39;polygon&#39;, ...\n                type: &#39;rect&#39;,\n                shape: rectShape,\n                // `api.style(...)` is used to obtain style settings, which\n                // includes itemStyle settings in optino and the result of\n                // visual mapping.\n                style: api.style()\n            };\n        },\n        data: [\n            [12, 44, 55, 60], // The first dataItem.\n            [53, 31, 21, 56], // The second dataItem.\n            [71, 33, 10, 20], // The third dataItem.\n            ...\n        ]\n    }]\n}\n</code></pre>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> provides two parameters:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">params</a>:provides info about the current series (such as <code class=\"codespan\">seriesIndex</code>、<code class=\"codespan\">dataIndex</code>, etc.) and data (such as <code class=\"codespan\">dataIndex</code>, <code class=\"codespan\">dataIndexInside</code>, etc.) and coordinate system (such as location and size of bounding box of the current coordinate system)</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">api</a> provides some methods to developers (such as <code class=\"codespan\">api.value()</code>, <code class=\"codespan\">api.coord()</code>).</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> method should return definitions of graphic elements for the current <code class=\"codespan\">dataItem</code>. See <a href=\"option.html#series-custom.renderItem.return\" target=\"_blank\">renderItem.return</a>.</p>\n<p>Generally, the main process of <a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> is that retrieve value from data and convert them to graphic elements on the current coordinate system. Two methods in <a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> are always used in this procedure:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.value\" target=\"_blank\">api.value(...)</a> is used to retrieve value from data. For example, <code class=\"codespan\">api.value(0)</code> retrieve the value of the first dimension in the current data item.</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.coord\" target=\"_blank\">api.coord(...)</a> is used to convert data to coordinate. For example, <code class=\"codespan\">var point = api.coord([api.value(0), api.value(1)])</code> converet the data to the point on the current coordinate system.</li>\n</ul>\n<p>Sometimes <a href=\"option.html#series-custom.renderItem.arguments.api.size\" target=\"_blank\">api.size(...)</a> method is needed, which calculates the size on the coordinate system by a given data range.</p>\n<p>Moreover, <a href=\"option.html#series-custom.renderItem.arguments.api.style\" target=\"_blank\">api.style(...)</a> method can be used to set style. It provides not only the style settings specified in <a href=\"option.html#series-custom.itemStyle\" target=\"_blank\">series.itemStyle</a>, but also the result of visual mapping. This method can also be called like <code class=\"codespan\">api.style({fill: &#39;green&#39;, stroke: &#39;yellow&#39;})</code> to override those style settings.</p>\n<p>Having <code class=\"codespan\">renderItem</code> provided, 90% of the work of creating custom series has been accomplished. The rest of this work is to refine and polish them.</p>\n<h2 id=\"-ii-make-the-extent-of-axes-fit-the-data\">(II) Make the extent of axes fit the data</h2>\n<p>There is axes in some coordinate systems, such as <a href=\"option.html#grid\" target=\"_blank\">cartesian2d (grid)</a>and <a href=\"option.html#polar\" target=\"_blank\">polar</a>. The extent of an axis should fit the data automatically, otherwise the graphic elements would be overflow the bounding box of the coordinate system. So, for example, in <a href=\"option.html#grid\" target=\"_blank\">cartesian2d (grid)</a>, developers should specify that which dimensions correspond to <code class=\"codespan\">x</code> axis and which to <code class=\"codespan\">y</code> axis use the property <a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a>:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            // `dim1` and `dim2` correspond to `x` axis.\n            x: [1, 2],\n            // `dim0` corresponds to `y` axis.\n            y: 0\n        },\n        data: [\n            // dim0  dim1  dim2  dim3\n            [   12,   44,   55,   60   ], // The first dataItem.\n            [   53,   31,   21,   56   ], // The second dataItem.\n            [   71,   33,   10,   20   ], // The third dataItem.\n            ...\n        ]\n    }]\n};\n</code></pre>\n<h2 id=\"-iii-set-tooltip-content\">(III) Set tooltip content</h2>\n<p>Of course <a href=\"option.html#tooltip.formatter\" target=\"_blank\">tooltip.formatter</a> can be used to define the content in tooltip. But it is easier to do that by setting <a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a> and <a href=\"option.html#series-custom.dimensions\" target=\"_blank\">dimensions</a>:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            x: [1, 2],\n            y: 0,\n            // `dim2` and `dim3` will displayed in tooltip.\n            tooltip: [2, 3]\n        },\n        // `dim2` is named as &quot;Age&quot; and `dim3` is named as &quot;Satisfaction&quot;.\n        dimensions: [null, null, &#39;Age&#39;, &#39;Satisfaction&#39;],\n        data: [\n            // dim0  dim1  dim2  dim3\n            [   12,   44,   55,   60   ],\n            [   53,   31,   21,   56   ],\n            [   71,   33,   10,   20   ],\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p><br>\n<br>\n<br></p>\n<hr>\n<p>Several other issues about <code class=\"codespan\">custom series</code> are introduced below.</p>\n<h2 id=\"-iv-shape-clipping-when-overflow-the-coordinates-area\">(IV) Shape clipping when overflow the coordinates area</h2>\n<p>When use <code class=\"codespan\">custom series</code> with <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>, <a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a> usually be set as <code class=\"codespan\">&#39;weakFilter&#39;</code>, which prevent <code class=\"codespan\">dataItem</code> from being filtered when only part of its dimensions are out of the current data window. For example:</p>\n<pre><code class=\"lang-js\">option = {\n    dataZoom: {\n        xAxisIndex: 0,\n        filterMode: &#39;weakFilter&#39;\n    },\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            x: [1, 2],\n            y: 0\n        },\n        data: [\n            // dim0  dim1  dim2  dim3\n            [   12,   44,   55,   60   ], // The first dataItem.\n            [   53,   31,   21,   56   ], // The second dataItem.\n            [   71,   33,   10,   20   ], // The third dataItem.\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p>In the example above, <code class=\"codespan\">dim</code> and <code class=\"codespan\">dim2</code> corresponds to <code class=\"codespan\">x</code> axis, and the <code class=\"codespan\">dataZoom</code> component constrols the data window of <code class=\"codespan\">x</code> axis. If part of a <code class=\"codespan\">dataItem</code> is overflow the extent of <code class=\"codespan\">x</code> axis (the value on <code class=\"codespan\">dim1</code> is overflow and the value on <code class=\"codespan\">dim2</code> is not) while zooming, the <code class=\"codespan\">dataItem</code> will not be filtered if <code class=\"codespan\">dataZoom.filterMode = &#39;weakFilter&#39;</code> set. Thus the <code class=\"codespan\">dataItem</code> can be still rendered (usually be partially rendered by using <code class=\"codespan\">echarts.graphic.clipRectByRect</code> to clip the exceeding part).\nSee the example mentioned above <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-profile\" target=\"_blank\">Profile</a>.</p>\n<h2 id=\"-v-about-dataindex\">(V) About dataIndex</h2>\n<p>Developers had better notice that in <a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">renderItem.arguments.params</a> <code class=\"codespan\">dataIndexInside</code> and <code class=\"codespan\">dataIndex</code> is different:</p>\n<ul>\n<li><code class=\"codespan\">dataIndex</code> is the index of a <code class=\"codespan\">dataItem</code> in the original data.</li>\n<li><code class=\"codespan\">dataIndexInside</code> is the index of a <code class=\"codespan\">dataItem</code> in the current data window (see <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>.</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> uses <code class=\"codespan\">dataIndexInside</code> as the input parameter but not <code class=\"codespan\">dataIndex</code>, because conversion from <code class=\"codespan\">dataIndex</code> to <code class=\"codespan\">dataIndexInside</code> is time-consuming.</p>\n<h2 id=\"-vi-event-listener\">(VI) Event listener</h2>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            // ...\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;\n                    // ...\n                }, {\n                    type: &#39;circle&#39;,\n                    name: &#39;aaa&#39;,\n                    // User specified info, available\n                    // in event handler.\n                    info: 12345,\n                    // ...\n                }]\n            };\n        }\n    }\n});\nchart.on(&#39;click&#39;, {element: &#39;aaa&#39;}, function (params) {\n    // When the element with name &#39;aaa&#39; clicked,\n    // this method called.\n    console.log(params.info);\n});\n</code></pre>\n<h2 id=\"-vii-custom-vector-shapes\">(VII) Custom vector shapes</h2>\n<p><a href=\"http://www.w3.org/TR/SVG/paths.html#PathData\" target=\"_blank\">SVG PathData</a> is supported, which enables to use shapes that are created in vector tool. See <a href=\"option.html#series-custom.renderItem.return_path\" target=\"_blank\">path</a>, and examples: <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-calendar-icon\" target=\"_blank\">icons</a>, <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-gantt-flight\" target=\"_blank\">shapes</a>.</p>\n<p><br></p>\n<p><strong><a href=\"https://echarts.apache.org/examples/en/index.html#chart-type-custom\" target=\"_blank\">More examples about custom series</a></strong></p>\n"},"Rich Text":{"type":["*"],"description":"<p>Rich text can be used in Apache ECharts (incubating)<sup>TM</sup> labels of series, axis or other components. For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=treemap-obama&edit=1&reset=1\" width=\"800\" height=\"550\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<p>More examples:\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=map-labels&amp;edit=1&amp;reset=1\" target=\"_blank\">Map Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=pie-nest&amp;edit=1&amp;reset=1\" target=\"_blank\">Pie Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=gauge-car&amp;edit=1&amp;reset=1\" target=\"_blank\">Gauge</a>.</p>\n<p><br></p>\n<p>Before v3.7, the style options was only able to applied to the whole label text block, and only color and font can be configured, which restricted the expressability of text descriptions.</p>\n<p>Since v3.7, rich text has been supported:</p>\n<ul>\n<li>Box styles (background, border, shadow, etc.), rotation, position of a text block can be specified.</li>\n<li>Styles (color, font, width/height, background, shadow, etc.) and alignment can be customzied on fragments of text.</li>\n<li>Image can be used in text as icon or background.</li>\n<li>Combine these configurations, some special effects can be made, such as simple table, horizontal rule (hr).</li>\n</ul>\n<p>At the beginning, the meanings of two terms that will be used below should be clarified:</p>\n<ul>\n<li>Text Block: The whole block of label text.</li>\n<li>Text fragment: Some piece of text in a text block.</li>\n</ul>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-block-fragment&edit=1&reset=1\" width=\"340\" height=\"240\" ></iframe>\n\n\n\n<h2 id=\"options-about-text\">Options about Text</h2>\n<p>echarts provides plenty of text options, including:</p>\n<ul>\n<li>Basic font style: <code class=\"codespan\">fontStyle</code>, <code class=\"codespan\">fontWeight</code>, <code class=\"codespan\">fontSize</code>, <code class=\"codespan\">fontFamily</code>.</li>\n<li>Fill of text: <code class=\"codespan\">color</code>.</li>\n<li>Stroke of text: <code class=\"codespan\">textBorderColor</code>, <code class=\"codespan\">textBorderWidth</code>.</li>\n<li>Shadow of text: <code class=\"codespan\">textShadowColor</code>, <code class=\"codespan\">textShadowBlur</code>, <code class=\"codespan\">textShadowOffsetX</code>, <code class=\"codespan\">textShadowOffsetY</code>.</li>\n<li>Box size of text block or text fragment: <code class=\"codespan\">lineHeight</code>, <code class=\"codespan\">width</code>, <code class=\"codespan\">height</code>, <code class=\"codespan\">padding</code>.</li>\n<li>Alignment of text block or text fragment: <code class=\"codespan\">align</code>, <code class=\"codespan\">verticalAlign</code>.</li>\n<li>Border, background (color or image) of text block or text fragment: <code class=\"codespan\">backgroundColor</code>, <code class=\"codespan\">borderColor</code>, <code class=\"codespan\">borderWidth</code>, <code class=\"codespan\">borderRadius</code>.</li>\n<li>Shadow of text block or text fragment: <code class=\"codespan\">shadowColor</code>, <code class=\"codespan\">shadowBlur</code>, <code class=\"codespan\">shadowOffsetX</code>, <code class=\"codespan\">shadowOffsetY</code>.</li>\n<li>Position and rotation of text block: <code class=\"codespan\">position</code>, <code class=\"codespan\">distance</code>, <code class=\"codespan\">rotate</code>.</li>\n</ul>\n<p>User can defined styles for text fragment in <code class=\"codespan\">rich</code> property. For example, <a href=\"option.html#series-bar.label.rich\" target=\"_blank\">series-bar.label.rich</a></p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fragments\n    // of text by adding some markers to those fragment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this fragment}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this fragment}This fragment use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    // Styles for the whole text block are defined here:\n    color: &#39;#333&#39;,\n    fontSize: 5,\n    fontFamily: &#39;Arial&#39;,\n    borderWidth: 3,\n    backgroundColor: &#39;#984455&#39;,\n    padding: [3, 10, 10, 5],\n    lineHeight: 20,\n\n    // Styles for text fragments are defined here:\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<blockquote>\n<p>Notice: <code class=\"codespan\">width</code> 和 <code class=\"codespan\">height</code> only work when <code class=\"codespan\">rich</code> specified.</p>\n</blockquote>\n<h2 id=\"basic-styles-of-text-text-block-and-text-fragment\">Basic Styles of Text, Text Block and Text Fragment</h2>\n<p>Basic font style can be set to text: <code class=\"codespan\">fontStyle</code>, <code class=\"codespan\">fontWeight</code>, <code class=\"codespan\">fontSize</code>, <code class=\"codespan\">fontFamily</code>.</p>\n<p>Fill color and stroke color can be set to text: <code class=\"codespan\">color</code>, <code class=\"codespan\">textBorderColor</code>, <code class=\"codespan\">textBorderWidth</code>.</p>\n<p>Border style and background style can be set to text block: <code class=\"codespan\">borderColor</code>, <code class=\"codespan\">borderWidth</code>, <code class=\"codespan\">backgroundColor</code>, <code class=\"codespan\">padding</code>.</p>\n<p>Border style and background style can be set to text fragment too: <code class=\"codespan\">borderColor</code>, <code class=\"codespan\">borderWidth</code>, <code class=\"codespan\">backgroundColor</code>, <code class=\"codespan\">padding</code>.</p>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-options&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n\n<h2 id=\"label-position\">Label Position</h2>\n<p><code class=\"codespan\">label</code> option can be use in charts like <code class=\"codespan\">bar</code>, <code class=\"codespan\">line</code>, <code class=\"codespan\">scatter</code>, etc. The position of a label, can be specified by <a href=\"option.html#series-scatter.label.position\" target=\"_blank\">label.position</a>、<a href=\"option.html#series-scatter.label.distance\" target=\"_blank\">label.distance</a>.</p>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/label-position&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<blockquote>\n<p>Notice, there are different optional values of <code class=\"codespan\">position</code> by different chart types. And <code class=\"codespan\">distance</code> is not supported in every chart. More detailed info can be checked in <a href=\"option.html\" target=\"_blank\">option doc</a>.</p>\n</blockquote>\n<h2 id=\"label-rotation\">Label Rotation</h2>\n<p>Sometimes label is needed to be rotated. For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-label-rotation&edit=1&reset=1\" width=\"900\" height=\"500\" ></iframe>\n\n\n<p><a href=\"option.html#series-bar.label.align\" target=\"_blank\">align</a> and<a href=\"option.html#series-bar.label.verticalAlign\" target=\"_blank\">verticalAlign</a> can be used to adjust location of label in this scenario.</p>\n<p>Notice, <code class=\"codespan\">align</code> and <code class=\"codespan\">verticalAlign</code> are applied firstly, then rotate.</p>\n<h2 id=\"layout-and-alignment-of-text-fragment\">Layout and Alignment of Text fragment</h2>\n<p>To understand the layout rule, every text fragment can be imagined as a <code class=\"codespan\">inline-block</code> dom element in CSS.</p>\n<p><code class=\"codespan\">content box size</code> of a text fragment is determined by its font size by default. It can also be specified directly by <code class=\"codespan\">width</code> and <code class=\"codespan\">height</code>, although they are rarely set. <code class=\"codespan\">border box size</code> of a text fragment is calculated by adding the <code class=\"codespan\">border box size</code> and <code class=\"codespan\">padding</code>.</p>\n<p>Only <code class=\"codespan\">&#39;\\n&#39;</code> is the newline character, which breaks a line.</p>\n<p>Multiple text fragment exist in a single line. The height of a line is determined by the biggest <code class=\"codespan\">lineHeight</code> of text fragments. <code class=\"codespan\">lineHeight</code> of a text fragment can be specified in <code class=\"codespan\">rich</code>, or in the parent level of <code class=\"codespan\">rich</code>, otherwise using <code class=\"codespan\">box size</code> of the text fragment.</p>\n<p>Having <code class=\"codespan\">lineHeight</code> determined, the vertical position of text fragments can be determined by <code class=\"codespan\">verticalAlign</code> (there is a little different from the rule in CSS):</p>\n<ul>\n<li><code class=\"codespan\">&#39;bottom&#39;</code>: The bottom edge of the text fragment sticks to the bottom edge of the line.</li>\n<li><code class=\"codespan\">&#39;top&#39;</code>: The top edge of the text fragment sticks to the top edge of the line.</li>\n<li><code class=\"codespan\">&#39;middle&#39;</code>: In the middle of the line.</li>\n</ul>\n<p>The width of a text block can be specified by <code class=\"codespan\">width</code>, otherwise, by the longest line. Having the width determined, text fragment can be placed in each line, where the horizontal position of text fragments can be determined by its <code class=\"codespan\">align</code>.</p>\n<ul>\n<li>Firstly, place text fragments whose <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;left&#39;</code> from left to right continuously.</li>\n<li>Secondly, place text fragments whose <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;right&#39;</code> from right to left continuously.</li>\n<li>Finally, the text fragments remained will be sticked and placed in the center of the rest of space.</li>\n</ul>\n<p>The position of text in a text fragment:</p>\n<ul>\n<li>If <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;center&#39;</code>, text aligns at the center of the text fragment box.</li>\n<li>If <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;left&#39;</code>, text aligns at the left of the text fragment box.</li>\n<li>If <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;right&#39;</code>, text aligns at the right of the text fragment box.</li>\n</ul>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-fragment-align&edit=1&reset=1\" width=\"800\" height=\"220\" ></iframe>\n\n\n\n\n<h2 id=\"effects-icon-horizontal-rule-title-block-simple-table\">Effects: Icon, Horizontal Rule, Title Block, Simple Table</h2>\n<p>See example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/title-block&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>Icon is implemented by using image in <code class=\"codespan\">backgroundColor</code>.</p>\n<pre><code class=\"lang-js\">rich: {\n    Sunny: {\n        backgroundColor: {\n            image: &#39;./data/asset/img/weather/sunny_128.png&#39;\n        },\n        // Can only height specified, but leave width auto obtained\n        // from the image, where the aspect ratio kept.\n        height: 30\n    }\n}\n</code></pre>\n<p>Horizontal rule (like HTML &lt;hr&gt; tag) can be implemented by border:</p>\n<pre><code class=\"lang-js\">rich: {\n    hr: {\n        borderColor: &#39;#777&#39;,\n        // width is set as &#39;100%&#39; to fullfill the text block.\n        // Notice, the percentage is based on the content box, without\n        // padding. Although it is a little different from CSS rule,\n        // it is convinent in most cases.\n        width: &#39;100%&#39;,\n        borderWidth: 0.5,\n        height: 0\n    }\n}\n</code></pre>\n<p>Title block can be implemented by <code class=\"codespan\">backgroundColor</code>:</p>\n<pre><code class=\"lang-js\">// Title is at left.\nformatter: &#39;{titleBg|Left Title}&#39;,\nrich: {\n    titleBg: {\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n\n// Title is in the center of the line.\n// This implementation is a little tricky, but is works\n// without more complicated layout mechanism involved.\nformatter: &#39;{tc|Center Title}{titleBg|}&#39;,\nrich: {\n    titleBg: {\n        align: &#39;right&#39;,\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n</code></pre>\n<p>Simple table can be implemented by specify the same width to text fragments that are in the same column of different lines. See the <a href=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a> at the mentioned above.</p>\n"},"Server-side Rendering":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> can be rendered at server-side. For example, the thumbnails in the <a href=\"https://echarts.apache.org/examples/en/index.html/\" target=\"_blank\">official examples page</a> are generated at a server.</p>\n<p>Commonly used headless tool is required, for example, <a href=\"https://github.com/GoogleChrome/puppeteer\" target=\"_blank\">puppeteer</a>, <a href=\"https://chromium.googlesource.com/chromium/src/+/lkgr/headless/README.md\" target=\"_blank\">headless chrome</a>, <a href=\"https://github.com/Automattic/node-canvas\" target=\"_blank\">node-canvas</a>, <a href=\"https://github.com/jsdom/jsdom\" target=\"_blank\">jsdom</a>, <a href=\"http://phantomjs.org/\" target=\"_blank\">PhantomJS</a>, etc.</p>\n<p>Some solutions contributed by the community are list as follows:</p>\n<ul>\n<li><a href=\"https://github.com/hellosean1025/node-echarts\" target=\"_blank\">https://github.com/hellosean1025/node-echarts</a></li>\n<li><a href=\"https://github.com/chfw/echarts-scrappeteer\" target=\"_blank\">https://github.com/chfw/echarts-scrappeteer</a></li>\n<li><a href=\"https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js\" target=\"_blank\">https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js</a></li>\n<li><a href=\"https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73\" target=\"_blank\">https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73</a></li>\n</ul>\n"},"Render by Canvas or SVG":{"type":["*"],"description":"<p>Most of browser-side charting libraries use SVG or Canvas as their underlying renderer. In the scope of Apache ECharts (incubating)<sup>TM</sup>, they are usually alternative, without critical differences. But in some environment and scenarios, they show notable differences in performance or functionality.</p>\n<p>ECharts has been using Canvas as its renderer (use VML for IE8-) from the begining. Now, from <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">ECharts v3.8</a> we provide a SVG renderer (beta version) as another option. Either of them can be used by specifing parameter <a href=\"api.html#echarts.init\" target=\"_blank\">renderer</a> as <code class=\"codespan\">&#39;canvas&#39;</code> or <code class=\"codespan\">&#39;svg&#39;</code> when initailizing a chart instance.</p>\n<blockquote>\n<p>That both SVG and Canvas, who are very different in use, are able to be supported in ECharts owns to the abstruction in its underlying render library <a href=\"https://github.com/ecomfe/zrender\" target=\"_blank\">zender</a>, where they are implemented as a Canvas renderer and a alternative SVG renderer.</p>\n</blockquote>\n<h2 id=\"how-to-make-a-choice-\">How to make a choice?</h2>\n<p>Generally speaking, Canvas is suitable for the case that there is a large amount of grpahic elements (which basically due to a large amount of data), like heatmap and lines or scatter plot with large data in geo or parallel coordinates. Besides it supports some <a href=\"https://echarts.apache.org/examples/en/editor.html?c=lines-bmap-effect\" target=\"_blank\">special visual effect</a>. But in some other scenarios SVG has some critical advantages: it consumes less memory then Canvas (especially in mobile device), and gives better performance in rendering. Moreover, it never blurs when zooming the viewport of browser whereas Canvas may blurs. For example, we have tried to render line, bar, pie charts with the Canvas renderer and the SVG renderer, and recorded the frame rate during the the stage that the initial animation performed:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/canvas-vs-svg-en&reset=1\" width=\"90%\" height=\"400\" ></iframe>\n\n\n<p>In the scenarios above, the SVG renderer has provided a better FPS performance in mobile devices. In some other scenarios, where big data amount or certain kinds of human interactions exists, the SVG renderer is still not as good as the Canvas renderer in performance, but two options provides the ability to optimize the performance according to the requirements of each developer.</p>\n<p>How to make a choice? These factors, hardware and software environment, data amount and functional requirements, should be considered.</p>\n<ul>\n<li>If the environment is not harsh and the data amount is not large, both of them can be used, no need to pay attention too much.</li>\n<li>If some harsh environment caused performance problem, we can attempt to get better result by choose appropriate renderer.<ul>\n<li>If lots of echarts instances have to be created and it cause browser crash (it probably caused by that the large memory consumption of those Canvas instances is beyond the limit of some mobile devices) we can try the SVG renderer. Or, generally, if charts runs in some old Android devices, or if we are using some kind of charts like <a href=\"https://ecomfe.github.io/echarts-liquidfill/example/\" target=\"_blank\">liquidfill</a>, the SVG renderer probably gives a better performance.</li>\n<li>If visualizing a large amount of data, or complicated human interactions with data is required, the Canvas renderer works better currently.</li>\n</ul>\n</li>\n</ul>\n<p>Therefore <a href=\"https://github.com/apache/incubator-echarts/issues/new\" target=\"_blank\">feedback</a> of experiences and usage scenarios are strongly welcomed, which will make the these renderers better and better.</p>\n<p>Notice: The features of rich text, shadow and texture have not been supported yet in the current beta version of the SVG renderer.</p>\n<h2 id=\"how-to-use-specify-a-renderer-\">How to use specify a renderer?</h2>\n<p>ECharts uses Canvas by default. If user intends to use the SVG renderer, the module of the SVG renderer should be included in ECharts bundle.</p>\n<ul>\n<li>In the <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">pre-build</a> of ECharts, the SVG renderer has been included in <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.common.min.js\" target=\"_blank\">common version</a> and <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js\" target=\"_blank\">complete version</a>. But not in <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.simple.min.js\" target=\"_blank\">simple version</a>.</li>\n<li>If <a href=\"https://echarts.apache.org/en/builder.html\" target=\"_blank\">build ECharts online</a>, the checkbox &quot;SVG Renderer&quot; should be checked.</li>\n<li>If <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">build ECharts offline</a>, the module of the SVG renderer should be imported:</li>\n</ul>\n<pre><code class=\"lang-js\">import &#39;zrender/lib/svg/svg&#39;;\n</code></pre>\n<p>Then wen can specify renderer by <a href=\"api.html#echarts.init\" target=\"_blank\">parameter</a>:</p>\n<pre><code class=\"lang-js\">// Use the Canvas renderer (default).\nvar chart = echarts.init(containerDom, null, {renderer: &#39;canvas&#39;});\n// which is equal to:\nvar chart = echarts.init(containerDom, null, {renderer: &#39;canvas&#39;});\n\n// Use the SVG renderer.\nvar chart = echarts.init(containerDom, null, {renderer: &#39;svg&#39;});\n</code></pre>\n"},"Supporting ARIA in Charts":{"type":["*"],"description":"<p>W3C defined the Accessible Rich Internet Applications Suite (<a href=\"https://www.w3.org/WAI/intro/aria\" target=\"_blank\">WAI-ARIA</a>) to make Web content and Web applications more accessible to the disabled. From Apache ECharts (incubating)<sup>TM</sup> 4.0, we support ARIA by generating description for charts automatically.</p>\n<p>By default, ARIA is disabled. To enable it, you should set <a href=\"#aria.show\">aria.show</a> to be <code class=\"codespan\">true</code>. After enabling, it will generate descriptions based on charts, series, data, and so on. Users may change the generated description.</p>\n<p><strong>For example:</strong></p>\n<p>For config:</p>\n<pre><code class=\"lang-js\">option = {\n    aria: {\n        show: true\n    },\n    title: {\n        text: &#39;Source of user access to a site&#39;,\n        x: &#39;center&#39;\n    },\n    series: [\n        {\n             Name: &#39;access source&#39;,\n            type: &#39;pie&#39;,\n            data: [\n                { value: 335, name: &#39;direct access&#39; },\n                { value: 310, name: &#39;mail marketing&#39; },\n                { value: 234, name: &#39;union ad&#39; },\n                { value: 135, name: &#39;video ad&#39; },\n                { value: 1548, name: &#39;search engine&#39; }\n            ]\n        }\n    ]\n};\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/aria-pie&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n<p>There should be an <code class=\"codespan\">aria-label</code> attribute on the chart DOM, which can help the disabled understand the content of charts with the help of certain devices. The value of the label is:</p>\n<pre><code>This is a chart of &quot;Source of user access to a site.&quot; The chart type is a pie chart that indicates the source of the visit. The data is - direct access data is 335, mail marketing data is 310, union ad data is 234, video ad data is 135, search engine data is 1548.\n</code></pre><p>The default language is in Chinese, but you can configure it with templates.</p>\n<p>Please refer to <a href=\"option.html#aria\" target=\"_blank\">ARIA option</a> for more detail.</p>\n"}}}}
\ No newline at end of file
+{"$schema":"https://echarts.apache.org/doc/json-schem","option":{"type":"Object","properties":{"Get Started with ECharts in 5 minutes":{"type":["*"],"description":"<h2 id=\"installing-echarts\">Installing ECharts</h2>\n<p>First, install Apache ECharts (incubating)<sup>TM</sup> using one of the following methods:</p>\n<ul>\n<li><p>Download official source release from <a href=\"https://echarts.apache.org/en/download.html\" target=\"_blank\">Apache ECharts (incubating) website</a>. Then <a href=\"https://github.com/apache/incubator-echarts#build\" target=\"_blank\">build</a> from the source release.</p>\n</li>\n<li><p>Download from <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a></p>\n</li>\n<li><p>Using npm: <code class=\"codespan\">npm install echarts --save</code>. <a href=\"tutorial.html#Use%20ECharts%20with%20webpack\" target=\"_blank\">Using ECharts with webpack</a></p>\n</li>\n<li><p>Use CDN like <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">jsDelivr</a>.</p>\n</li>\n</ul>\n<h2 id=\"including-echarts\">Including ECharts</h2>\n<p>Load <code class=\"codespan\">echarts.min.js</code> with a script tag.</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;!-- including ECharts file --&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;/html&gt;\n</code></pre>\n<h2 id=\"draw-a-simple-chart\">Draw a simple chart</h2>\n<p>Before drawing charts, we need to prepare a DOM container with width and height for ECharts.</p>\n<pre><code>&lt;body&gt;\n    &lt;!-- preparing a DOM with width and height for ECharts --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width:600px; height:400px;&quot;&gt;&lt;/div&gt;\n&lt;/body&gt;\n</code></pre><p>Then we can initialize an ECharts instance using <a href=\"api.html#echarts.init\" target=\"_blank\">echarts.init</a>, and create a simple bar chart with <a href=\"api.html#echartsInstance.setOption\" target=\"_blank\">setOption</a>. Below is the complete code.</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;ECharts&lt;/title&gt;\n    &lt;!-- including ECharts file --&gt;\n    &lt;script src=&quot;echarts.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- prepare a DOM container with width and height --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n        // based on prepared DOM, initialize echarts instance\n        var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n        // specify chart configuration item and data\n        var option = {\n            title: {\n                text: &#39;ECharts entry example&#39;\n            },\n            tooltip: {},\n            legend: {\n                data:[&#39;Sales&#39;]\n            },\n            xAxis: {\n                data: [&quot;shirt&quot;,&quot;cardign&quot;,&quot;chiffon shirt&quot;,&quot;pants&quot;,&quot;heels&quot;,&quot;socks&quot;]\n            },\n            yAxis: {},\n            series: [{\n                name: &#39;Sales&#39;,\n                type: &#39;bar&#39;,\n                data: [5, 20, 36, 10, 10, 20]\n            }]\n        };\n\n        // use configuration item and data specified to show chart\n        myChart.setOption(option);\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>You&#39;ve made your first chart!</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/getting-started&reset=1&edit=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p>For more examples, go to the <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=doc-example/getting-started\" target=\"_blank\">ECharts Gallery</a></p>\n"},"Create Custom Build of ECharts":{"type":["*"],"description":"<p>In most cases, Apache ECharts (incubating)<sup>TM</sup> builds can be get from  <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> or from the <code class=\"codespan\">echarts/dist</code> directory in our <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub project</a>, where\nthese pre-builds are provided:</p>\n<ul>\n<li>Complete verion: <code class=\"codespan\">echarts/dist/echarts.js</code>, including all charts and components (see <code class=\"codespan\">echarts/echarts.all.js</code> for detail), but has maximum file size.</li>\n<li>Common version: <code class=\"codespan\">echarts/dist/echarts.common.js</code>, including common charts and components (see <code class=\"codespan\">echarts/echarts.common.js</code> for detail), moderate file size.</li>\n<li>Simple version: <code class=\"codespan\">echarts/dist/echarts.simple.js</code>, including a smaller subset of the most common charts and components (see <code class=\"codespan\">echarts/echarts.simple.js</code> for detail), small file size.</li>\n</ul>\n<p>We can also build echarts ourselves, which enables to only include the charts and components you needed. You can customize your ECharts build by using one of these approaches:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/en/builder.html\" target=\"_blank\">Online custom build tool</a> is relatively convenient.</li>\n<li>The script <code class=\"codespan\">echarts/build/build.js</code> found in the project is flexible for module selecting, and supports multi-language builds</li>\n<li>Build ECharts and your project directly by using tools such as <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>, <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a></li>\n</ul>\n<p>There are some examples to illustrate the latter two approaches below.</p>\n<h2 id=\"prepare-create-our-project-and-install-echarts\">Prepare: create our project and install echarts</h2>\n<p>Create a sample project using the command line</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>Then in the <code class=\"codespan\">myProject</code> directory, initialize <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> environment and install echarts (assume that <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> has been installed):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>The installed echarts is in the <code class=\"codespan\">myProject/node_modules</code> directory, which can be used in our project directly. For example:</p>\n<p>Use ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>Use CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>Next, we just describe our examples in ES Module way.</p>\n<h2 id=\"create-custom-build-by-echarts-build-build-js\">Create custom build by <code class=\"codespan\">echarts/build/build.js</code></h2>\n<p>In this example, for minimizing file size, we will build a echarts bundle with only pie chart included, and create a web page to show it.</p>\n<p>echarts has provided a script <code class=\"codespan\">echarts/build/build.js</code> as a build tool (<a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> is required to execute it). Now we can use the command below in the <code class=\"codespan\">myProject</code> directory to check its help info:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>These options can be used in this example:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>: Entry file of the echarts code. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">-o</code>: The bundle file path. Can be an absolute path or a relative path relative to the current working directory.</li>\n<li><code class=\"codespan\">--min</code>: Whether to compress file (not by default), and remove the code that is for printing error and warning info.</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>: Whether to use the specified language (Chinese by default). For example: <code class=\"codespan\">--lang en</code> means using English, <code class=\"codespan\">--lang my/langXX.js</code> means using <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> to substitute <code class=\"codespan\">echarts/lib/lang.js</code> while buiding.</li>\n<li><code class=\"codespan\">--sourcemap</code>: Whether to output source map, which is useful in debug.</li>\n<li><code class=\"codespan\">--format</code>: The format of output. Can be <code class=\"codespan\">&#39;umb&#39;</code>(default), <code class=\"codespan\">&#39;amd&#39;</code>, <code class=\"codespan\">&#39;iife&#39;</code>, <code class=\"codespan\">&#39;cjs&#39;</code>, <code class=\"codespan\">&#39;es&#39;</code>.</li>\n</ul>\n<p>Now we want to create a echarts bundle that only supports pie chart, we should firstly create an entry file (say <code class=\"codespan\">myProject/echarts.custom.js</code>) to import modules we need:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts and export them.\nexport * from &#39;echarts/src/echarts&#39;;\n// Import pie chart.\nimport &#39;echarts/src/chart/pie&#39;;\n// In this case, modules in either `echarts/src` or `echarts/lib`\n// can be imported (but should not be mixed). See\n// &quot;Use `echarts/lib/**` or `echarts/src/**`&quot; below.\n</code></pre>\n<p>Then we can use command below in <code class=\"codespan\">myProject</code> directory to build the bundle:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>Now the bundle <code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> has been created. Then we can create a web page (say <code class=\"codespan\">myProject/pie.html</code>) to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- import the bundle `lib/echarts.custom.js`. --&gt;\n    &lt;script src=&quot;lib/echarts.custom.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // Create a pie chart:\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/pie.html</code> in a browser, we can see the pie chart:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"modules-that-are-permitted-to-be-imported\">Modules that are permitted to be imported</h2>\n<p>All of the permitted modules are declared in <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> and <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a>. Other modules in the source code of echarts and zrender <strong>SHOULD NOT BE IMPORTED</strong>, because they are inner modules, whose interfaces and functionalities may be modified in the subsequent upgrades of echarts.</p>\n<h2 id=\"use-echarts-lib-or-echarts-src-\">Use <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code>?</h2>\n<ul>\n<li>If intending to import part of echarts modules in your project and build yourself, only <code class=\"codespan\">echarts/lib/**</code> can be used, <code class=\"codespan\">echarts/src/**</code> should not be used.</li>\n<li>If using <code class=\"codespan\">echarts/build/build.js</code> to make a bundle, either <code class=\"codespan\">echarts/lib/**</code> or <code class=\"codespan\">echarts/src/**</code> can be used (should not be mixed), where <code class=\"codespan\">echarts/src/**</code> brings smaller bundle size a little.</li>\n</ul>\n<blockquote>\n<p>Reason: currently, <code class=\"codespan\">echarts/src/**</code> is the source code that using ES Module, and they are transpiled to CommonJS code and placed in <code class=\"codespan\">echarts/lib/**</code>. (This transformation is for backward compatible with old version of NodeJS and webpack that do not support ES Module.)\nHistorically, echarts extensions and user projects have been using the package path <code class=\"codespan\">echarts/lib/**</code>. So it should not be changed, otherwise, mixed using both <code class=\"codespan\">echarts/src/**</code> and <code class=\"codespan\">echarts/lib/**</code> will generate two echarts namespace and bring some problems. But it is not an issue when using <code class=\"codespan\">echarts/build/build.js</code> to create a bundle, where ES modules in <code class=\"codespan\">echarts/src/**</code> can be analyzed statically for smaller bundle size.</p>\n</blockquote>\n<h2 id=\"build-echarts-and-our-project-directly-by-rollup\">Build echarts and our project directly by rollup</h2>\n<p>Now we have known that how to create custom build by <code class=\"codespan\">echarts/build/build.js</code>. Alternatively, we can bundle echarts and our project directly by the tool like <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> or <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>. In some project, this approach is required. Next we only go with <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, because <a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> and <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> are in the similar way.</p>\n<p>Firstly install <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> in <code class=\"codespan\">myProject</code> directory:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>Then we create a project JS file <code class=\"codespan\">myProject/line.js</code> for line chart rendering:</p>\n<pre><code class=\"lang-js\">// Import the main module of echarts.\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// Import line chart.\nimport &#39;echarts/lib/chart/line&#39;;\n// Import components of tooltip, title and toolbox.\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// Render line chart and components.\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>The created module <code class=\"codespan\">myProject/line.js</code> can not work directly in the browsers that do not support ES Module. So we need to build them. Before we run <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>, a config file <code class=\"codespan\">myProject/rollup.config.js</code> should be created:</p>\n<pre><code class=\"lang-js\">// Responsible for looking for modules in `node_module` directory. For example,\n// if there is code `import &#39;echarts/lib/chart/line&#39;;`, the module file\n// `node_module/echarts/lib/chart/line.js` can be find by this plugin.\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// Responsible for compress code.\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// Support multi-language.\nimport ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // The entry file.\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        ecLangPlugin({lang: &#39;en&#39;}), // Use english\n        // Remove the snippet in `__DEV__`, which mainly prints error log.\n        uglify()\n    ],\n    output: {\n        // Output file in the format of &#39;umd&#39;.\n        format: &#39;umd&#39;,\n        // Output source map.\n        sourcemap: true,\n        // The path of the output bundle.\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>Then execute the following command in <code class=\"codespan\">myProject</code> directory to start the build:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p><code class=\"codespan\">-c</code> indicate <code class=\"codespan\">rollup</code> to use <code class=\"codespan\">myProject/rollup.config.js</code> as the config file.</p>\n</blockquote>\n<p>The created bundle <code class=\"codespan\">myProject/lib/line.min.js</code> includes project code and part of echarts code that we requried. Now we create a web page <code class=\"codespan\">myProject/line.html</code> to test it:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- Import the created bundle: --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>Open <code class=\"codespan\">myProject/line.html</code> in a browser, we will get:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"multi-language\">Multi-language</h2>\n<p>In the example above, we can notice that the label of the <code class=\"codespan\">toolbox</code> component is in English. Essentially any text can be customized by <code class=\"codespan\">echarts option</code>, but if we want to show label in a certain language by default, we have to specify the language while building the code.</p>\n<p>For example:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>It means that the pre-defined English text is used. Moreover, can be <code class=\"codespan\">--lang fi</code>.</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>It means that <code class=\"codespan\">myProject/my/langXX.js</code> is used to substitute <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> while performing build. So we can customize text in our language in <code class=\"codespan\">myProject/my/langXX.js</code>. Notice, <code class=\"codespan\">-o</code> or <code class=\"codespan\">--output</code> must be specified in the approach.</p>\n<p>Besides, the same lang parameter can be pass to <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code>.</p>\n"},"Use ECharts with webpack":{"type":["*"],"description":"<p><a href=\"https://webpack.js.org/\" target=\"_blank\">Webpack</a> is a popular module packaging tool, which can be used easily to import and packaging Apache ECharts (incubating)<sup>TM</sup>. Here we assume you already have certain understanding about webpack and used it in your project.</p>\n<h2 id=\"use-npm-to-install-echarts\">Use npm to install ECharts</h2>\n<p>You can use the following command to install ECharts with npm.</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"include-echarts\">Include ECharts</h2>\n<p>ECharts and zrender installed by npm will be placed under <code class=\"codespan\">node_modules</code>. You can obtain echarts directly in project with <code class=\"codespan\">require(&#39;echarts&#39;)</code>.</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts entry example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"include-echarts-charts-and-components-on-demand\">Include ECharts charts and components on demand</h2>\n<p>By default, <code class=\"codespan\">require(&#39;echarts&#39;)</code> returns the whole ECharts package including all charts and components, so the package size is a bit large. If you have a strict demand of package size, you may include packages on demand.</p>\n<p>For example, the code above only uses bar chart, tooltip and title component, so you only need to include these modules, effectively making the package size from more than 400 KB to about 170 KB.</p>\n<pre><code class=\"lang-js\">// include ECharts main module\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// include bar chart\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// include tooltip and title component\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// initialize echarts instance with prepared DOM\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// draw chart\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts introductory example&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;shirt&#39;, &#39;cardign&#39;, &#39;chiffon shirt&#39;, &#39;pants&#39;, &#39;heels&#39;, &#39;socks&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>Available modules see <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>The same goes for another popular packaging tools <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>, which will not be introduced again here. Using <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> to make a custom build of echarts is introduced in <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">Create Custom Build of ECharts</a></p>\n"},"ECharts Basic Concepts Overview":{"type":["*"],"description":"<p>This chapter describes some of the common concepts and terms of Apache ECharts (incubating)<sup>TM</sup>.</p>\n<h2 id=\"echarts-instance\">ECharts instance</h2>\n<p>We can create multiple <code class=\"codespan\">echarts instances</code> in a webpage. In each <code class=\"codespan\">echarts instance</code> we can create multiple diagrams, coordinate systems, etc. (described by <code class=\"codespan\">option</code>). With a DOM element prepared (as the container of an echarts instance), we can create a <code class=\"codespan\">echarts instance</code> based on that element. Each <code class=\"codespan\">echarts instance</code> takes its DOM element exclusively.</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"series\">Series</h2>\n<p><a href=\"option.html#series\" target=\"_blank\">series</a> is a very common term. In echarts, <a href=\"option.html#series\" target=\"_blank\">series</a> represents a series of value and the diagram generated from them. So the concept <a href=\"option.html#series\" target=\"_blank\">series</a> includes these key points: a series of value, the type of the diagram (<code class=\"codespan\">series.type</code>) and other parameters specified for the mapping from the values to a diagram.</p>\n<p>In echarts, the <code class=\"codespan\">series.type</code> and the &quot;diagram type&quot; are the same concept. <code class=\"codespan\">series.type</code> includes: <a href=\"option.html#series-line\" target=\"_blank\">line</a> (line plot), <a href=\"option.html#series-bar\" target=\"_blank\">bar</a> (bar chart), <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart), <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a> (scatter plot), <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> (graph plot), <a href=\"option.html#series-tree\" target=\"_blank\">tree</a> (tree plot), etc.</p>\n<p>In the example below, there are three <a href=\"option.html#series\" target=\"_blank\">series</a> (<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>) declared in the <code class=\"codespan\">option</code> on the right, where <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> are declared in each series:</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>Similarly, the following example shows another style of <code class=\"codespan\">option</code>, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"component\">Component</h2>\n<p>Over series, the entities in echarts are abstracted using the term &quot;component&quot;. For example, echarts includes these components: <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> (the x axis of Cartesian coordinate system), <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> (the y axis of Cartesian coordinate system), <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard of Cartesian coordinate system), <a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a> (the angle axis of polar coordinate system), <a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a> (the radius axis of polar coordinate system), <a href=\"option.html#polar\" target=\"_blank\">polar</a> (the baseboard of polar coordinate system), <a href=\"option.html#geo\" target=\"_blank\">geo</a> (GEO coordinate system), <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> (the component for changing the displayed range of data), <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> (the component for specifying the visual mapping), <a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a> (the tooltip component), <a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a> (the toolbox component), <a href=\"option.html#series\" target=\"_blank\">series</a>, etc.</p>\n<p>Notice that <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, a component for rendering diagram.</p>\n<p>Check the example below. Components (including series) are declared in <code class=\"codespan\">option</code> on the right, and the are finally rendered in the echarts instance.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>Notice: although <a href=\"option.html#series\" target=\"_blank\">series</a> is a kind of component, sometimes we can see phrases like &quot;series and components&quot;. The term &quot;component&quot; in this context actually means &quot;components except series&quot;.</p>\n<h2 id=\"define-charts-using-option\">Define charts using option</h2>\n<p>We have met the term <code class=\"codespan\">option</code> above. Users should use <code class=\"codespan\">option</code> to describe all of their requirements and input it to echarts. The requirements includes: &quot;what does the data like&quot;, &quot;what the diagram we need&quot;, &quot;what components we need&quot;, &quot;what the user interactions we need&quot;, etc. In short, <code class=\"codespan\">option</code> defines: <code class=\"codespan\">data</code>, <code class=\"codespan\">visual mapping</code>, <code class=\"codespan\">interaction</code>.</p>\n<pre><code class=\"lang-js\">// Create an echarts instance.\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// Use option to describe `data`, `visual mapping`, `interaction`, ...\n// `option` is a big JavaScript object.\nvar option = {\n    // Each property represents a kind of components.\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // If there are more than one components in one kind, we use an array.\n    // For example, there are three x axes here.\n    xAxis: [\n        // Each item represents an instance of component.\n        // `type` is used to indicate the sub-type of the component.\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // There are multiple series, using an array.\n    series: [\n        // `type` is also used to indicate the sub-type\n        // (i.e., diagram type) of each series.\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// Call `setOption` and input the `option`. And then the\n// echarts instance processes data and renders charts.\nchart.setOption(option);\n</code></pre>\n<p>Data is put in <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> in the above example. And we give another example showing another way, where each series retrieves data from <a href=\"option.html#dataset\" target=\"_blank\">dataset</a>:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // Each series retrieves data from `dataset`. The values in `encode`\n        // are the indices of the dimensions (i.e., column) of `dataset.source`.\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"position-a-component\">Position a component</h2>\n<p>These approaches are used to Position a component.</p>\n<p><br></p>\n<p><strong>[Absolute positioning like CSS]</strong></p>\n<p><br></p>\n<p>Most components and series can be absolutely positioned according to <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code>. This approach is like the absolute positioning in CSS. The absolute positioning is based on the container DOM element of the echarts.</p>\n<p>The value of each attribute can be:</p>\n<ul>\n<li>Absolute value (like <code class=\"codespan\">bottom: 54</code>, means: the distance from the boundary of the echarts container to bottom boundary of the component is <code class=\"codespan\">54</code> pixel).</li>\n<li>Or the percentage based on the width/height of the echarts container (like <code class=\"codespan\">right: &#39;20%&#39;</code>, means: the distance from the boundary of the echarts container to the right boundary of this component is <code class=\"codespan\">20%</code> of the width of the echarts container).</li>\n</ul>\n<p>Check the example below, where the <a href=\"option.html#grid\" target=\"_blank\">grid</a> component (that is the baseboard of a Cartesian coordinate system) are configured with <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code>.</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>Note that <code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> are one group of attributes for horizontal layout, while <code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> are another group of attributes for vertical layout. The two groups have nothing to do with each other. In each group, it is enough to set only one or at most two attributes. For example, when <code class=\"codespan\">left</code> and <code class=\"codespan\">right</code> have been specified, <code class=\"codespan\">width</code> can be automatically calculated by them.</p>\n<p><br></p>\n<p><strong>[Center-radius positioning]</strong></p>\n<p><br></p>\n<p>A few circular components or series need to be positioned by &quot;center&quot; and &quot;radius&quot;. For example, <a href=\"option.html#series-pie\" target=\"_blank\">pie</a> (pie chart)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a> (sunburst chart)、<a href=\"option.html#polar\" target=\"_blank\">polar</a> (polar coordinate system).</p>\n<p>As the name implies, it position the component according to <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a> and <a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>.</p>\n<p><br></p>\n<p><strong>[Other positioning]</strong></p>\n<p><br></p>\n<p>A few other components may has their own specific positioning approach. Check their docs before using them.</p>\n<h2 id=\"coordinate-system\">Coordinate system</h2>\n<p>Many series, like <a href=\"option.html#series-line\" target=\"_blank\">line</a>, <a href=\"option.html#series-bar\" target=\"_blank\">bar</a>, <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>, <a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>, etc., need to work on a coordinate system. Coordinate system is used to layout each graphic elements and display some ticks and labels. For example, echarts at least provides these coordinate systems: <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a>, <a href=\"option.html#singleAxis\" target=\"_blank\">single axis coordinate system</a>, <a href=\"option.html#calendar\" target=\"_blank\">calendar coordinate system</a>, etc. Some other series like <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>, <a href=\"option.html#series-tree\" target=\"_blank\">tree</a>, work independently without any coordinate systems. And still some other series like <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> are available either independently or on some coordinate system, depending on user settings.</p>\n<p>A coordinate system may consist of several components. For example, Cartesian coordinate system consists of <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and <a href=\"option.html#grid\" target=\"_blank\">grid</a> (the baseboard). <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> are referenced and assembled by <code class=\"codespan\">grid</code> and work together cooperatively.</p>\n<p>The following example demonstrates the most simple way to use a Cartesian coordinate system, where only <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> and a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> are declared, and <code class=\"codespan\">echarts</code> create and a <code class=\"codespan\">grid</code> implicitly to link them.</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>And the following example demonstrates a more complicated case, where two <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> share one <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>. And the two <code class=\"codespan\">series</code> are also share the <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>, but use different <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> respectively. The property <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> is used to specify which <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a> is used.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>The following echarts instance contain more than one <a href=\"option.html#grid\" target=\"_blank\">grid</a>. Each <a href=\"option.html#grid\" target=\"_blank\">grid</a> has its own <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a> and <a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>. The properties <a href=\"option.html#series-line.xAxisIndex\" target=\"_blank\">xAxisIndex</a>, <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> and <a href=\"option.html#yAxis.gridIndex\" target=\"_blank\">gridIndex</a> are used to specify the reference relationships.</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>Moreover, a type of series is usually available on various coordinate systems. For example, a <a href=\"option.html#series-scatter\" target=\"_blank\">scatter series</a> can work on <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a>, <a href=\"option.html#polar\" target=\"_blank\">polar coordinate system</a>, <a href=\"option.html#geo\" target=\"_blank\">GEO coordinate system</a> or other coordinate systems. Similarly, a coordinate system can serve different type of series. As the examples shown above, a <a href=\"option.html#grid\" target=\"_blank\">Cartesian coordinate system</a> serves several <a href=\"option.html#series-line\" target=\"_blank\">line series</a> and <a href=\"option.html#series-bar\" target=\"_blank\">bar series</a>.</p>\n"},"Customized Chart Styles":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> provides a rich amount of configurable items, which can be set in global, series, and data three different levels. Next, let&#39;s see an example of how to use ECharts to implement the following Nightingale rose chart:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n<h2 id=\"drawing-nightingale-rose-chart\">Drawing Nightingale Rose Chart</h2>\n<p><a href=\"#Get%20Started%20with%20ECharts%20in%205%20minutes\">Getting started tutorial</a> introduced how to make a simple bar chart. This time, we are going to make a pie chart. Pie charts use arc length of fans to represent ratio of a certain series in total share. It&#39;s data format is simpler than bar chart, because it only contains one dimension without category. Besides, since it&#39;s not in rectangular system, it doesn&#39;t need <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> either.</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    series : [\n        {\n            name: &#39;Reference Page&#39;,\n            type: &#39;pie&#39;,\n            radius: &#39;55%&#39;,\n            data:[\n                {value:400, name:&#39;Searching Engine&#39;},\n                {value:335, name:&#39;Direct&#39;},\n                {value:310, name:&#39;Email&#39;},\n                {value:274, name:&#39;Alliance Advertisement&#39;},\n                {value:235, name:&#39;Video Advertisement&#39;}\n            ]\n        }\n    ]\n})\n</code></pre>\n<p>With the above code, we can create a simple pie chart:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step0&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>Here, the value of <code class=\"codespan\">data</code> is not a single value, as that of the example in get started. Instead, it&#39;s an object containing <code class=\"codespan\">name</code> and <code class=\"codespan\">value</code>. Data in ECharts can always be a single value, or a configurable object with name, style and label. You may refer to <a href=\"option.html#series-pie.data\" target=\"_blank\">data</a> for more information.</p>\n<p><a href=\"option.html#series-pie\" target=\"_blank\">Pie charts</a> of EChart can be made into Nightingale rose charts with <a href=\"option.html#series-pie.roseType\" target=\"_blank\">roseType</a> field.</p>\n<pre><code class=\"lang-js\">roseType: &#39;angle&#39;\n</code></pre>\n<p>Nightingale rose charts use radius to represent data value.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step1&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"configuring-shadow\">Configuring Shadow</h2>\n<p>Commonly used styles of ECharts, like shadow, opacity, color, border-color, border-width, and etc., are set by <a href=\"#series-pie.itemStyle\">itemStyle</a> in series.</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // shadow size\n    shadowBlur: 200,\n    // horizontal offset of shadow\n    shadowOffsetX: 0,\n    // vertical offset of shadow\n    shadowOffsetY: 0,\n    // shadow color\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<p>The effect after added shadow is:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step2&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>Each <code class=\"codespan\">itemStyle</code> has <code class=\"codespan\">emphasis</code> as the highlighted style when mouse hovered. The last example shows the effect of adding shadow by default. But in most situations, we may probably need to add shadow to emphasis when mouse is hovered.</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    emphasis: {\n        shadowBlur: 200,\n        shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n    }\n}\n</code></pre>\n<h2 id=\"dark-background-and-light-text\">Dark Background and Light Text</h2>\n<p>Now, we need to change the whole theme as that shown in the example at the beginning of this tutorial. This can be achieved by changing background color and text color.</p>\n<p>Background is a global configurable object, so we can set it directly with <a href=\"option.html#backgroundColor\" target=\"_blank\">backgroundColor</a> of option.</p>\n<pre><code class=\"lang-js\">setOption({\n    backgroundColor: &#39;#2c343c&#39;\n})\n</code></pre>\n<p>Text style can also be set globally in <a href=\"option.html#textStyle\" target=\"_blank\">textStyle</a>.</p>\n<pre><code class=\"lang-js\">setOption({\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n})\n</code></pre>\n<p>On the other hand, we can also set them in <a href=\"option.html#series-pie.label.textStyle\" target=\"_blank\">label.textStyle</a> of each series.</p>\n<pre><code class=\"lang-js\">label: {\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>We also need to set line color of pie chart to be lighter.</p>\n<pre><code class=\"lang-js\">labelLine: {\n    lineStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>Thus, we can get the following effect.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step3&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>Similar to <code class=\"codespan\">itemStyle</code>, <code class=\"codespan\">label</code> and <code class=\"codespan\">labelLine</code> also have <code class=\"codespan\">emphasis</code> children.</p>\n<h2 id=\"setting-fan-colors\">Setting Fan Colors</h2>\n<p>Fan colors can be set in <code class=\"codespan\">itemStyle</code>:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // 设置扇形的颜色\n    color: &#39;#c23531&#39;,\n    shadowBlur: 200,\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step4&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>This is quite similar to our expect effect, except that fan colors should be made darker within shadow area, so as to make a sense of layering and space with blocked light.</p>\n<p>Each fan&#39;s color can be set under <code class=\"codespan\">data</code>:</p>\n<pre><code class=\"lang-js\">data: [{\n    value:400,\n    name:&#39;搜索引擎&#39;,\n    itemStyle: {\n        color: &#39;#c23531&#39;\n    }\n}, ...]\n</code></pre>\n<p>But since we only need the variation of color in this example, there&#39;s a simpler way to map data value to lightness through <a href=\"#option.html#visualMap\">visualMap</a>.</p>\n<pre><code class=\"lang-js\">visualMap: {\n    // hide visualMap component; use lightness mapping only\n    show: false,\n    // mapping with min value at 80\n    min: 80,\n    // mapping with max value at 600\n    max: 600,\n    inRange: {\n        // mapping lightness from 0 to 1\n        colorLightness: [0, 1]\n    }\n}\n</code></pre>\n<p>The final effect is:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n\n"},"Overview of Style Customization":{"type":["*"],"description":"<p>This article provides an overview of the different approaches about Apache ECharts (incubating)<sup>TM</sup> style customization. For example, how to config the color, size, shadow of the graphic elements and labels.</p>\n<blockquote>\n<p>The term &quot;style&quot; may not follow the convention of data visualization, but we use it in this article because it is popular and easy to understand.</p>\n</blockquote>\n<p>These approaches below will be introduced. The functionalities of them might be overlapped, but they are suitable for different scenarios.</p>\n<ul>\n<li>Theme</li>\n<li>Pallette</li>\n<li>Customize style explicitly (itemStyle, lineStyle, areaStyle, label, ...)</li>\n<li>Visual encoding (visualMap component)</li>\n</ul>\n<p>Other article about styling can be check in <a href=\"#Customized%20Chart%20Styles\">Customized Chart Styles</a> and <a href=\"#Visual%20Map%20of%20Data\">Visual Map of Data</a>.</p>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Theme</strong></p>\n<p>Setting a theme is the simplest way to change the color style. For example, in <a href=\"https://echarts.apache.org/examples/en/index.html\" target=\"_blank\">Examples page</a>, &quot;Theme&quot; can be selected, and view the result directly.</p>\n<p>Since ECharts4, besides the original default theme, ECharts provide another two built-in themes, named &#39;<code class=\"codespan\">&#39;light&#39;</code> and <code class=\"codespan\">&#39;dark&#39;</code>. They can be used as follows:</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;light&#39;);\n</code></pre>\n<p>or</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;dark&#39;);\n</code></pre>\n<p>Other themes are not included in ECharts package by default, and need to load them ourselves if we want to use them. Themes can be visited and downloaded in <a href=\"https://www.echartsjs.com/theme-builder/\" target=\"_blank\">Theme Builder</a>. Theme can also be created or edited in it. The downloaded theme can be used as follows:</p>\n<p>If a theme is downloaded as a JSON file, we should register it by ourselves, for example:</p>\n<pre><code class=\"lang-js\">var xhr = new XMLHttpRequest();\n// Assume the theme name is &quot;vintage&quot;.\nxhr.open(&#39;GET&#39;, &#39;xxx/xxx/vintage.json&#39;, true);\nxhr.onload = function () {\n    var themeJSON = this.response;\n    echarts.registerTheme(&#39;vintage&#39;, JSON.parse(themeJSON))\n    var chart = echarts.init(dom, &#39;vintage&#39;);\n    // ...\n});\nxhr.send();\n</code></pre>\n<p>If a them is downloaded as a JS file, it will auto register itself:</p>\n<pre><code class=\"lang-js\">// Import the `vintage.js` file in HTML, then:\nvar chart = echarts.init(dom, &#39;vintage&#39;);\n// ...\n</code></pre>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Palette</strong></p>\n<p>Pallettes can be given in option. They provide a group of colors, which will be auto picked by series and data. We can give a global palette, or exclusive pallette for certain series.</p>\n<pre><code class=\"lang-js\">option = {\n    // Global palette:\n    color: [&#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\n    series: [{\n        type: &#39;bar&#39;,\n        // A palette only work for the series:\n        color: [&#39;#dd6b66&#39;,&#39;#759aa0&#39;,&#39;#e69d87&#39;,&#39;#8dc1a9&#39;,&#39;#ea7e53&#39;,&#39;#eedd78&#39;,&#39;#73a373&#39;,&#39;#73b9bc&#39;,&#39;#7289ab&#39;, &#39;#91ca8c&#39;,&#39;#f49f42&#39;],\n        ...\n    }, {\n        type: &#39;pie&#39;,\n        // A palette only work for the series:\n        color: [&#39;#37A2DA&#39;, &#39;#32C5E9&#39;, &#39;#67E0E3&#39;, &#39;#9FE6B8&#39;, &#39;#FFDB5C&#39;,&#39;#ff9f7f&#39;, &#39;#fb7293&#39;, &#39;#E062AE&#39;, &#39;#E690D1&#39;, &#39;#e7bcf3&#39;, &#39;#9d96f5&#39;, &#39;#8378EA&#39;, &#39;#96BFFF&#39;],\n        ...\n    }]\n}\n</code></pre>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Customize style explicitly (itemStyle, lineStyle, areaStyle, label, ...)</strong></p>\n<p>It is a common way to set style explicitly. Throughout ECharts <a href=\"option.html\" target=\"_blank\">option</a>, style related options can be set in various place, including <a href=\"option.html#series.itemStyle\" target=\"_blank\">itemStyle</a>, <a href=\"option.html#series-line.lineStyle\" target=\"_blank\">lineStyle</a>, <a href=\"option.html#series-line.areaStyle\" target=\"_blank\">areaStyle</a>, <a href=\"option.html#series.label\" target=\"_blank\">label</a>, etc.</p>\n<p>Generally speaking, all of the built-in components and series follow the naming convention like <code class=\"codespan\">itemStyle</code>, <code class=\"codespan\">lineStyle</code>, <code class=\"codespan\">areaStyle</code>, <code class=\"codespan\">label</code> etc., although they may occur in different place according to different series or components.</p>\n<p>There is another article for style setting, <a href=\"#Customized%20Chart%20Styles\">Customized Chart Styles</a>.</p>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Style of emphasis state</strong></p>\n<p>When mouse hovering a graphic elements, usually the emphasis style will be displayed. By default, the emphasis style is auto generated by the normal style. However they can be specified by <a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphasis</a> property. The options in <a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphasis</a> is the same as the ones for normal state, for example:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        // Styles for normal state.\n        itemStyle: {\n            // Color of the point.\n            color: &#39;red&#39;\n        },\n        label: {\n            show: true,\n            // Text of labels.\n            formatter: &#39;This is a normal label.&#39;\n        },\n\n        // Styles for emphasis state.\n        emphasis: {\n            itemStyle: {\n                // Color in emphasis state.\n                color: &#39;blue&#39;\n            },\n            label: {\n                show: true,\n                // Text in emphasis.\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>Notice: Before ECharts4, the emphasis style should be written like this:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        itemStyle: {\n            // Styles for normal state.\n            normal: {\n                color: &#39;red&#39;\n            },\n            // Styles for emphasis state.\n            emphasis: {\n                color: &#39;blue&#39;\n            }\n        },\n\n        label: {\n            // Styles for normal state.\n            normal: {\n                show: true,\n                formatter: &#39;This is a normal label.&#39;\n            },\n            // Styles for emphasis state.\n            emphasis: {\n                show: true,\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>The option format is still <strong>compatible</strong>, but not recommended. In fact, in most cases, users only set normal style, and use the default emphasis style. So since ECharts4, we support to write style without the &quot;normal&quot; term, which makes the option more simple and neat.</p>\n<p><br></p>\n<hr>\n<p><br></p>\n<p><strong>Visual encoding (visualMap component)</strong></p>\n<p><a href=\"option.html#visualMap\" target=\"_blank\">visualMap component</a> supports config the rule that mapping value to visual channel (color, size, ...). More details can be check in <a href=\"#Visual%20Map%20of%20Data\">Visual Map of Data</a>.</p>\n"},"Loading and Updating of Asynchronous Data":{"type":["*"],"description":"<h2 id=\"asynchronous-loading\">Asynchronous Loading</h2>\n<p>Data in <a href=\"#getting-started\">Get started</a> is directly filled in <code class=\"codespan\">setOption</code> after initialization, but in some cases, data may be filled after asynchronous loading. Data updating asynchronously in Apache ECharts (incubating)<sup>TM</sup> is very easy. After initialization, you can pass in data and configuration item through <code class=\"codespan\">setOption</code> after data obtained through  jQuery and other tools at any time.</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.setOption({\n        title: {\n            text: &#39;asynchronous data loading example&#39;\n        },\n        tooltip: {},\n        legend: {\n            data:[&#39;Sales&#39;]\n        },\n        xAxis: {\n            data: [&quot;shirts&quot;,&quot;cardigan&quot;,&quot;chiffon shirt&quot;,&quot;pants&quot;,&quot;heels&quot;,&quot;sockes&quot;]\n        },\n        yAxis: {},\n        series: [{\n            name: &#39;Sales&#39;,\n            type: &#39;bar&#39;,\n            data: [5, 20, 36, 10, 10, 20]\n        }]\n    });\n});\n</code></pre>\n<p>Or, you may set other styles, displaying an empty rectangular axis, and then fill in data when ready.</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// show title. legend and empty axis\nmyChart.setOption({\n    title: {\n        text: &#39;asynchronous data loading example&#39;\n    },\n    tooltip: {},\n    legend: {\n        data:[&#39;Sales&#39;]\n    },\n    xAxis: {\n        data: []\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;Sales&#39;,\n        type: &#39;bar&#39;,\n        data: []\n    }]\n});\n\n// Asynchronous data loading\n$.get(&#39;data.json&#39;).done(function (data) {\n    // fill in data\n    myChart.setOption({\n        xAxis: {\n            data: data.categories\n        },\n        series: [{\n            // find series by name\n            name: &#39;Sales&#39;,\n            data: data.data\n        }]\n    });\n});\n</code></pre>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-async&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>In ECharts, updating data need to find the corresponding series through <code class=\"codespan\">name</code>. In the above example, updating can be performed correctly according to series order if <code class=\"codespan\">name</code> is not defined. But in most cases, it is recommended to update data with series <code class=\"codespan\">name</code> information.</p>\n<h2 id=\"loading-animation\">Loading Animation</h2>\n<p>If data loading time is too long, an empty axis on the canvas may confuse users. In this case, a loading animation is needed to tell the user that it&#39;s still loading.</p>\n<p>ECharts provides a simple loading animation by default. You only need <a href=\"api.html#echartsInstance.showLoading\" target=\"_blank\">showLoading</a> to show, and then use <a href=\"api.html#echartsInstance.hideLoading\" target=\"_blank\">hideLoading</a> to hide loading animation after data loading.</p>\n<pre><code class=\"lang-js\">myChart.showLoading();\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.hideLoading();\n    myChart.setOption(...);\n});\n</code></pre>\n<p>Effects are as followed:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-loading&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"dynamic-data-updating\">Dynamic Data Updating</h2>\n<p>ECharts is driven by data. Change of data changes the presentation of chart, therefore, implementing dynamic data updating is extremely easy.</p>\n<p>All data updating are through <a href=\"#api.html#echartsInstance.setOption\">setOption</a>. You only need to get data as you wish, fill in data to <a href=\"#api.html#echartsInstance.setOption\">setOption</a> without considering the changes brought by data, ECharts will find the difference between two group of data and present the difference through proper animation.</p>\n<blockquote>\n<p>In ECharts 3, addData in ECharts 2 is removed.If a single data needs to be added, you can first data.push(value) and then setOption.</p>\n</blockquote>\n<p>See details in the following example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-dynamic-data&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n\n"},"Dataset":{"type":["*"],"description":"<p><code class=\"codespan\">dataset</code> component is published since Apache ECharts (incubating)<sup>TM</sup> 4. <code class=\"codespan\">dataset</code> brings convenience in data management separated with styles and enables data reuse by different series. More importantly, it enables data encoding from data to visual, which brings convenience in some scenarios.</p>\n<p>Before ECharts 4, data was only able to declared in each series, for example:</p>\n<pre><code class=\"lang-js\">option = {\n    xAxis: {\n        type: &#39;category&#39;,\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2015&#39;,\n            data: [89.3, 92.1, 94.4, 85.4]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2016&#39;,\n            data: [95.8, 89.4, 91.2, 76.9]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2017&#39;,\n            data: [97.7, 83.1, 92.5, 78.1]\n        }\n    ]\n}\n</code></pre>\n<p>This approach is easy to be understand and is flexible when some series needs special data definitions. But the shortcomings are also obvious: some data extra works are usually needed to split the original data to each series, and it not supports sharing data in different series, moreover, it is not good for encode.</p>\n<p>ECharts4 starts to provide <code class=\"codespan\">dataset</code> component, which brings benefits below:</p>\n<ul>\n<li>Benefit from <code class=\"codespan\">dataset</code>, we can follow the common methodology of data visualization: based on data, specify the mapping (via the option <a href=\"option.html#series.encode\" target=\"_blank\">encode</a>) from data to visual.</li>\n<li>Data can be managed and configured separately from other configurations.</li>\n<li>Data can be reused by different series and components.</li>\n<li>Support more common data format (like 2d-array, object-array), to avoid data transform works for users.</li>\n</ul>\n<h2 id=\"get-started\">Get started</h2>\n<p>This is a simplest example of <code class=\"codespan\">dataset</code>:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // Provide data.\n        source: [\n            [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n            [&#39;Matcha Latte&#39;, 43.3, 85.8, 93.7],\n            [&#39;Milk Tea&#39;, 83.1, 73.4, 55.1],\n            [&#39;Cheese Cocoa&#39;, 86.4, 65.2, 82.5],\n            [&#39;Walnut Brownie&#39;, 72.4, 53.9, 39.1]\n        ]\n    },\n    // Declare X axis, which is a category axis, mapping\n    // to the first column by default.\n    xAxis: {type: &#39;category&#39;},\n    // Declare Y axis, which is a value axis.\n    yAxis: {},\n    // Declare several series, each of them mapped to a\n    // column of the dataset by default.\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n}\n</code></pre>\n<p>This is the result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n<p>Or the common format object-array is also supported:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // Here the declared `dimensions` is mainly for providing the order of\n        // the dimensions, which enables ECharts to apply the default mapping\n        // from dimensions to axes.\n        // Alternatively, we can declare `series.encode` to specify the mapping,\n        // which will be introduced later.\n        dimensions: [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n        source: [\n            {product: &#39;Matcha Latte&#39;, &#39;2015&#39;: 43.3, &#39;2016&#39;: 85.8, &#39;2017&#39;: 93.7},\n            {product: &#39;Milk Tea&#39;, &#39;2015&#39;: 83.1, &#39;2016&#39;: 73.4, &#39;2017&#39;: 55.1},\n            {product: &#39;Cheese Cocoa&#39;, &#39;2015&#39;: 86.4, &#39;2016&#39;: 65.2, &#39;2017&#39;: 82.5},\n            {product: &#39;Walnut Brownie&#39;, &#39;2015&#39;: 72.4, &#39;2016&#39;: 53.9, &#39;2017&#39;: 39.1}\n        ]\n    },\n    xAxis: {type: &#39;category&#39;},\n    yAxis: {},\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n};\n</code></pre>\n<h2 id=\"mapping-from-data-to-graphic\">Mapping from data to graphic</h2>\n<p>In this tutorial, we make charts following this methodology: base on data, config the rule to map data to graphic, namely, encode the data to graphic.</p>\n<p>Generally, this mapping can be performed:</p>\n<ul>\n<li>Configure whether columns or rows of a dataset will mapped to series, namely, the series layout on the columns or rows of a dataset. This can be specified by <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">series.seriesLayoutBy</a>. <code class=\"codespan\">&#39;column&#39;</code> is the default value.</li>\n<li>Configure the mapping rule from dimensions (a dimension means a column/row) to axes in coordinate system, tooltip, labels, color, symbol size, etc. This can be specified by <a href=\"option.html#series.encode\" target=\"_blank\">series.encode</a> and <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> (if visual encoding is required). The example above does not give a mapping rule, so ECharts make default mapping by common sense: because x axis is a category axis, the first column is mapped to the x axis, and each series use each subsequent column in order.</li>\n</ul>\n<p>Let&#39;s illustrate them in detail below.</p>\n<h2 id=\"mapping-by-column-or-row\">Mapping by column or row</h2>\n<p>Giving dataset, users can configure whether columns or rows of a dataset will be mapped to series, namely, the series layout on the columns or rows of a dataset. This can be specified by <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">series.seriesLayoutBy</a>. The optional values are:</p>\n<ul>\n<li>&#39;column&#39;: series are positioned on each columns of the dataset. Default value.</li>\n<li>&#39;row&#39;: series are positioned on each row of the dataset.</li>\n</ul>\n<p>See the example below:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        source: [\n            [&#39;product&#39;, &#39;2012&#39;, &#39;2013&#39;, &#39;2014&#39;, &#39;2015&#39;],\n            [&#39;Matcha Latte&#39;, 41.1, 30.4, 65.1, 53.3],\n            [&#39;Milk Tea&#39;, 86.5, 92.1, 85.7, 83.1],\n            [&#39;Cheese Cocoa&#39;, 24.1, 67.2, 79.5, 86.4]\n        ]\n    },\n    xAxis: [\n        {type: &#39;category&#39;, gridIndex: 0},\n        {type: &#39;category&#39;, gridIndex: 1}\n    ],\n    yAxis: [\n        {gridIndex: 0},\n        {gridIndex: 1}\n    ],\n    grid: [\n        {bottom: &#39;55%&#39;},\n        {top: &#39;55%&#39;}\n    ],\n    series: [\n        // These series is in the first cartesian (grid), and each\n        // is mapped to a row.\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        // These series is in the second cartesian (grid), and each\n        // is mapped to a column.\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1}\n    ]\n}\n</code></pre>\n<p>This is the result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-series-layout-by&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n<h2 id=\"dimension\">Dimension</h2>\n<p>Before introducing <code class=\"codespan\">encode</code>, we should clarify the concept of <code class=\"codespan\">dimension</code>.</p>\n<p>Most of common charts describe data in the format of &quot;two-dimensions table&quot; (note that the meaning of the word &quot;dimension&quot; in &quot;two-dimension table&quot; is not the same as the dimensions in ECharts. \bIn order not to be confusing, we use &quot;2d-table&quot;, &quot;2d-array&quot; below). In the examples above, we use 2d-array to carry the 2d-table. When we set <code class=\"codespan\">seriesLayoutBy</code> as <code class=\"codespan\">&#39;column&#39;</code>, namely, mapping columns to series, each column is called a dimension, and each row is a data item. When we set <code class=\"codespan\">seriesLayoutBy</code> as <code class=\"codespan\">&#39;row&#39;</code>, namely, mapping rows to series, each row is called a dimension, and each column is a data item.</p>\n<p>Dimension can have its name to displayed on charts. Dimension name can be defined on the first row/column. Take the code above as an example, <code class=\"codespan\">&#39;score&#39;</code>、<code class=\"codespan\">&#39;amount&#39;</code>、<code class=\"codespan\">&#39;product&#39;</code> are dimension names, and data start from the second row. By default ECharts auto detect whether the first row/column of <code class=\"codespan\">dataset.source</code> is dimension name or data. Use can also set <code class=\"codespan\">dataset.sourceHeader</code> as <code class=\"codespan\">true</code> to mandatorily specify the first row/column is dimension name, or set as <code class=\"codespan\">false</code> to indicate the data start from the first row/column.</p>\n<p>The definitions of the dimensions can also be provided separately in <code class=\"codespan\">dataset.dimensions</code> or <code class=\"codespan\">series.dimensions</code>, where not only dimension name, but also dimension type can be specified:</p>\n<pre><code class=\"lang-js\">var option1 = {\n    dataset: {\n        dimensions: [\n            // Each item can be object or string.\n            {name: &#39;score&#39;},\n            // A string indicates the dimension name.\n            &#39;amount&#39;,\n            // Dimension type can be specified.\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ],\n        source: [...]\n    },\n    ...\n};\n\nvar option2 = {\n    dataset: {\n        source: [...]\n    },\n    series: {\n        type: &#39;line&#39;,\n        // Dimensions declared in series will be adapted with higher priority.\n        dimensions: [\n            null, // Set as null means we dont want to set dimension name.\n            &#39;amount&#39;,\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ]\n    },\n    ...\n};\n</code></pre>\n<p>Generally, we do not need to set dimensions types, because it can be auto detected based on data by ECharts. But in some cases, for example, the data is empty, the detection might not be accurate, where dimension type can be set manually.</p>\n<p>The optional values of dimension types can be:</p>\n<ul>\n<li><code class=\"codespan\">&#39;number&#39;</code>: Normal data, default value.</li>\n<li><code class=\"codespan\">&#39;ordinal&#39;</code>: Represents string data like category data or text data. ECharts will auto detect them by default. They can be set manually if the detection fail.</li>\n<li><code class=\"codespan\">&#39;time&#39;</code>: Represents time data, where it is supported that parse time string to timestamp. For example, if users need to parse &#39;2017-05-10&#39; to timestamp, it should be set as <code class=\"codespan\">time</code> type. If the dimension is used on a time axis (<a href=\"option.html#xAxis.type\" target=\"_blank\">axis.type</a> is <code class=\"codespan\">&#39;time&#39;</code>), it will be auto set to <code class=\"codespan\">time</code> type. The supported time string is listed in <a href=\"option.html#series.data\" target=\"_blank\">data</a>.</li>\n<li><code class=\"codespan\">&#39;float&#39;</code>: If set as <code class=\"codespan\">&#39;float&#39;</code>, it will be stored in <code class=\"codespan\">TypedArray</code>, which is good for performance optimization.</li>\n<li><code class=\"codespan\">&#39;int&#39;</code>: If set as <code class=\"codespan\">&#39;int&#39;</code>, it will be stored in <code class=\"codespan\">TypedArray</code>, which is good for performance optimization.</li>\n</ul>\n<h2 id=\"mapping-from-data-to-graphic-encode-\">Mapping from data to graphic (encode)</h2>\n<p>Having the concept of dimension clarified, we can use <a href=\"option.html#series.encode\" target=\"_blank\">encode</a> to map data to graphic:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [&#39;score&#39;, &#39;amount&#39;, &#39;product&#39;],\n            [89.3, 58212, &#39;Matcha Latte&#39;],\n            [57.1, 78254, &#39;Milk Tea&#39;],\n            [74.4, 41032, &#39;Cheese Cocoa&#39;],\n            [50.1, 12755, &#39;Cheese Brownie&#39;],\n            [89.7, 20145, &#39;Matcha Cocoa&#39;],\n            [68.1, 79146, &#39;Tea&#39;],\n            [19.6, 91852, &#39;Orange Juice&#39;],\n            [10.6, 101852, &#39;Lemon Juice&#39;],\n            [32.7, 20112, &#39;Walnut Brownie&#39;]\n        ]\n    },\n    xAxis: {},\n    yAxis: {type: &#39;category&#39;},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            encode: {\n                // Map dimension &quot;amount&quot; to the X axis.\n                x: &#39;amount&#39;,\n                // Map dimension &quot;product&quot; to the Y axis.\n                y: &#39;product&#39;\n            }\n        }\n    ]\n};\n</code></pre>\n<p>This is the result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/dataset-encode-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n\n<p>The basic structure of <a href=\"option.html#series.encode\" target=\"_blank\">encode</a> is illustrated as follows, where the left part of colon is the name of axis like <code class=\"codespan\">&#39;x&#39;</code>, <code class=\"codespan\">&#39;y&#39;</code>, <code class=\"codespan\">&#39;radius&#39;</code>, <code class=\"codespan\">&#39;angle&#39;</code> or some special reserved names like &quot;tooltip&quot;, &quot;itemName&quot; etc., and the right part of the colon is the dimension names or dimension indices (based on 0). One or more dimensions can be specified. Usually not all of mappings need to be specified, only specify needed ones.</p>\n<p>The properties available in <code class=\"codespan\">encode</code> listed as follows:</p>\n<pre><code class=\"lang-js\">// In any of the series and coordinate systems,\n// these properties are available:\nencode: {\n    // Display dimension &quot;product&quot; and &quot;score&quot; in the tooltip.\n    tooltip: [&#39;product&#39;, &#39;score&#39;]\n    // Set the series name as the concat of the names of dimensions[1] and dimensions[3].\n    // (sometimes the dimension names are too long to type in series.name manually).\n    seriesName: [1, 3],\n    // Using dimensions[2] as the id of each data item. This is useful when dynamically\n    // update data by `chart.setOption()`, where the new and old data item can be\n    // corresponded by id, by which the appropriate animation can be performed when updating.\n    itemId: 2,\n    // Using dimensions[3] as the name of each data item. This is useful in charts like\n    // &#39;pie&#39;, &#39;funnel&#39;, where data item name can be displayed in legend.\n    itemName: 3\n}\n\n// These properties only work in cartesian(grid) coordinate system:\nencode: {\n    // Map dimensions[1], dimensions[5] and dimension &quot;score&quot; to the X axis.\n    x: [1, 5, &#39;score&#39;],\n    // Map dimensions[0] to the Y axis.\n    y: 0\n}\n\n// These properties only work in polar coordinate system:\nencode: {\n    radius: 3,\n    angle: 2,\n    ...\n}\n\n// These properties only work in geo coordinate system:\nencode: {\n    lng: 3,\n    lat: 2\n}\n\n// For some type of series that are not in any coordinate system,\n// like &#39;pie&#39;, &#39;funnel&#39; etc.:\nencode: {\n    value: 3\n}\n</code></pre>\n<p>There is an other example for <code class=\"codespan\">encode</code>:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n\n\n<h2 id=\"visual-encoding-color-symbol-etc-\">Visual encoding (color, symbol, etc.)</h2>\n<p>We can use <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> component to map data to visual channel like color, symbol size, etc.. More info about it can be checked in its <a href=\"option.html#visualMap\" target=\"_blank\">doc</a>.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode0&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n\n<h2 id=\"default-encoding\">Default encoding</h2>\n<p>For some common cases (line chart, bar chart, scatter plot, candlestick, pie, funnel, etc.), EChart provides default encoding settings, by which chart will be displayed even if no <code class=\"codespan\">encode</code> option is specified. (If <code class=\"codespan\">encode</code> option is specified, default encoding will not be applied.) The rule of default encoding should not be too complicated. Basically it is:</p>\n<ul>\n<li>In coordinate system (like cartesian(grid), polar):<ul>\n<li>If category axis (i.e., axis.type is <code class=\"codespan\">&#39;category&#39;</code>) exists, map the first column/row to the axis, and each series use a following column/row.</li>\n<li>If no category axis exists, and the coordinate system contains two axis (like X Y in cartesian), each series use two columns/rows, one for a axis.</li>\n</ul>\n</li>\n<li>If no coordinate system (like pie chart):<ul>\n<li>Use the first column/row as item name, and the second column/row as item value.</li>\n</ul>\n</li>\n</ul>\n<p>If the default rule does not meet the requirements, configure the <code class=\"codespan\">encode</code> yourself please.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-default&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n\n<h2 id=\"q-a\">Q &amp; A</h2>\n<p>Q: How to map the third column to X axis, and map the fifth column to Y axis?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">series: {\n    // Notice that the dimension index is based on 0,\n    // thus the third column is dimensions[2].\n    encode: {x: 2, y: 4},\n    ...\n}\n</code></pre>\n<p>Q: How to map the third row th X axis, and map the fifth row to Y axis?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {x: 2, y: 4},\n    seriesLayoutBy: &#39;row&#39;,\n    ...\n}\n</code></pre>\n<p>Q: How to use the values in the second column in label.</p>\n<p>A:\nThe <a href=\"option.html#series.label.formatter\" target=\"_blank\">label.formatter</a> supports refer value in a certain dimension. For example:</p>\n<pre><code class=\"lang-js\">series: {\n    label: {\n        // `&#39;{@score}&#39;` means use the value in the &quot;score&quot; dimension.\n        // `&#39;{@[4]}&#39;` means use the value in dimensions[4].\n        formatter: &#39;aaa{@product}bbb{@score}ccc{@[4]}ddd&#39;\n    }\n}\n</code></pre>\n<p>Q: How to display the second column and the third column in tooltip?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {\n        tooltip: [1, 2]\n        ...\n    },\n    ...\n}\n</code></pre>\n<p>Q: If there is no dimension name in dataset.source, how to give dimension name?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">dataset: {\n    dimensions: [&#39;score&#39;, &#39;amount&#39;],\n    source: [\n        [89.3, 3371],\n        [92.1, 8123],\n        [94.4, 1954],\n        [85.4, 829]\n    ]\n}\n</code></pre>\n<p>Q: How to encode the third column in bubble size in bubble plot?</p>\n<p>A:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [12, 323, 11.2],\n            [23, 167, 8.3],\n            [81, 284, 12],\n            [91, 413, 4.1],\n            [13, 287, 13.5]\n        ]\n    },\n    // Use visualMap to perform visual encoding.\n    visualMap: {\n        show: false,\n        dimension: 2, // Encode the third column.\n        min: 2, // Min value is required in visualMap component.\n        max: 15, // Max value is required in visualMap component.\n        inRange: {\n            // The range of bubble size, from 5 pixel to 60 pixel.\n            symbolSize: [5, 60]\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: {\n        type: &#39;scatter&#39;\n    }\n};\n</code></pre>\n<p>Q: We have specified <code class=\"codespan\">encode</code>, but why it does not work?</p>\n<p>A: Maybe we can try to check typo, for example, the dimension name is <code class=\"codespan\">&#39;Life Expectancy&#39;</code>, be we typed <code class=\"codespan\">&#39;Life Expectency&#39;</code> in <code class=\"codespan\">encode</code> option.</p>\n<h2 id=\"various-formats-in-dataset\">Various formats in dataset</h2>\n<p>In lots of cases, data is described in 2d-table. For example, some data processing software like MS Excel, Numbers are based on 2d-table. The data can be exported as JSON format and input to <code class=\"codespan\">dataset.source</code>.</p>\n<blockquote>\n<p>Some csv tools can be used to export the table data to JSON, for example, <a href=\"https://github.com/d3/d3-dsv\" target=\"_blank\">dsv</a> or <a href=\"https://github.com/mholt/PapaParse\" target=\"_blank\">PapaParse</a>.</p>\n</blockquote>\n<p>In common used data transfer formats in JavaScript, 2d-array is a good choice to carry table data, which has been illustrated in the examples above.</p>\n<p>Besides, 2d-array, <code class=\"codespan\">dataset</code> also support key-value format as follows, which is also commonly used. But notice, the option <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">seriesLayoutBy</a> is not supported in this format.</p>\n<pre><code class=\"lang-js\">dataset: [{\n    // Row based key-value format, namely, object array, is a commonly used format.\n    source: [\n        {product: &#39;Matcha Latte&#39;, count: 823, score: 95.8},\n        {product: &#39;Milk Tea&#39;, count: 235, score: 81.4},\n        {product: &#39;Cheese Cocoa&#39;, count: 1042, score: 91.2},\n        {product: &#39;Walnut Brownie&#39;, count: 988, score: 76.9}\n    ]\n}, {\n    // Column based key-value format is also supported.\n    source: {\n        &#39;product&#39;: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;],\n        &#39;count&#39;: [823, 235, 1042, 988],\n        &#39;score&#39;: [95.8, 81.4, 91.2, 76.9]\n    }\n}]\n</code></pre>\n<h2 id=\"multiple-datasets-and-references\">Multiple datasets and references</h2>\n<p>Multiple datasets can be defined, and series can refer them by <a href=\"option.html#series.datasetIndex\" target=\"_blank\">series.datasetIndex</a>.</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: [{\n        source: [...],\n    }, {\n        source: [...]\n    }, {\n        source: [...]\n    }],\n    series: [{\n        // Use the third dataset.\n        datasetIndex: 2\n    }, {\n        // Use the second dataset.\n        datasetIndex: 1\n    }]\n}\n</code></pre>\n<h2 id=\"echarts3-data-setting-approach-series-data-can-be-used-normally\">ECharts3 data setting approach (series.data) can be used normally</h2>\n<p>The data setting approach before ECharts4 can still be used normally. If a series has declared <a href=\"option.html#series.data\" target=\"_blank\">series.data</a>, it will be used but not <code class=\"codespan\">dataset</code>.</p>\n<pre><code class=\"lang-js\">{\n    xAxis: {\n        type: &#39;category&#39;\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [{\n        type: &#39;bar&#39;,\n        name: &#39;2015&#39;,\n        data: [89.3, 92.1, 94.4, 85.4]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2016&#39;,\n        data: [95.8, 89.4, 91.2, 76.9]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2017&#39;,\n        data: [97.7, 83.1, 92.5, 78.1]\n    }]\n}\n</code></pre>\n<p>In fact, setting data via <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> is not deprecated and useful in some cases. For example, for some charts, like <a href=\"option.html#series-treemap\" target=\"_blank\">treemap</a>, <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>, <a href=\"option.html#series-lines\" target=\"_blank\">lines</a>, that do not apply table data, <code class=\"codespan\">dataset</code> is not supported for yet. Moreover, for the case of large data rendering (for example, millions of data), <a href=\"api.html#echartsInstance.appendData\" target=\"_blank\">appendData</a> is probably needed to load data incrementally. <code class=\"codespan\">dataset</code> is not supported in the case.</p>\n<h2 id=\"others\">Others</h2>\n<p>Currently, not all types of series support dataset. Series that support dataset includes:</p>\n<p><code class=\"codespan\">line</code>, <code class=\"codespan\">bar</code>, <code class=\"codespan\">pie</code>, <code class=\"codespan\">scatter</code>, <code class=\"codespan\">effectScatter</code>, <code class=\"codespan\">parallel</code>, <code class=\"codespan\">candlestick</code>, <code class=\"codespan\">map</code>, <code class=\"codespan\">funnel</code>, <code class=\"codespan\">custom</code>.</p>\n<p>More types of series will support dataset in our further work.</p>\n<p>Finally, this is an example, multiple series sharing one <code class=\"codespan\">dataset</code> and having interactions:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-link&edit=1&reset=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n\n\n\n"},"Add interaction to the chart component":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> provides many interaction components besides chart. For example:</p>\n<p><code class=\"codespan\">legend component</code> <a href=\"option.html#legend\" target=\"_blank\">legend</a>、<code class=\"codespan\">title component</code> <a href=\"option.html#title\" target=\"_blank\">title</a>、<code class=\"codespan\">visualmap component</code> <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>、<code class=\"codespan\">datazoom component</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>、<code class=\"codespan\">dataline component</code> <a href=\"option.html#timeline\" target=\"_blank\">timeline</a></p>\n<p>Following is an example of <code class=\"codespan\">datazoom component</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> as an introduction of how to add this kind of component.</p>\n<h2 id=\"introduction-of-data-zoom-component-datazoom-\">Introduction of data zoom component (dataZoom)</h2>\n<p>Data overview by default, and detail by requirement is a basic interaction need of data visualization. <code class=\"codespan\">dataZoom</code> component can implement this function in rectangular coordinate (<a href=\"option.html#grid\" target=\"_blank\">grid</a>) and polar coordinate (<a href=\"option.html#polar\" target=\"_blank\">polar</a>.</p>\n<p><strong>For example: </strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-dataZoom-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<ul>\n<li><code class=\"codespan\">dataZoom</code> component operates <em>data window zoom</em> and <em>data window translation</em> on <code class=\"codespan\">axis</code>.</li>\n</ul>\n<blockquote>\n<p>Use <a href=\"option.html#dataZoom.xAxisIndex\" target=\"_blank\">dataZoom.xAxisIndex</a>, <a href=\"option.html#dataZoom.yAxisIndex\" target=\"_blank\">dataZoom.yAxisIndex</a> to specify which axis <code class=\"codespan\">dataZoom</code> controls.</p>\n</blockquote>\n<ul>\n<li><p>Multiple <code class=\"codespan\">dataZoom</code> components can exist at the same time to control function together. Components controling the same axis will be connected automatically. The example below explains in detail.</p>\n</li>\n<li><p>Operation principle of <code class=\"codespan\">dataZoom</code> achieves <em>data window zooming</em> through <em>data filtering</em>.</p>\n<p>  Different settings of data filtering modes lead to different data window zooming effects, please see: <a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a>.</p>\n</li>\n<li><p>Setting of <code class=\"codespan\">dataZoom</code> data window range supports two formats currently:</p>\n<ul>\n<li><p>Percentage: see <a href=\"option.html#dataZoom.start\" target=\"_blank\">dataZoom.start</a> and <a href=\"option.html#dataZoom.end\" target=\"_blank\">dataZoom.end</a>.</p>\n</li>\n<li><p>Absolute value: see <a href=\"option.html#dataZoom.startValue\" target=\"_blank\">dataZoom.startValue</a> and <a href=\"option.html#dataZoom.endValue\" target=\"_blank\">dataZoom.endValue</a>.</p>\n</li>\n</ul>\n</li>\n</ul>\n<p><strong>dataZoom component supports several child components: </strong></p>\n<ul>\n<li><p><a href=\"option.html#dataZoom-inside\" target=\"_blank\">Inside data zoom component (dataZoomInside)</a>: inside coordinates.</p>\n</li>\n<li><p><a href=\"option.html#dataZoom-slider\" target=\"_blank\">Slider data zoom component (dataZoomSlider)</a>: has seperate slide option.</p>\n</li>\n<li><p><a href=\"option.html#toolbox.feature.dataZoom\" target=\"_blank\">Select data zoom component (dataZoomSelect)</a>: full-screen box for zoom data area. Entrance and configuration item are both in <code class=\"codespan\">toolbox</code>.</p>\n</li>\n</ul>\n<h2 id=\"adding-datazoom-component\">Adding dataZoom component</h2>\n<p>First, only add dataZoom component to x-axis. Following examples shows the code.</p>\n<pre><code class=\"lang-javascript\">\noption = {\n    xAxis: {\n        type: &#39;value&#39;\n    },\n    yAxis: {\n        type: &#39;value&#39;\n    },\n    dataZoom: [\n        {   // This dataZoom component controls x-axis by dafault\n            type: &#39;slider&#39;, // this dataZoom component is dataZoom component of slider\n            start: 10,      // the left is located at 10%\n            end: 60         // the right is located at 60%\n        }\n    ],\n    series: [\n        {\n            type: &#39;scatter&#39;, // this is scatter chart\n            itemStyle: {\n                opacity: 0.8\n            },\n            symbolSize: function (val) {\n                return val[2] * 40;\n            },\n            data: [[&quot;14.616&quot;,&quot;7.241&quot;,&quot;0.896&quot;],[&quot;3.958&quot;,&quot;5.701&quot;,&quot;0.955&quot;],[&quot;2.768&quot;,&quot;8.971&quot;,&quot;0.669&quot;],[&quot;9.051&quot;,&quot;9.710&quot;,&quot;0.171&quot;],[&quot;14.046&quot;,&quot;4.182&quot;,&quot;0.536&quot;],[&quot;12.295&quot;,&quot;1.429&quot;,&quot;0.962&quot;],[&quot;4.417&quot;,&quot;8.167&quot;,&quot;0.113&quot;],[&quot;0.492&quot;,&quot;4.771&quot;,&quot;0.785&quot;],[&quot;7.632&quot;,&quot;2.605&quot;,&quot;0.645&quot;],[&quot;14.242&quot;,&quot;5.042&quot;,&quot;0.368&quot;]]\n        }\n    ]\n}\n</code></pre>\n<p>which will show the following result:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-1&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p><br></p>\n<p>The chart above can only change window by dragging dataZoom component. If you want to drag in coordinate, or use mouse wheel (or slides with two fingers on mobile) to zoom, then another inside dataZoom component needs to be added. You can just add in the <code class=\"codespan\">option.dataZoom</code> above:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {   // this dataZoom component controls x-axis by dafault\n            type: &#39;slider&#39;, // this dataZoom component is dataZoom component of slider\n            start: 10,      // the left is located at 10%\n            end: 60         // the right is located at 60%\n        },\n        {   // This dataZoom component controls x-axis by dafault\n            type: &#39;inside&#39;, // this dataZoom component is dataZoom component of inside\n            start: 10,      // the left is located at 10%\n            end: 60         // the right is located at 60%\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>Following results can be seen (you can now slide or use mouse wheel to zoom in coordinate) :</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-2&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<p><br></p>\n<p>If you want to enable zooming on y-axis, then you need to add dataZoom componet on y-axis:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {\n            type: &#39;slider&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;inside&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;slider&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        },\n        {\n            type: &#39;inside&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>Following result can be seen:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-3&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n\n\n\n\n\n"},"Responsive Mobile-End":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> works in DOM nodes with user defined width and height. ECharts <em>component</em> and <em>series</em> are both in this DOM node, whose location can be assigned by user seperately. Inner components of charts are not suitable for implementing DOM flow layout. Instead, we use a simpler and more understandable layout similar to absolute layout. But sometimes when container is of extreme size, this method cannot avoid component overlapping automatically, especially on small screens on mobile-end.</p>\n<p>Besides, sometimes one chart may need to be displayed on both PC and mobile-end, which involves the ability of ECharts inner components to be responsive with different container sizes.</p>\n<p>To solve this problem, ECharts improved component location algorithm, and implemented responsive ability similar to <a href=\"https://www.w3.org/TR/css3-mediaqueries/\" target=\"_blank\">CSS Media Query</a>.</p>\n<h2 id=\"location-and-layout-of-echarts-components\">Location and layout of ECharts components</h2>\n<p>Most <em>component</em> and <em>series</em> follow two locating methods:</p>\n<p><br>\n<strong>left/right/top/bottom/width/height locating method:</strong></p>\n<p>Each of those six parameters can be <em>absolute value</em> or <em>percentage</em> or <em>location description</em>.</p>\n<ul>\n<li><p>Absolute value</p>\n<p>  in browser pixels (px); in form of <code class=\"codespan\">number</code> (no unit); e.g.: <code class=\"codespan\">{left: 23, height: 400}</code>.</p>\n</li>\n<li><p>Percentage</p>\n<p>  to the width and height of DOM container; in form of <code class=\"codespan\">string</code>; e.g.: <code class=\"codespan\">{right: &#39;30%&#39;, bottom: &#39;40%&#39;}</code>.</p>\n</li>\n<li><p>Location Description</p>\n<ul>\n<li>can be set to <code class=\"codespan\">left: &#39;center&#39;</code>, for horizontally centering.</li>\n<li>can be set to <code class=\"codespan\">top: &#39;middle&#39;</code>, for vertically centering.</li>\n</ul>\n</li>\n</ul>\n<p>The concept of these six parameters is similar to that in CSS:</p>\n<ul>\n<li>left: distance to left border of DOM container.</li>\n<li>right: distance to right border of DOM container.</li>\n<li>top: distance to top border of DOM container.</li>\n<li>bottom: distance to bottom border of DOM container.</li>\n<li>width: width.</li>\n<li>height: height.</li>\n</ul>\n<p>Two out of the three horizontal parameters, <code class=\"codespan\">left</code>, <code class=\"codespan\">right</code>, <code class=\"codespan\">width</code>, are enough to determine the component location. For example, <code class=\"codespan\">left</code> and <code class=\"codespan\">right</code>, or <code class=\"codespan\">right</code> and <code class=\"codespan\">width</code> can both determine component location and size.\nThe same goes for vertical paramters <code class=\"codespan\">top</code>, <code class=\"codespan\">bottom</code> and <code class=\"codespan\">height</code>.</p>\n<p><br>\n<strong>Locating method of <code class=\"codespan\">center</code> / <code class=\"codespan\">radius</code>: </strong></p>\n<ul>\n<li><p><code class=\"codespan\">center</code></p>\n<p>  an array in form of <code class=\"codespan\">[x, y]</code>, in which <code class=\"codespan\">x</code> and <code class=\"codespan\">y</code> can either be <em>absolute value</em> or <em>percentage</em>, as described above.</p>\n</li>\n<li><p><code class=\"codespan\">radius</code></p>\n<p>  an array in form of <code class=\"codespan\">[innerRadius, outerRadius]</code>, in which <code class=\"codespan\">innerRadius</code> and <code class=\"codespan\">outerRadius</code> can either be <em>absolute value</em> or <em>percentage</em>, as described above.</p>\n<p>  Percentage location turns out to be very useful for responsive positioning.</p>\n</li>\n</ul>\n<p><br>\n<strong>Horizontal and vertical</strong></p>\n<p>Most of ECharts&#39;s long and narrow components (such as <code class=\"codespan\">legend</code>,<code class=\"codespan\">visualMap</code>,<code class=\"codespan\">dataZoom</code>,<code class=\"codespan\">timeline</code> and so on), provide option to set them to be horizontal or vertical. For example, long and narrow screen of mobile-end, vertical layout may be a more suitable choice, while horizontal may more suit for PC&#39;s wide screen.</p>\n<p>Setting of horizontal or vertical layout is usually with component or series&#39;s <code class=\"codespan\">orient</code> or <code class=\"codespan\">layout</code> option, which can be set to <code class=\"codespan\">&#39;horizontal&#39;</code> or <code class=\"codespan\">&#39;vertical&#39;</code>.</p>\n<p><br>\n<strong>Compatibility with ECharts2: </strong></p>\n<p>Naming of <code class=\"codespan\">x/x2/y/y2</code> in ECharts2 is still compatible, as well as the newly added <code class=\"codespan\">left/right/top/bottom</code>. But <code class=\"codespan\">left/right/top/bottom</code> is recommended.</p>\n<p>To be compatible with ECharts2, there may be settings that seems to be odd, e.g.: <code class=\"codespan\">left: &#39;right&#39;</code>, <code class=\"codespan\">left: &#39;left&#39;</code>, <code class=\"codespan\">top: &#39;bottom&#39;</code>, <code class=\"codespan\">top: &#39;top&#39;</code>, which are equal to: <code class=\"codespan\">right: 0</code>, <code class=\"codespan\">left: 0</code>, <code class=\"codespan\">bottom: 0</code>, <code class=\"codespan\">top: 0</code>, in a more normal expression.</p>\n<h2 id=\"media-query\">Media Query</h2>\n<p><a href=\"https://www.w3.org/TR/css3-mediaqueries/#media1\" target=\"_blank\">Media Query</a> provides the ability to be responsive with container size.</p>\n<p>As shown in the following example, you may drag <strong>the circle in bottom-right corner</strong> to see the legend and series change layout position and method with container size.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-media&edit=1&reset=1\" width=\"750\" height=\"600\" ></iframe>\n\n\n<p>The following format should be followed if you need to set Media Query in option:</p>\n<pre><code class=\"lang-javascript\">option = {\n    baseOption: { // here defines base option\n        title: {...},\n        legend: {...},\n        series: [{...}, {...}, ...],\n        ...\n    },\n    media: [ // each rule of media query is defined here\n        {\n            query: {...},   // write rule here\n            option: {       // write options accordingly\n                legend: {...},\n                ...\n            }\n        },\n        {\n            query: {...},   // the second rule\n            option: {       // the second option\n                legend: {...},\n                ...\n            }\n        },\n        {                   // default with no rules,\n            option: {       // when all rules fail, use this option\n                legend: {...},\n                ...\n            }\n        }\n    ]\n};\n</code></pre>\n<p>In the above example, <code class=\"codespan\">baseOption</code> and every option in <code class=\"codespan\">media</code> are all <em>simple options</em>, which are regular options containing components and series. <code class=\"codespan\">baseOption</code> is always be used, while options of every will be merged with <code class=\"codespan\">chart.mergeOption()</code> when given <code class=\"codespan\">query</code> condition is satisfied with.</p>\n<p><strong>query: </strong></p>\n<p>A <code class=\"codespan\">query</code> is in the following format:</p>\n<pre><code class=\"lang-javascript\">{\n    minWidth: 200,\n    maxHeight: 300,\n    minAspectRatio: 1.3\n}\n</code></pre>\n<p>Currently there are three supported attributes:<code class=\"codespan\">width</code>, <code class=\"codespan\">height</code>, <code class=\"codespan\">aspectRatio</code> (length-to-width ratio), each of which can add <code class=\"codespan\">min</code> or <code class=\"codespan\">max</code> as prefix. E.g., <code class=\"codespan\">minWidth: 200</code> stands for when width is greater than or equal to 200px. When two attributes are written together, it means <em>and</em> in Bool logic. For example, <code class=\"codespan\">{minWidth: 200, maxHeight: 300}</code> stands for when width is greater than or equal to 200px and height is smaller than or equal to 300px.</p>\n<p><strong>option: </strong></p>\n<p>Since option in <code class=\"codespan\">media</code> is <em>simple option</em>, technically speaking, you can write every option configuration item. But usually we only write those related to layout. Take part of the above query option as example:</p>\n<pre><code class=\"lang-javascript\">media: [\n    ...,\n    {\n        query: {\n            maxAspectRatio: 1           // when length-to-width ratio is less than 1\n        },\n        option: {\n            legend: {                   // legend is placed in middle-bottom\n                right: &#39;center&#39;,\n                bottom: 0,\n                orient: &#39;horizontal&#39;    // horizontal layout of legend\n            },\n            series: [                   // left and right layout of two pie charts\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;70%&#39;]\n                }\n            ]\n        }\n    },\n    {\n        query: {\n            maxWidth: 500               // when container width is smaller than 500\n        },\n        option: {\n            legend: {\n                right: 10,              // legend is placed in middle-right\n                top: &#39;15%&#39;,\n                orient: &#39;vertical&#39;      // vertical layout\n            },\n            series: [                   // top and bottom layout of two pie charts\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;75%&#39;]\n                }\n            ]\n        }\n    },\n    ...\n]\n</code></pre>\n<p><strong>Priority when multiple queries are satisfied: </strong></p>\n<p>Attention: When multiple <code class=\"codespan\">query</code> are satisfied at the same time, all of them will be merged with <code class=\"codespan\">mergeOption</code> and those are defined later will be merged later, thus provides them with higher priority.</p>\n<p><strong>Query by default: </strong></p>\n<p>If an item in <code class=\"codespan\">media</code> has no not <code class=\"codespan\">query</code>, then it means <em>default value</em>, which will be used when all other rules fail.</p>\n<p><strong>Pay attention when container size changes:</strong></p>\n<p>In many cases, container DOM node doesn&#39;t need to change size with user dragging. Instead, it may set to several sizes on varied ends.</p>\n<p>But if the container DOM node needs to change size with dragging, you need to pay attention to this: if certain configuration item appears in one <code class=\"codespan\">query option</code>, then it should also appeared in other <code class=\"codespan\">query option</code>, or it will not be able to return to the original state. (<code class=\"codespan\">left/right/top/bottom/width/height</code> are not restricted to this rule.)</p>\n<p><strong><code class=\"codespan\">media</code> in <em>composite option</em> does not support merge</strong></p>\n<p>When <code class=\"codespan\">chart.setOption(rawOption)</code> for the second, third, fourth, fifth, and etc. times, if <code class=\"codespan\">rawOption</code> is <code class=\"codespan\">composite option</code> (which means it contains <code class=\"codespan\">media</code> list), then, the new <code class=\"codespan\">rawOption.media</code> list will not merge with the old <code class=\"codespan\">media</code>. instead, it will simply replace the option. Of course, <code class=\"codespan\">rawOption.baseOption</code> will still merge with the old option normally.</p>\n<p><br>\nFinally, let&#39;s see an example combining with timeline:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/bar-media-timeline&edit=1&reset=1\" width=\"750\" height=\"700\" ></iframe>\n\n\n\n\n\n\n"},"Visual Map of Data":{"type":["*"],"description":"<p>Data visualization is a procedure of mapping data into visual elements. This procedure can also be called visual coding, and visual elements can also be called visual tunnels.</p>\n<p>Every type of charts in Apache ECharts (incubating)<sup>TM</sup> has this built-in mapping procedure. For example, line charts map data into <em>lines</em>, bar charts map data into <em>length</em>. Some more complicated charts, like <code class=\"codespan\">graph</code>, <code class=\"codespan\">themeRiver</code>, and <code class=\"codespan\">treemap</code> have their own built-in mapping.</p>\n<p>Besides, ECharts provides <a href=\"option.html#visualMap\" target=\"_blank\">visualMap component</a> for general visual mapping. Visual elements allowed in <code class=\"codespan\">visualMap</code> component are:<br>\n<code class=\"codespan\">symbol</code>, <code class=\"codespan\">symbolSize</code><br>\n<code class=\"codespan\">color</code>, <code class=\"codespan\">opacity</code>, <code class=\"codespan\">colorAlpha</code>, <br>\n<code class=\"codespan\">colorLightness</code>, <code class=\"codespan\">colorSaturation</code>, <code class=\"codespan\">colorHue</code></p>\n<p>Next, we are going to introduce how to use <code class=\"codespan\">visualMap</code> component.</p>\n<h2 id=\"data-and-dimension\">Data and Dimension</h2>\n<p>Data are usually stored in <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> in ECharts. Depending on chart types, like list, tree, graph, and so on, the form of data may vary somehow. But they have one common feature, that they are a collection of <code class=\"codespan\">dataItem</code>s. Every data item contains data value, and other information if needed. Every data value can be a single value (one dimension) or an array (multiple dimensions).</p>\n<p>For example, <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> is the most common form, which is a <code class=\"codespan\">list</code>, a common array:</p>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {       // every item here is a dataItem\n            value: 2323, // this is data value\n            itemStyle: {...}\n        },\n        1212,   // it can also be a value of dataItem, which is a more common case\n        2323,   // every data value here is one dimension\n        4343,\n        3434\n    ]\n}\n</code></pre>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {                        // every item here is a dataItem\n            value: [3434, 129,  &#39;San Marino&#39;], // this is data value\n            itemStyle: {...}\n        },\n        [1212, 5454, &#39;Vatican&#39;],   // it can also be a value of dataItem, which is a more common case\n        [2323, 3223, &#39;Nauru&#39;],     // every data value here is three dimension\n        [4343, 23,   &#39;Tuvalu&#39;]    // If is scatter chart, usually map the first dimension to x axis,\n                                 // the second dimension to y axis,\n                                 // and the third dimension to symbolSize\n    ]\n}\n</code></pre>\n<p>Usually the first one or two dimensions are used for mapping. For example, map the first dimension to x axis, and the second dimension to y axis. If you want to represent more dimensions, <code class=\"codespan\">visualMap</code> is what you need. Most likely, <a href=\"option.html#series-scatter\" target=\"_blank\">scatter charts</a> use radius to represent the third dimension.</p>\n<h2 id=\"visualmap-component\">visualMap Component</h2>\n<p>visualMap component defines the mapping from <em>which dimension of data</em> to <em>what visual elements</em>.</p>\n<p>The following two types of visualMap components are supported, identified with <a href=\"option.html#visualMap.type\" target=\"_blank\">visualMap.type</a>.</p>\n<p>Its structure is defined as:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [ // can define multiple visualMap components at the same time\n        { // the first visualMap component\n            type: &#39;continuous&#39;, // defined as continuous visualMap\n            ...\n        },\n        { // the second visualMap component\n            type: &#39;piecewise&#39;, // defined as discrete visualMap\n            ...\n        }\n    ],\n    ...\n};\n</code></pre>\n<p><br>\n<a href=\"option.html#visualMap-continuous\" target=\"_blank\">visualMapContinuous</a>:</p>\n<p><a href=\"option.html#visualMap-piecewise\" target=\"_blank\">visualMapPiecewise</a>:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-visualMap-piecewise&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<p>Piecewise visual map component(visualMapPiecewise)has three types:</p>\n<ul>\n<li>Equal division of continuous data: divide equally based on <a href=\"option.html#visualMap-piecewise.splitNumber\" target=\"_blank\">visualMap-piecewise.splitNumber</a>;</li>\n<li>User-defined division of continuous data: divide with range in <a href=\"option.html#visualMap-piecewise.pieces\" target=\"_blank\">visualMap-piecewise.pieces</a>;</li>\n<li>Discrete data (data in category type): divide with <a href=\"option.html#visualMap-piecewise.categories\" target=\"_blank\">visualMap-piecewise.categories</a>.</li>\n</ul>\n<p><br>\n<strong>Configuration of visualMap mapping method</strong></p>\n<p>As we have introduced above, <code class=\"codespan\">visualMap</code> maps a certain dimension to a certain visual element, we can configure which dimension of the data (see in <a href=\"#visualMap.dimension\">visualMap.dimension</a>) to be mapped to which visual elements (see in <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> and <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>).</p>\n<p>Example A:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            type: &#39;piecewise&#39;,\n            min: 0,\n            max: 5000,\n            dimension: 3,       // the fourth dimension of series.data, or value[3], is mapped\n            seriesIndex: 4,     // map with the fourth series\n            inRange: {          // visual configuration items in selected range\n                color: [&#39;blue&#39;, &#39;#121122&#39;, &#39;red&#39;], // defines color list of mapping\n                                                   // The largest value will be mapped to &#39;red&#39;,\n                                                   // and others will be interpolated\n                symbolSize: [30, 100]              // the smallest value will be mapped to size of 30,\n                                                   // the largest to 100,\n                                                   // and others will be interpolated\n            },\n            outOfRange: {       // visual configuration items out of selected range\n                symbolSize: [30, 100]\n            }\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>Example B:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            ...,\n            inRange: {          // visual configuration items in selected range\n                colorLightness: [0.2, 1], // map to lightness, which will process lightness based on original color\n                                          // original color may be selected from global color palette,\n                                          // which is not concerned by visualMap component\n                symbolSize: [30, 100]\n            },\n            ...\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>For more information, please refer to <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> and <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>.</p>\n"},"Events and Actions in ECharts":{"type":["*"],"description":"<p>User interactions trigger corresponding events in Apache ECharts (incubating)<sup>TM</sup>. Developers can listen to these events and handle accordingly through callback functions, e.g., redirecting to an address, popping out a dialog box, or drilling down data and so on.</p>\n<p>Binding events in ECharts 3 is though <a href=\"api.html#EChartsInstance.on\" target=\"_blank\">on</a> method, same as in ECharts 2. But event names are much simpler than it is in 2. Event names in ECharts 3 are the same as DOM event names, in lowercases. Below is an example of binding clicking operation.</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    // printing data name in console\n    console.log(params.name);\n});\n</code></pre>\n<p>Event in ECharts can be divided in two kinds. One is mouse event, which is triggered when mouse clicks on certain component, the other is triggered with interaction components, such as triggering <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;legendselectchanged&#39;</a> event when toggling legend (Notice here, that <code class=\"codespan\">&#39;legendselected&#39;</code> event will not be triggered when toggling legend), triggering <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;datazoom&#39;</a> event when data zooming in some area.</p>\n<h2 id=\"mouse-events-handling\">Mouse Events Handling</h2>\n<p>ECharts support regular mouse events, which includes <code class=\"codespan\">&#39;click&#39;</code>, <code class=\"codespan\">&#39;dblclick&#39;</code>, <code class=\"codespan\">&#39;mousedown&#39;</code>, <code class=\"codespan\">&#39;mousemove&#39;</code>, <code class=\"codespan\">&#39;mouseup&#39;</code>, <code class=\"codespan\">&#39;mouseover&#39;</code>, <code class=\"codespan\">&#39;mouseout&#39;</code>, <code class=\"codespan\">&#39;globalout&#39;</code>, <code class=\"codespan\">&#39;contextmenu&#39;</code>. Next let&#39;s see an example of opening Baidu search page when clicks a bar chart.</p>\n<pre><code class=\"lang-js\">// initialize ECharts instance based on prepared dom\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n// data and configuration item of specific chart\nvar option = {\n    xAxis: {\n        data: [&quot;shirt&quot;,&quot;cardign&quot;,&quot;chiffon shirt&quot;,&quot;pants&quot;,&quot;heels&quot;,&quot;socks&quot;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;sales&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n};\n// use specified configuration item and data to show chart\nmyChart.setOption(option);\n// handle click event and redirect to corresponding Baidu search page\nmyChart.on(&#39;click&#39;, function (params) {\n    window.open(&#39;https://www.baidu.com/s?wd=&#39; + encodeURIComponent(params.name));\n});\n</code></pre>\n<p>All types of mouse events have a common parameter called <code class=\"codespan\">params</code>, which is an object that contains data information of the clicked chart, whose format is as followed:</p>\n<pre><code class=\"lang-js\">{\n    // component name of clicked component\n    // e.g., &#39;series&#39;, &#39;markLine&#39;, &#39;markPoint&#39;, &#39;timeLine&#39;\n    componentType: string,\n    // series type (useful when componentType is &#39;series&#39;)\n    // e.g., &#39;line&#39;, &#39;bar&#39;, &#39;pie&#39;\n    seriesType: string,\n    // series index in option.series (useful when componentType is &#39;series&#39;)\n    seriesIndex: number,\n    // series name (useful when componentType is &#39;series&#39;)\n    seriesName: string,\n    // data name, or category name\n    name: string,\n    // data index in input data array\n    dataIndex: number,\n    // raw input data item\n    data: Object,\n    // Some series, such as sankey or graph, maintains both nodeData and edgeData,\n    // in which case, dataType is set to be &#39;node&#39; or &#39;edge&#39; to identify.\n    // On the other hand, most other series have only one type of data,\n    // where dataType is not needed.\n    dataType: string,\n    // input data value\n    value: number|Array\n    // color of component (useful when componentType is &#39;series&#39;)\n    color: string\n}\n</code></pre>\n<p>How to know where the mouse clicked:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    if (params.componentType === &#39;markPoint&#39;) {\n        // clicked on markPoint\n        if (params.seriesIndex === 5) {\n            // clicked on a markPoint which belongs to a series indexed with 5\n        }\n    }\n    else if (params.componentType === &#39;series&#39;) {\n        if (params.seriesType === &#39;graph&#39;) {\n            if (params.dataType === &#39;edge&#39;) {\n                // clicked on an edge of the graph\n            }\n            else {\n                // clicked on a node of the graph\n            }\n        }\n    }\n});\n</code></pre>\n<p>Use <code class=\"codespan\">query</code> to call handler only on the graphic elements of the specified components:</p>\n<pre><code class=\"lang-js\">chart.on(eventName, query, handler);\n</code></pre>\n<p><code class=\"codespan\">query</code> can be <code class=\"codespan\">string</code> or <code class=\"codespan\">Object</code>.</p>\n<p>If <code class=\"codespan\">string</code>, the formatter can be &#39;mainType&#39; or &#39;mainType.subType&#39;. For example:</p>\n<pre><code class=\"lang-js\">chart.on(&#39;click&#39;, &#39;series&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;series.line&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;dataZoom&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;xAxis.category&#39;, function () {...});\n</code></pre>\n<p>If <code class=\"codespan\">Object</code>, one or more properties below can be included, and any of them is optional.</p>\n<pre><code class=\"lang-js\">{\n    &lt;mainType&gt;Index: number // component index\n    &lt;mainType&gt;Name: string // component name\n    &lt;mainType&gt;Id: string // component id\n    dataIndex: number // data item index\n    name: string // data item name\n    dataType: string // data item type, e.g.,\n                     // &#39;node&#39; and &#39;edge&#39; in graph.\n    element: string // element name in custom series\n}\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        name: &#39;uuu&#39;\n        // ...\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesName: &#39;uuu&#39;}, function () {\n    // When the graphic elements in the series with name &#39;uuu&#39; mouse overed, this method called.\n});\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        // ...\n    }, {\n        // ...\n        data: [\n            {name: &#39;xx&#39;, value: 121},\n            {name: &#39;yy&#39;, value: 33}\n        ]\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesIndex: 1, name: &#39;xx&#39;}, function () {\n    // When the graphic elements of the data item with name &#39;xx&#39; in the series with index 1 mouse overed, this method called.\n});\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        type: &#39;graph&#39;,\n        nodes: [{name: &#39;a&#39;, value: 10}, {name: &#39;b&#39;, value: 20}],\n        edges: [{source: 0, target: 1}]\n    }]\n});\nchart.on(&#39;click&#39;, {dataType: &#39;node&#39;}, function () {\n    // When the nodes of the graph clicked, this method is called.\n});\nchart.on(&#39;click&#39;, {dataType: &#39;edge&#39;}, function () {\n    // When the edges of the graph clicked, this method is called.\n});\n</code></pre>\n<p>For example:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        // ...\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;,\n                    name: &#39;my_el&#39;,\n                    // ...\n                }, {\n                    // ...\n                }]\n            }\n        },\n        data: [[12, 33]]\n    }\n})\nchart.on(&#39;click&#39;, {element: &#39;my_el&#39;}, function () {\n    // When the element with name &#39;my_el&#39; clicked, this method called.\n});\n</code></pre>\n<p>You may update chart or show customized layer with information got from your own data warehouse, indexed from data name or series name of an object received from a callback function. Sample code is shown as followed:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (parmas) {\n    $.get(&#39;detail?q=&#39; + params.name, function (detail) {\n        myChart.setOption({\n            series: [{\n                name: &#39;pie&#39;,\n                // present data distribution  of a single bar through pie chart\n                data: [detail.data]\n            }]\n        });\n    });\n});\n</code></pre>\n<h2 id=\"interaction-events-with-components\">Interaction Events with Components</h2>\n<p>Basically all component interactions in ECharts trigger corresponding events. Frequently used events and corresponding parameters are listed in <a href=\"api.html#events\" target=\"_blank\">events</a>.</p>\n<p>Below is example that listens to a legend toggling:</p>\n<pre><code class=\"lang-js\">// legend toggling triggers legendselectchanged event only\nmyChart.on(&#39;legendselectchanged&#39;, function (params) {\n    // obtain selecting status of clicked legend\n    var isSelected = params.selected[params.name];\n    // print in console\n    console.log((isSelected ? &#39;select&#39; : &#39;unselect&#39;) + &#39;legend&#39; + params.name);\n    // print all legend status\n    console.log(params.selected);\n});\n</code></pre>\n<h2 id=\"triggering-component-actions-through-code-in-echarts\">Triggering Component Actions through Code in ECharts</h2>\n<p>Actions like <code class=\"codespan\">&#39;legendselectchanged&#39;</code> mentioned above will be triggered by component interaction. Besides that, sometimes we need to trigger certain actions in our program, such as showing tooltip, or selecting legend.</p>\n<p>ECharts 2.x triggers actions through <code class=\"codespan\">myChart.component.tooltip.showTip</code>, whose entrance is deep and involves organization of inner components. On the other hand, ECharts 3 triggers actions through <code class=\"codespan\">myChart.dispatchAction({ type: &#39;&#39; })</code>, which manages all actions in a uniformed way, and may record user&#39;s event path when need.</p>\n<p>Frequently used actions and the parameters are listed in <a href=\"api.html#action\" target=\"_blank\">action</a>.</p>\n<p>Below displays how to highlight each sector of pie chart in turn through <code class=\"codespan\">dispatchAction</code>.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-highlight&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n\n"},"An Example: Implement Dragging":{"type":["*"],"description":"<p>This is a tiny example, introducing how to implement dragging of graphic elements in Apache ECharts (incubating)<sup>TM</sup>. From this example, we will see how to make an application with rich intractivity based on echarts API.</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=line-draggable&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>This example mainly implements that dragging points of a curve and by which the curve is modified. Although it is simple example, but we can do more based on that, like edit charts viually. So let&#39;s get started from this simple example.</p>\n<h2 id=\"-part-1-implement-basic-dragging\">[ Part 1 ] Implement basic dragging</h2>\n<p>First of all, we create a basic <a href=\"option.html#series-line\" target=\"_blank\">line chart (line series)</a>:</p>\n<pre><code class=\"lang-js\">var symbolSize = 20;\nvar data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\nmyChart.setOption({\n    xAxis: {\n        min: -100,\n        max: 80,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    yAxis: {\n        min: -30,\n        max: 60,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    series: [\n        {\n            id: &#39;a&#39;,\n            type: &#39;line&#39;,\n            smooth: true,\n            // Set a big symbolSize for dragging convenience.\n            symbolSize: symbolSize,\n            data: data\n        }\n    ]\n});\n</code></pre>\n<p>Since the symbols in line is not draggable, we make them draggable by using <a href=\"option.html#graphic\" target=\"_blank\">graphic component</a> to add draggable circular elements to symbols respectively.</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    // Declare a graphic component, which contains some graphic elements\n    // with the type of &#39;circle&#39;.\n    // Here we have used the method `echarts.util.map`, which has the same\n    // behavior as Array.prototype.map, and is compatible with ES5-.\n    graphic: echarts.util.map(data, function (dataItem, dataIndex) {\n        return {\n            // &#39;circle&#39; means this graphic element is a shape of circle.\n            type: &#39;circle&#39;,\n\n            shape: {\n                // The radius of the circle.\n                r: symbolSize / 2\n            },\n            // Transform is used to located the circle. position:\n            // [x, y] means translate the circle to the position [x, y].\n            // The API `convertToPixel` is used to get the position of\n            // the circle, which will introduced later.\n            position: myChart.convertToPixel(&#39;grid&#39;, dataItem),\n\n            // Make the circle invisible (but mouse event works as normal).\n            invisible: true,\n            // Make the circle draggable.\n            draggable: true,\n            // Give a big z value, which makes the circle cover the symbol\n            // in line series.\n            z: 100,\n            // This is the event handler of dragging, which will be triggered\n            // repeatly while dragging. See more details below.\n            // A util method `echarts.util.curry` is used here to generate a\n            // new function the same as `onPointDragging`, except that the\n            // first parameter is fixed to be the `dataIndex` here.\n            ondrag: echarts.util.curry(onPointDragging, dataIndex)\n        };\n    })\n});\n</code></pre>\n<p>In the code above, API <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a> is used to convert data to its &quot;pixel coodinate&quot;, based on which each graphic elements can be rendered on canvas. The term &quot;pixel coodinate&quot; means the coordinate is in canvas pixel, whose origin is the top-left of the canvas. In the sentence <code class=\"codespan\">myChart.convertToPixel(&#39;grid&#39;, dataItem)</code>, the first parameter <code class=\"codespan\">&#39;grid&#39;</code> indicates that <code class=\"codespan\">dataItem</code> should be converted in the first <a href=\"option.html#grid\" target=\"_blank\">grid component (cartesian)</a>.</p>\n<p><strong>Notice:</strong> <code class=\"codespan\">convertToPixel</code> should not be called before the first time that <code class=\"codespan\">setOption</code> called. Namely, it can only be used after coordinate systems (grid/polar/...) initialized.</p>\n<p>Now points have been made draggable. Then we will bind event listeners on dragging to those points.</p>\n<pre><code class=\"lang-js\">// This function will be called repeatly while dragging.\n// The mission of this function is to update `series.data` based on\n// the new points updated by dragging, and to re-render the line\n// series based on the new data, by which the graphic elements of the\n// line series can be synchronized with dragging.\nfunction onPointDragging(dataIndex) {\n    // Here the `data` is declared in the code block in the beginning\n    // of this article. The `this` refers to the dragged circle.\n    // `this.position` is the current position of the circle.\n    data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n    // Re-render the chart based on the updated `data`.\n    myChart.setOption({\n        series: [{\n            id: &#39;a&#39;,\n            data: data\n        }]\n    });\n}\n</code></pre>\n<p>In the code above, API <a href=\"api.html#echartsInstance.convertFromPixel\" target=\"_blank\">convertFromPixel</a> is used, which is the reversed process of <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a>. <code class=\"codespan\">myChart.convertFromPixel(&#39;grid&#39;, this.position)</code> converts a pixel coordinate to data item in <a href=\"option.html#grid\" target=\"_blank\">grid (cartesian)</a>.</p>\n<p>Finally, add those code to make graphic elements responsive to change of canvas size.</p>\n<pre><code class=\"lang-js\">window.addEventListener(&#39;resize&#39;, function () {\n    // Re-calculate the position of each circle and update chart using `setOption`.\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                position: myChart.convertToPixel(&#39;grid&#39;, item)\n            };\n        })\n    });\n});\n\n</code></pre>\n<h2 id=\"-part-2-add-tooltip-component\">[ Part 2 ] Add tooltip component</h2>\n<p>Now basic functionality have been implemented by parte 1. If we need the data can be displayed realtime when dragging, we can use <a href=\"option.html#tooltip\" target=\"_blank\">tooltip component</a> to do that. Nevertheless, tooltip component has its default &quot;show/hide rule&quot;, which is not applicable in this case. So we need to customize the &quot;show/hide rule&quot; for our case.</p>\n<p>Add these snippets to the code block above:</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    ...,\n    tooltip: {\n        // Means disable default &quot;show/hide rule&quot;.\n        triggerOn: &#39;none&#39;,\n        formatter: function (params) {\n            return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n        }\n    }\n});\n</code></pre>\n<pre><code class=\"lang-js\">myChart.setOption({\n    graphic: echarts.util.map(data, function (item, dataIndex) {\n        return {\n            type: &#39;circle&#39;,\n            ...,\n            // Customize &quot;show/hide rule&quot;, show when mouse over, hide when mouse out.\n            onmousemove: echarts.util.curry(showTooltip, dataIndex),\n            onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n        };\n    })\n});\n\nfunction showTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;showTip&#39;,\n        seriesIndex: 0,\n        dataIndex: dataIndex\n    });\n}\n\nfunction hideTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;hideTip&#39;\n    });\n}\n</code></pre>\n<p>The API <a href=\"api.html#echartsInstance.dispatchAction\" target=\"_blank\">dispatchAction</a> is used to show/hide tooltip content, where actions <a href=\"api.html#action.tooltip.showTip\" target=\"_blank\">showTip</a> and <a href=\"api.html#action.tooltip.hideTip\" target=\"_blank\">hideTip</a> is dispatched.</p>\n<h2 id=\"-part-3-full-code\">[ Part 3 ] Full code</h2>\n<p>Full code is shown as follow:</p>\n<pre><code>&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;script src=&quot;dist/echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n\n    var symbolSize = 20;\n    var data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\n    var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n    myChart.setOption({\n        tooltip: {\n            triggerOn: &#39;none&#39;,\n            formatter: function (params) {\n                return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n            }\n        },\n        xAxis: {\n            min: -100,\n            max: 80,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        yAxis: {\n            min: -30,\n            max: 60,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        series: [\n            {\n                id: &#39;a&#39;,\n                type: &#39;line&#39;,\n                smooth: true,\n                symbolSize: symbolSize,\n                data: data\n            }\n        ],\n    });\n\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                type: &#39;circle&#39;,\n                position: myChart.convertToPixel(&#39;grid&#39;, item),\n                shape: {\n                    r: symbolSize / 2\n                },\n                invisible: true,\n                draggable: true,\n                ondrag: echarts.util.curry(onPointDragging, dataIndex),\n                onmousemove: echarts.util.curry(showTooltip, dataIndex),\n                onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n                z: 100\n            };\n        })\n    });\n\n    window.addEventListener(&#39;resize&#39;, function () {\n        myChart.setOption({\n            graphic: echarts.util.map(data, function (item, dataIndex) {\n                return {\n                    position: myChart.convertToPixel(&#39;grid&#39;, item)\n                };\n            })\n        });\n    });\n\n    function showTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;showTip&#39;,\n            seriesIndex: 0,\n            dataIndex: dataIndex\n        });\n    }\n\n    function hideTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;hideTip&#39;\n        });\n    }\n\n    function onPointDragging(dataIndex, dx, dy) {\n        data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n        myChart.setOption({\n            series: [{\n                id: &#39;a&#39;,\n                data: data\n            }]\n        });\n    }\n\n&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre><p><br></p>\n<p>With knowledge introduced above, more feature can be implemented. For example, <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom component</a> can be added to cooperate with the cartesian, or we can make a plotting board on coordinate systems. Use your imagination ~</p>\n"},"Custom Series":{"type":["*"],"description":"<p><a href=\"option.html#series-custom\" target=\"_blank\">custom series</a> is a type of series, which enable develpers to customize graphic elements rendering and generate new types of chart.</p>\n<p>Why does Apache ECharts (incubating)<sup>TM</sup> supports <code class=\"codespan\">custom series</code>?</p>\n<p>There are endless chart types in the world of data visualization, which are not enumerable. Thus only most common used chart types are built-in supported in echarts. For other chart types, it is necessary to provide an approach to make new types of chart for developers. This approach should be as simple as possible, which had better not to bothered developers with some details of implementation, such as creating and deleting graphic elements, transition animation, tooltip supporting, working with <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> or <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>. Having considered the factors above, a solution <a href=\"option.html#series-custom\" target=\"_blank\">custom series</a> is published.</p>\n<p><strong>For example, a &quot;x-range&quot; chart is made by custom sereis:</strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=custom-profile&reset=1&edit=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n<p><strong><a href=\"https://echarts.apache.org/examples/en/index.html#chart-type-custom\" target=\"_blank\">More samples of custom series</a></strong></p>\n<p>Let&#39;s begin the tutorial.</p>\n<h2 id=\"-i-the-method-renderitem\">(I) The method <code class=\"codespan\">renderItem</code></h2>\n<p>The snippet of graphic elements rendering should be written in <code class=\"codespan\">renderItem</code> method my developers. For example:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // ...\n        },\n        data: data\n    }]\n}\n</code></pre>\n<p>In the rendering phase of echarts workflow, <a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> is called respectively for each <code class=\"codespan\">dataItem</code> in <a href=\"option.html#series-custom.data\" target=\"_blank\">series.data</a>. <code class=\"codespan\">renderItem</code> is responsible for build a group of definitions of graphic elements, including graphic type, size, location, style, etc. echarts will then build graphic elements according to those definitions. For example:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // This method will be called for each dataItem repectively.\n            // Notice: it does not ensure that called according to the order\n            // of `dataItem`.\n\n            // Some processes, such as coordinate conversion.\n            // `api.value(0)` is used to retrieve the value on the first\n            // dimension in the current `dataItem`.\n            var categoryIndex = api.value(0);\n            // `api.coord(...)` is used to convert data values to pixel values,\n            // will are necessary for graphic elements rendering.\n            var startPoint = api.coord([api.value(1), categoryIndex]);\n            var endPoint = api.coord([api.value(2), categoryIndex]);\n            // `api.size(...)` is used to calculate the pixel size corresponding to\n            // the a value range that the length is 1 on Y axis.\n            var height = api.size([0, 1])[1] * 0.6;\n\n            // The property `shape` incicates the location and size of thsi\n            // element.\n            // `echarts.graphic.clipRectByRect` is used for clipping the\n            // rectangular when it overflow the bounding box of the current\n            // coordinate system (cartesian).\n            // If the rect is totally clipped, returns undefined.\n            var rectShape = echarts.graphic.clipRectByRect({\n                // position and location of the rectangular.\n                x: startPoint[0],\n                y: startPoint[1] - height / 2,\n                width: endPoint[0] - startPoint[0],\n                height: height\n            }, {\n                // Bounding box of the current cooridinate system (cartesian).\n                x: params.coordSys.x,\n                y: params.coordSys.y,\n                width: params.coordSys.width,\n                height: params.coordSys.height\n            })\n\n            // Returns definitions for the current `dataItem`.\n            return rectShape &amp;&amp; {\n                // &#39;rect&#39; indicates that the graphic element is rectangular.\n                // Can also be &#39;circle&#39;, &#39;sector&#39;, &#39;polygon&#39;, ...\n                type: &#39;rect&#39;,\n                shape: rectShape,\n                // `api.style(...)` is used to obtain style settings, which\n                // includes itemStyle settings in optino and the result of\n                // visual mapping.\n                style: api.style()\n            };\n        },\n        data: [\n            [12, 44, 55, 60], // The first dataItem.\n            [53, 31, 21, 56], // The second dataItem.\n            [71, 33, 10, 20], // The third dataItem.\n            ...\n        ]\n    }]\n}\n</code></pre>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> provides two parameters:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">params</a>:provides info about the current series (such as <code class=\"codespan\">seriesIndex</code>、<code class=\"codespan\">dataIndex</code>, etc.) and data (such as <code class=\"codespan\">dataIndex</code>, <code class=\"codespan\">dataIndexInside</code>, etc.) and coordinate system (such as location and size of bounding box of the current coordinate system)</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">api</a> provides some methods to developers (such as <code class=\"codespan\">api.value()</code>, <code class=\"codespan\">api.coord()</code>).</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> method should return definitions of graphic elements for the current <code class=\"codespan\">dataItem</code>. See <a href=\"option.html#series-custom.renderItem.return\" target=\"_blank\">renderItem.return</a>.</p>\n<p>Generally, the main process of <a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> is that retrieve value from data and convert them to graphic elements on the current coordinate system. Two methods in <a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> are always used in this procedure:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.value\" target=\"_blank\">api.value(...)</a> is used to retrieve value from data. For example, <code class=\"codespan\">api.value(0)</code> retrieve the value of the first dimension in the current data item.</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.coord\" target=\"_blank\">api.coord(...)</a> is used to convert data to coordinate. For example, <code class=\"codespan\">var point = api.coord([api.value(0), api.value(1)])</code> converet the data to the point on the current coordinate system.</li>\n</ul>\n<p>Sometimes <a href=\"option.html#series-custom.renderItem.arguments.api.size\" target=\"_blank\">api.size(...)</a> method is needed, which calculates the size on the coordinate system by a given data range.</p>\n<p>Moreover, <a href=\"option.html#series-custom.renderItem.arguments.api.style\" target=\"_blank\">api.style(...)</a> method can be used to set style. It provides not only the style settings specified in <a href=\"option.html#series-custom.itemStyle\" target=\"_blank\">series.itemStyle</a>, but also the result of visual mapping. This method can also be called like <code class=\"codespan\">api.style({fill: &#39;green&#39;, stroke: &#39;yellow&#39;})</code> to override those style settings.</p>\n<p>Having <code class=\"codespan\">renderItem</code> provided, 90% of the work of creating custom series has been accomplished. The rest of this work is to refine and polish them.</p>\n<h2 id=\"-ii-make-the-extent-of-axes-fit-the-data\">(II) Make the extent of axes fit the data</h2>\n<p>There is axes in some coordinate systems, such as <a href=\"option.html#grid\" target=\"_blank\">cartesian2d (grid)</a>and <a href=\"option.html#polar\" target=\"_blank\">polar</a>. The extent of an axis should fit the data automatically, otherwise the graphic elements would be overflow the bounding box of the coordinate system. So, for example, in <a href=\"option.html#grid\" target=\"_blank\">cartesian2d (grid)</a>, developers should specify that which dimensions correspond to <code class=\"codespan\">x</code> axis and which to <code class=\"codespan\">y</code> axis use the property <a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a>:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            // `dim1` and `dim2` correspond to `x` axis.\n            x: [1, 2],\n            // `dim0` corresponds to `y` axis.\n            y: 0\n        },\n        data: [\n            // dim0  dim1  dim2  dim3\n            [   12,   44,   55,   60   ], // The first dataItem.\n            [   53,   31,   21,   56   ], // The second dataItem.\n            [   71,   33,   10,   20   ], // The third dataItem.\n            ...\n        ]\n    }]\n};\n</code></pre>\n<h2 id=\"-iii-set-tooltip-content\">(III) Set tooltip content</h2>\n<p>Of course <a href=\"option.html#tooltip.formatter\" target=\"_blank\">tooltip.formatter</a> can be used to define the content in tooltip. But it is easier to do that by setting <a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a> and <a href=\"option.html#series-custom.dimensions\" target=\"_blank\">dimensions</a>:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            x: [1, 2],\n            y: 0,\n            // `dim2` and `dim3` will displayed in tooltip.\n            tooltip: [2, 3]\n        },\n        // `dim2` is named as &quot;Age&quot; and `dim3` is named as &quot;Satisfaction&quot;.\n        dimensions: [null, null, &#39;Age&#39;, &#39;Satisfaction&#39;],\n        data: [\n            // dim0  dim1  dim2  dim3\n            [   12,   44,   55,   60   ],\n            [   53,   31,   21,   56   ],\n            [   71,   33,   10,   20   ],\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p><br>\n<br>\n<br></p>\n<hr>\n<p>Several other issues about <code class=\"codespan\">custom series</code> are introduced below.</p>\n<h2 id=\"-iv-shape-clipping-when-overflow-the-coordinates-area\">(IV) Shape clipping when overflow the coordinates area</h2>\n<p>When use <code class=\"codespan\">custom series</code> with <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>, <a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a> usually be set as <code class=\"codespan\">&#39;weakFilter&#39;</code>, which prevent <code class=\"codespan\">dataItem</code> from being filtered when only part of its dimensions are out of the current data window. For example:</p>\n<pre><code class=\"lang-js\">option = {\n    dataZoom: {\n        xAxisIndex: 0,\n        filterMode: &#39;weakFilter&#39;\n    },\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            x: [1, 2],\n            y: 0\n        },\n        data: [\n            // dim0  dim1  dim2  dim3\n            [   12,   44,   55,   60   ], // The first dataItem.\n            [   53,   31,   21,   56   ], // The second dataItem.\n            [   71,   33,   10,   20   ], // The third dataItem.\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p>In the example above, <code class=\"codespan\">dim</code> and <code class=\"codespan\">dim2</code> corresponds to <code class=\"codespan\">x</code> axis, and the <code class=\"codespan\">dataZoom</code> component constrols the data window of <code class=\"codespan\">x</code> axis. If part of a <code class=\"codespan\">dataItem</code> is overflow the extent of <code class=\"codespan\">x</code> axis (the value on <code class=\"codespan\">dim1</code> is overflow and the value on <code class=\"codespan\">dim2</code> is not) while zooming, the <code class=\"codespan\">dataItem</code> will not be filtered if <code class=\"codespan\">dataZoom.filterMode = &#39;weakFilter&#39;</code> set. Thus the <code class=\"codespan\">dataItem</code> can be still rendered (usually be partially rendered by using <code class=\"codespan\">echarts.graphic.clipRectByRect</code> to clip the exceeding part).\nSee the example mentioned above <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-profile\" target=\"_blank\">Profile</a>.</p>\n<h2 id=\"-v-about-dataindex\">(V) About dataIndex</h2>\n<p>Developers had better notice that in <a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">renderItem.arguments.params</a> <code class=\"codespan\">dataIndexInside</code> and <code class=\"codespan\">dataIndex</code> is different:</p>\n<ul>\n<li><code class=\"codespan\">dataIndex</code> is the index of a <code class=\"codespan\">dataItem</code> in the original data.</li>\n<li><code class=\"codespan\">dataIndexInside</code> is the index of a <code class=\"codespan\">dataItem</code> in the current data window (see <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>.</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> uses <code class=\"codespan\">dataIndexInside</code> as the input parameter but not <code class=\"codespan\">dataIndex</code>, because conversion from <code class=\"codespan\">dataIndex</code> to <code class=\"codespan\">dataIndexInside</code> is time-consuming.</p>\n<h2 id=\"-vi-event-listener\">(VI) Event listener</h2>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            // ...\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;\n                    // ...\n                }, {\n                    type: &#39;circle&#39;,\n                    name: &#39;aaa&#39;,\n                    // User specified info, available\n                    // in event handler.\n                    info: 12345,\n                    // ...\n                }]\n            };\n        }\n    }\n});\nchart.on(&#39;click&#39;, {element: &#39;aaa&#39;}, function (params) {\n    // When the element with name &#39;aaa&#39; clicked,\n    // this method called.\n    console.log(params.info);\n});\n</code></pre>\n<h2 id=\"-vii-custom-vector-shapes\">(VII) Custom vector shapes</h2>\n<p><a href=\"http://www.w3.org/TR/SVG/paths.html#PathData\" target=\"_blank\">SVG PathData</a> is supported, which enables to use shapes that are created in vector tool. See <a href=\"option.html#series-custom.renderItem.return_path\" target=\"_blank\">path</a>, and examples: <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-calendar-icon\" target=\"_blank\">icons</a>, <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-gantt-flight\" target=\"_blank\">shapes</a>.</p>\n<p><br></p>\n<p><strong><a href=\"https://echarts.apache.org/examples/en/index.html#chart-type-custom\" target=\"_blank\">More examples about custom series</a></strong></p>\n"},"Rich Text":{"type":["*"],"description":"<p>Rich text can be used in Apache ECharts (incubating)<sup>TM</sup> labels of series, axis or other components. For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=treemap-obama&edit=1&reset=1\" width=\"800\" height=\"550\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<p>More examples:\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=map-labels&amp;edit=1&amp;reset=1\" target=\"_blank\">Map Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=pie-nest&amp;edit=1&amp;reset=1\" target=\"_blank\">Pie Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=gauge-car&amp;edit=1&amp;reset=1\" target=\"_blank\">Gauge</a>.</p>\n<p><br></p>\n<p>Before v3.7, the style options was only able to applied to the whole label text block, and only color and font can be configured, which restricted the expressability of text descriptions.</p>\n<p>Since v3.7, rich text has been supported:</p>\n<ul>\n<li>Box styles (background, border, shadow, etc.), rotation, position of a text block can be specified.</li>\n<li>Styles (color, font, width/height, background, shadow, etc.) and alignment can be customzied on fragments of text.</li>\n<li>Image can be used in text as icon or background.</li>\n<li>Combine these configurations, some special effects can be made, such as simple table, horizontal rule (hr).</li>\n</ul>\n<p>At the beginning, the meanings of two terms that will be used below should be clarified:</p>\n<ul>\n<li>Text Block: The whole block of label text.</li>\n<li>Text fragment: Some piece of text in a text block.</li>\n</ul>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-block-fragment&edit=1&reset=1\" width=\"340\" height=\"240\" ></iframe>\n\n\n\n<h2 id=\"options-about-text\">Options about Text</h2>\n<p>echarts provides plenty of text options, including:</p>\n<ul>\n<li>Basic font style: <code class=\"codespan\">fontStyle</code>, <code class=\"codespan\">fontWeight</code>, <code class=\"codespan\">fontSize</code>, <code class=\"codespan\">fontFamily</code>.</li>\n<li>Fill of text: <code class=\"codespan\">color</code>.</li>\n<li>Stroke of text: <code class=\"codespan\">textBorderColor</code>, <code class=\"codespan\">textBorderWidth</code>.</li>\n<li>Shadow of text: <code class=\"codespan\">textShadowColor</code>, <code class=\"codespan\">textShadowBlur</code>, <code class=\"codespan\">textShadowOffsetX</code>, <code class=\"codespan\">textShadowOffsetY</code>.</li>\n<li>Box size of text block or text fragment: <code class=\"codespan\">lineHeight</code>, <code class=\"codespan\">width</code>, <code class=\"codespan\">height</code>, <code class=\"codespan\">padding</code>.</li>\n<li>Alignment of text block or text fragment: <code class=\"codespan\">align</code>, <code class=\"codespan\">verticalAlign</code>.</li>\n<li>Border, background (color or image) of text block or text fragment: <code class=\"codespan\">backgroundColor</code>, <code class=\"codespan\">borderColor</code>, <code class=\"codespan\">borderWidth</code>, <code class=\"codespan\">borderRadius</code>.</li>\n<li>Shadow of text block or text fragment: <code class=\"codespan\">shadowColor</code>, <code class=\"codespan\">shadowBlur</code>, <code class=\"codespan\">shadowOffsetX</code>, <code class=\"codespan\">shadowOffsetY</code>.</li>\n<li>Position and rotation of text block: <code class=\"codespan\">position</code>, <code class=\"codespan\">distance</code>, <code class=\"codespan\">rotate</code>.</li>\n</ul>\n<p>User can defined styles for text fragment in <code class=\"codespan\">rich</code> property. For example, <a href=\"option.html#series-bar.label.rich\" target=\"_blank\">series-bar.label.rich</a></p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">label: {\n    // Styles defined in &#39;rich&#39; can be applied to some fragments\n    // of text by adding some markers to those fragment, like\n    // `{styleName|text content text content}`.\n    // `&#39;\\n&#39;` is the newline character.\n    formatter: [\n        &#39;{a|Style &quot;a&quot; is applied to this fragment}&#39;\n        &#39;{b|Style &quot;b&quot; is applied to this fragment}This fragment use default style{x|use style &quot;x&quot;}&#39;\n    ].join(&#39;\\n&#39;),\n\n    // Styles for the whole text block are defined here:\n    color: &#39;#333&#39;,\n    fontSize: 5,\n    fontFamily: &#39;Arial&#39;,\n    borderWidth: 3,\n    backgroundColor: &#39;#984455&#39;,\n    padding: [3, 10, 10, 5],\n    lineHeight: 20,\n\n    // Styles for text fragments are defined here:\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<blockquote>\n<p>Notice: <code class=\"codespan\">width</code> 和 <code class=\"codespan\">height</code> only work when <code class=\"codespan\">rich</code> specified.</p>\n</blockquote>\n<h2 id=\"basic-styles-of-text-text-block-and-text-fragment\">Basic Styles of Text, Text Block and Text Fragment</h2>\n<p>Basic font style can be set to text: <code class=\"codespan\">fontStyle</code>, <code class=\"codespan\">fontWeight</code>, <code class=\"codespan\">fontSize</code>, <code class=\"codespan\">fontFamily</code>.</p>\n<p>Fill color and stroke color can be set to text: <code class=\"codespan\">color</code>, <code class=\"codespan\">textBorderColor</code>, <code class=\"codespan\">textBorderWidth</code>.</p>\n<p>Border style and background style can be set to text block: <code class=\"codespan\">borderColor</code>, <code class=\"codespan\">borderWidth</code>, <code class=\"codespan\">backgroundColor</code>, <code class=\"codespan\">padding</code>.</p>\n<p>Border style and background style can be set to text fragment too: <code class=\"codespan\">borderColor</code>, <code class=\"codespan\">borderWidth</code>, <code class=\"codespan\">backgroundColor</code>, <code class=\"codespan\">padding</code>.</p>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-options&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n\n<h2 id=\"label-position\">Label Position</h2>\n<p><code class=\"codespan\">label</code> option can be use in charts like <code class=\"codespan\">bar</code>, <code class=\"codespan\">line</code>, <code class=\"codespan\">scatter</code>, etc. The position of a label, can be specified by <a href=\"option.html#series-scatter.label.position\" target=\"_blank\">label.position</a>、<a href=\"option.html#series-scatter.label.distance\" target=\"_blank\">label.distance</a>.</p>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/label-position&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<blockquote>\n<p>Notice, there are different optional values of <code class=\"codespan\">position</code> by different chart types. And <code class=\"codespan\">distance</code> is not supported in every chart. More detailed info can be checked in <a href=\"option.html\" target=\"_blank\">option doc</a>.</p>\n</blockquote>\n<h2 id=\"label-rotation\">Label Rotation</h2>\n<p>Sometimes label is needed to be rotated. For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-label-rotation&edit=1&reset=1\" width=\"900\" height=\"500\" ></iframe>\n\n\n<p><a href=\"option.html#series-bar.label.align\" target=\"_blank\">align</a> and<a href=\"option.html#series-bar.label.verticalAlign\" target=\"_blank\">verticalAlign</a> can be used to adjust location of label in this scenario.</p>\n<p>Notice, <code class=\"codespan\">align</code> and <code class=\"codespan\">verticalAlign</code> are applied firstly, then rotate.</p>\n<h2 id=\"layout-and-alignment-of-text-fragment\">Layout and Alignment of Text fragment</h2>\n<p>To understand the layout rule, every text fragment can be imagined as a <code class=\"codespan\">inline-block</code> dom element in CSS.</p>\n<p><code class=\"codespan\">content box size</code> of a text fragment is determined by its font size by default. It can also be specified directly by <code class=\"codespan\">width</code> and <code class=\"codespan\">height</code>, although they are rarely set. <code class=\"codespan\">border box size</code> of a text fragment is calculated by adding the <code class=\"codespan\">border box size</code> and <code class=\"codespan\">padding</code>.</p>\n<p>Only <code class=\"codespan\">&#39;\\n&#39;</code> is the newline character, which breaks a line.</p>\n<p>Multiple text fragment exist in a single line. The height of a line is determined by the biggest <code class=\"codespan\">lineHeight</code> of text fragments. <code class=\"codespan\">lineHeight</code> of a text fragment can be specified in <code class=\"codespan\">rich</code>, or in the parent level of <code class=\"codespan\">rich</code>, otherwise using <code class=\"codespan\">box size</code> of the text fragment.</p>\n<p>Having <code class=\"codespan\">lineHeight</code> determined, the vertical position of text fragments can be determined by <code class=\"codespan\">verticalAlign</code> (there is a little different from the rule in CSS):</p>\n<ul>\n<li><code class=\"codespan\">&#39;bottom&#39;</code>: The bottom edge of the text fragment sticks to the bottom edge of the line.</li>\n<li><code class=\"codespan\">&#39;top&#39;</code>: The top edge of the text fragment sticks to the top edge of the line.</li>\n<li><code class=\"codespan\">&#39;middle&#39;</code>: In the middle of the line.</li>\n</ul>\n<p>The width of a text block can be specified by <code class=\"codespan\">width</code>, otherwise, by the longest line. Having the width determined, text fragment can be placed in each line, where the horizontal position of text fragments can be determined by its <code class=\"codespan\">align</code>.</p>\n<ul>\n<li>Firstly, place text fragments whose <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;left&#39;</code> from left to right continuously.</li>\n<li>Secondly, place text fragments whose <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;right&#39;</code> from right to left continuously.</li>\n<li>Finally, the text fragments remained will be sticked and placed in the center of the rest of space.</li>\n</ul>\n<p>The position of text in a text fragment:</p>\n<ul>\n<li>If <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;center&#39;</code>, text aligns at the center of the text fragment box.</li>\n<li>If <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;left&#39;</code>, text aligns at the left of the text fragment box.</li>\n<li>If <code class=\"codespan\">align</code> is <code class=\"codespan\">&#39;right&#39;</code>, text aligns at the right of the text fragment box.</li>\n</ul>\n<p>For example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-fragment-align&edit=1&reset=1\" width=\"800\" height=\"220\" ></iframe>\n\n\n\n\n<h2 id=\"effects-icon-horizontal-rule-title-block-simple-table\">Effects: Icon, Horizontal Rule, Title Block, Simple Table</h2>\n<p>See example:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/title-block&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>Icon is implemented by using image in <code class=\"codespan\">backgroundColor</code>.</p>\n<pre><code class=\"lang-js\">rich: {\n    Sunny: {\n        backgroundColor: {\n            image: &#39;./data/asset/img/weather/sunny_128.png&#39;\n        },\n        // Can only height specified, but leave width auto obtained\n        // from the image, where the aspect ratio kept.\n        height: 30\n    }\n}\n</code></pre>\n<p>Horizontal rule (like HTML &lt;hr&gt; tag) can be implemented by border:</p>\n<pre><code class=\"lang-js\">rich: {\n    hr: {\n        borderColor: &#39;#777&#39;,\n        // width is set as &#39;100%&#39; to fullfill the text block.\n        // Notice, the percentage is based on the content box, without\n        // padding. Although it is a little different from CSS rule,\n        // it is convinent in most cases.\n        width: &#39;100%&#39;,\n        borderWidth: 0.5,\n        height: 0\n    }\n}\n</code></pre>\n<p>Title block can be implemented by <code class=\"codespan\">backgroundColor</code>:</p>\n<pre><code class=\"lang-js\">// Title is at left.\nformatter: &#39;{titleBg|Left Title}&#39;,\nrich: {\n    titleBg: {\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n\n// Title is in the center of the line.\n// This implementation is a little tricky, but is works\n// without more complicated layout mechanism involved.\nformatter: &#39;{tc|Center Title}{titleBg|}&#39;,\nrich: {\n    titleBg: {\n        align: &#39;right&#39;,\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n</code></pre>\n<p>Simple table can be implemented by specify the same width to text fragments that are in the same column of different lines. See the <a href=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&amp;edit=1&amp;reset=1\" target=\"_blank\">example</a> at the mentioned above.</p>\n"},"Server-side Rendering":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> can be rendered at server-side. For example, the thumbnails in the <a href=\"https://echarts.apache.org/examples/en/index.html/\" target=\"_blank\">official examples page</a> are generated at a server.</p>\n<p>Commonly used headless tool is required, for example, <a href=\"https://github.com/GoogleChrome/puppeteer\" target=\"_blank\">puppeteer</a>, <a href=\"https://chromium.googlesource.com/chromium/src/+/lkgr/headless/README.md\" target=\"_blank\">headless chrome</a>, <a href=\"https://github.com/Automattic/node-canvas\" target=\"_blank\">node-canvas</a>, <a href=\"https://github.com/jsdom/jsdom\" target=\"_blank\">jsdom</a>, <a href=\"http://phantomjs.org/\" target=\"_blank\">PhantomJS</a>, etc.</p>\n<p>Some solutions contributed by the community are list as follows:</p>\n<ul>\n<li><a href=\"https://github.com/hellosean1025/node-echarts\" target=\"_blank\">https://github.com/hellosean1025/node-echarts</a></li>\n<li><a href=\"https://github.com/chfw/echarts-scrappeteer\" target=\"_blank\">https://github.com/chfw/echarts-scrappeteer</a></li>\n<li><a href=\"https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js\" target=\"_blank\">https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js</a></li>\n<li><a href=\"https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73\" target=\"_blank\">https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73</a></li>\n</ul>\n"},"Render by Canvas or SVG":{"type":["*"],"description":"<p>Most of browser-side charting libraries use SVG or Canvas as their underlying renderer. In the scope of Apache ECharts (incubating)<sup>TM</sup>, they are usually alternative, without critical differences. But in some environment and scenarios, they show notable differences in performance or functionality.</p>\n<p>ECharts has been using Canvas as its renderer (use VML for IE8-) from the begining. Now, from <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">ECharts v3.8</a> we provide a SVG renderer (beta version) as another option. Either of them can be used by specifing parameter <a href=\"api.html#echarts.init\" target=\"_blank\">renderer</a> as <code class=\"codespan\">&#39;canvas&#39;</code> or <code class=\"codespan\">&#39;svg&#39;</code> when initailizing a chart instance.</p>\n<blockquote>\n<p>That both SVG and Canvas, who are very different in use, are able to be supported in ECharts owns to the abstruction in its underlying render library <a href=\"https://github.com/ecomfe/zrender\" target=\"_blank\">zender</a>, where they are implemented as a Canvas renderer and a alternative SVG renderer.</p>\n</blockquote>\n<h2 id=\"how-to-make-a-choice-\">How to make a choice?</h2>\n<p>Generally speaking, Canvas is suitable for the case that there is a large amount of grpahic elements (which basically due to a large amount of data), like heatmap and lines or scatter plot with large data in geo or parallel coordinates. Besides it supports some <a href=\"https://echarts.apache.org/examples/en/editor.html?c=lines-bmap-effect\" target=\"_blank\">special visual effect</a>. But in some other scenarios SVG has some critical advantages: it consumes less memory then Canvas (especially in mobile device), and gives better performance in rendering. Moreover, it never blurs when zooming the viewport of browser whereas Canvas may blurs. For example, we have tried to render line, bar, pie charts with the Canvas renderer and the SVG renderer, and recorded the frame rate during the the stage that the initial animation performed:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/canvas-vs-svg-en&reset=1\" width=\"90%\" height=\"400\" ></iframe>\n\n\n<p>In the scenarios above, the SVG renderer has provided a better FPS performance in mobile devices. In some other scenarios, where big data amount or certain kinds of human interactions exists, the SVG renderer is still not as good as the Canvas renderer in performance, but two options provides the ability to optimize the performance according to the requirements of each developer.</p>\n<p>How to make a choice? These factors, hardware and software environment, data amount and functional requirements, should be considered.</p>\n<ul>\n<li>If the environment is not harsh and the data amount is not large, both of them can be used, no need to pay attention too much.</li>\n<li>If some harsh environment caused performance problem, we can attempt to get better result by choose appropriate renderer.<ul>\n<li>If lots of echarts instances have to be created and it cause browser crash (it probably caused by that the large memory consumption of those Canvas instances is beyond the limit of some mobile devices) we can try the SVG renderer. Or, generally, if charts runs in some old Android devices, or if we are using some kind of charts like <a href=\"https://ecomfe.github.io/echarts-liquidfill/example/\" target=\"_blank\">liquidfill</a>, the SVG renderer probably gives a better performance.</li>\n<li>If visualizing a large amount of data, or complicated human interactions with data is required, the Canvas renderer works better currently.</li>\n</ul>\n</li>\n</ul>\n<p>Therefore <a href=\"https://github.com/apache/incubator-echarts/issues/new\" target=\"_blank\">feedback</a> of experiences and usage scenarios are strongly welcomed, which will make the these renderers better and better.</p>\n<p>Notice: The features of rich text, shadow and texture have not been supported yet in the current beta version of the SVG renderer.</p>\n<h2 id=\"how-to-use-specify-a-renderer-\">How to use specify a renderer?</h2>\n<p>ECharts uses Canvas by default. If user intends to use the SVG renderer, the module of the SVG renderer should be included in ECharts bundle.</p>\n<ul>\n<li>In the <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">pre-build</a> of ECharts, the SVG renderer has been included in <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.common.min.js\" target=\"_blank\">common version</a> and <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js\" target=\"_blank\">complete version</a>. But not in <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.simple.min.js\" target=\"_blank\">simple version</a>.</li>\n<li>If <a href=\"https://echarts.apache.org/en/builder.html\" target=\"_blank\">build ECharts online</a>, the checkbox &quot;SVG Renderer&quot; should be checked.</li>\n<li>If <a href=\"tutorial.html#Create%20Custom%20Build%20of%20ECharts\" target=\"_blank\">build ECharts offline</a>, the module of the SVG renderer should be imported:</li>\n</ul>\n<pre><code class=\"lang-js\">import &#39;zrender/lib/svg/svg&#39;;\n</code></pre>\n<p>Then wen can specify renderer by <a href=\"api.html#echarts.init\" target=\"_blank\">parameter</a>:</p>\n<pre><code class=\"lang-js\">// Use the Canvas renderer (default).\nvar chart = echarts.init(containerDom, null, {renderer: &#39;canvas&#39;});\n// which is equal to:\nvar chart = echarts.init(containerDom, null, {renderer: &#39;canvas&#39;});\n\n// Use the SVG renderer.\nvar chart = echarts.init(containerDom, null, {renderer: &#39;svg&#39;});\n</code></pre>\n"},"Supporting ARIA in Charts":{"type":["*"],"description":"<p>W3C defined the Accessible Rich Internet Applications Suite (<a href=\"https://www.w3.org/WAI/intro/aria\" target=\"_blank\">WAI-ARIA</a>) to make Web content and Web applications more accessible to the disabled. From Apache ECharts (incubating)<sup>TM</sup> 4.0, we support ARIA by generating description for charts automatically.</p>\n<p>By default, ARIA is disabled. To enable it, you should set <a href=\"#aria.show\">aria.show</a> to be <code class=\"codespan\">true</code>. After enabling, it will generate descriptions based on charts, series, data, and so on. Users may change the generated description.</p>\n<p><strong>For example:</strong></p>\n<p>For config:</p>\n<pre><code class=\"lang-js\">option = {\n    aria: {\n        show: true\n    },\n    title: {\n        text: &#39;Source of user access to a site&#39;,\n        x: &#39;center&#39;\n    },\n    series: [\n        {\n             Name: &#39;access source&#39;,\n            type: &#39;pie&#39;,\n            data: [\n                { value: 335, name: &#39;direct access&#39; },\n                { value: 310, name: &#39;mail marketing&#39; },\n                { value: 234, name: &#39;union ad&#39; },\n                { value: 135, name: &#39;video ad&#39; },\n                { value: 1548, name: &#39;search engine&#39; }\n            ]\n        }\n    ]\n};\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/aria-pie&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n<p>There should be an <code class=\"codespan\">aria-label</code> attribute on the chart DOM, which can help the disabled understand the content of charts with the help of certain devices. The value of the label is:</p>\n<pre><code>This is a chart of &quot;Source of user access to a site.&quot; The chart type is a pie chart that indicates the source of the visit. The data is - direct access data is 335, mail marketing data is 310, union ad data is 234, video ad data is 135, search engine data is 1548.\n</code></pre><p>The default language is in Chinese, but you can configure it with templates.</p>\n<p>Please refer to <a href=\"option.html#aria\" target=\"_blank\">ARIA option</a> for more detail.</p>\n"}}}}
\ No newline at end of file
diff --git a/en/download-extension.html b/en/download-extension.html
index d21b2cd..4bcea14 100644
--- a/en/download-extension.html
+++ b/en/download-extension.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Download Extensions - Apache ECharts (incubating)</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Download Extensions</h1><p>Download extensions and enhance what ECharts can do.</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="extension" class="page-content container"><div class="nav-container"><ul class="nav nav-tabs"><li class="active"><a href="#chart-type" data-toggle="tab">Charts and Components</a></li><li><a href="#functional" data-toggle="tab">Enhancement</a></li><li><a href="#framework" data-toggle="tab">Frameworks</a></li><li><a href="#language" data-toggle="tab">Languages</a></li></ul></div><div class="tab-content"><div id="chart-type" class="tab-pane active"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-gl" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/gl.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-gl" class="extension-name">ECharts GL</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">ECharts-GL provides 3D plots, globe visualization and WebGL acceleration.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/word-cloud.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-name">字符云</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">Cloud charts can layout text into different sizes and colors. You can also use images as masks.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/liquidfill.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-name">水球图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/Ovilia" class="extension-author-name">羡辙</a></div><div class="extension-desc">The liquid-fill chart is a chart suitable for presenting a single percentage of data, supporting multiple water waves and animations.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/bmap.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-name">百度地图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">With Baidu map extension, you can display scatter charts, line charts, heatmaps and so on.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/arcgis.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-name">ArcGIS 地图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/wandergis" class="extension-author-name">wandergis</a></div><div class="extension-desc">A combination of ArcGIS maps and ECharts supports ECharts 2 and ECharts 3.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wandergis/leaflet-echarts3" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/leaflet.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wandergis/leaflet-echarts3" class="extension-name">Leaflet 地图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/wandergis" class="extension-author-name">wandergis</a></div><div class="extension-desc">A combination of Leaflet Map and ECharts supports ECharts 2 and ECharts 3.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/leaflet-2.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-name">echarts-leaflet</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/gnijuohz" class="extension-author-name">gnijuohz</a></div><div class="extension-desc">ECharts extension for visualizing data on leaftlet.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/lzxue/echartsLayer" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/mapbox.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/lzxue/echartsLayer" class="extension-name">Mapbox 地图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/lzxue" class="extension-author-name">lzxue</a></div><div class="extension-desc">A combination of Mapbox maps and ECharts.</div></div></div></div></div></div><div id="functional" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/modularity.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-name">图的模块化</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">The plugin can perform community detection on the ECharts Graph and divide the vertices in the graph into subsets.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-stat" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/stat.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-stat" class="extension-name">统计工具</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/deqingli" class="extension-author-name">李德清</a></div><div class="extension-desc">The statistical extension is a tool for data analysis.</div></div></div></div></div></div><div id="framework" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wangshijun/angular-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wangshijun/angular-echarts" class="extension-name">angular-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/wangshijun" class="extension-author-name">wangshijun</a></div><div class="extension-desc">AngularJs bindings for Baidu ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/bornkiller/echarts-ng" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/bornkiller/echarts-ng" class="extension-name">echarts-ng</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/bornkiller" class="extension-author-name">bornkiller</a></div><div class="extension-desc">Encapsulate ECharts as an instruction using Angular.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/ng-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/ng-echarts" class="extension-name">ng-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">AngularJs version ECharts, supports the latest ECharts3.x.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Justineo/vue-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Justineo/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/Justineo" class="extension-author-name">Justineo</a></div><div class="extension-desc">ECharts component for Vue.js.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/panteng/vue-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/panteng/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/panteng" class="extension-author-name">panteng</a></div><div class="extension-desc">A custom directive for using Echarts in Vue.js apps.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/PUGE/echarts-middleware" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/PUGE/echarts-middleware" class="extension-name">echarts-middleware</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/PUGE" class="extension-author-name">PUGE</a></div><div class="extension-desc">Use ECharts elegantly and efficiently with Vue.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hustcc/echarts-for-react" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hustcc/echarts-for-react" class="extension-name">echarts-for-react</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/hustcc" class="extension-author-name">hustcc</a></div><div class="extension-desc">A simple ECharts react package.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/somonus/react-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/somonus/react-echarts" class="extension-name">react-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/somonus" class="extension-author-name">somonus</a></div><div class="extension-desc">ECharts + react.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/re-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/re-echarts" class="extension-name">re-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">ECharts + react.</div></div></div></div></div></div><div id="language" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/pyecharts/pyecharts/" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/pyecharts/pyecharts/" class="extension-name">pyecharts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/chenjiandongx" class="extension-author-name">chenjiandongx</a><a href="https://github.com/chfw" class="extension-author-name">chfw</a><a href="https://github.com/kinegratii" class="extension-author-name">kinegratii</a></div><div class="extension-desc">Python Echarts Plotting Library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yufeiminds/echarts-python" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yufeiminds/echarts-python" class="extension-name">echarts-python</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/yufeiminds" class="extension-author-name">yufeiminds</a></div><div class="extension-desc">Generate Echarts options with Python.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/napjon/krisk" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/napjon/krisk" class="extension-name">krisk</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/napjon" class="extension-author-name">napjon</a></div><div class="extension-desc">Krisk bring Echarts to Python, and helpful tools for statistical interactive visualization.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/taiyun/recharts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/taiyun/recharts" class="extension-name">recharts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/taiyun" class="extension-author-name">taiyun</a></div><div class="extension-desc">recharts provides the R language interface of ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yihui/recharts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yihui/recharts" class="extension-name">recharts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/yihui" class="extension-author-name">yihui</a></div><div class="extension-desc">An R Interface to ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-name">ECharts2Shiny</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/XD-DENG" class="extension-author-name">XD-DENG</a></div><div class="extension-desc">To insert interactive charts from ECharts into R Shiny applications.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-name">ECharts.jl</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/randyzwitch" class="extension-author-name">randyzwitch</a></div><div class="extension-desc">Julia package for the ECharts 3 visualization library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-name">purescript-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/slamdata" class="extension-author-name">slamdata</a></div><div class="extension-desc">Purescript bindings for Echarts library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-name">iOS-Echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/Pluto-Y/" class="extension-author-name">Pluto-Y</a></div><div class="extension-desc">This is a highly custom chart control for iOS and Mac apps, which build with ECharts 2.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/abel533/ECharts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/abel533/ECharts" class="extension-name">ECharts-Java</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/abel533" class="extension-author-name">abel533</a></div><div class="extension-desc">This is a Java version of the ECharts2.x version that implements the Java objects corresponding to the JSON structure in all ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/idoku/EChartsSDK" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/idoku/EChartsSDK" class="extension-name">EChartsSDK</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/idoku" class="extension-author-name">idoku</a></div><div class="extension-desc">ECharts .NET class library, ported from ECharts Java class library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hisune/Echarts-PHP" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hisune/Echarts-PHP" class="extension-name">Echarts-PHP</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/hisune" class="extension-author-name">hisune</a></div><div class="extension-desc">A PHP library that works as a wrapper for Echarts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/entronad/flutter_echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/entronad/flutter_echarts" class="extension-name">flutter_echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/entronad" class="extension-author-name">entronad</a></div><div class="extension-desc">A Flutter widget to use Echarts in a reactive way.</div></div></div></div></div></div></div></div><div id="submit-extension"><div class="container"><h3>Submit your ECharts extension</h3><p>We will get in touch with you as soon as possible, and the extensions you make will be available to ECharts users on this page.</p><p>Thank you again for your support and contribution to ECharts!</p><a href="mailto:dev@echarts.apache.com" class="btn btn-main btn-thirdary"><img src="https://echarts.apache.org/en/images/btn-email.png?_v_=20200710_1"><span>Send Email</span></a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Download Extensions</h1><p>Download extensions and enhance what ECharts can do.</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="extension" class="page-content container"><div class="nav-container"><ul class="nav nav-tabs"><li class="active"><a href="#chart-type" data-toggle="tab">Charts and Components</a></li><li><a href="#functional" data-toggle="tab">Enhancement</a></li><li><a href="#framework" data-toggle="tab">Frameworks</a></li><li><a href="#language" data-toggle="tab">Languages</a></li></ul></div><div class="tab-content"><div id="chart-type" class="tab-pane active"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-gl" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/gl.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-gl" class="extension-name">ECharts GL</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">ECharts-GL provides 3D plots, globe visualization and WebGL acceleration.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/word-cloud.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-name">字符云</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">Cloud charts can layout text into different sizes and colors. You can also use images as masks.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/liquidfill.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-name">水球图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/Ovilia" class="extension-author-name">羡辙</a></div><div class="extension-desc">The liquid-fill chart is a chart suitable for presenting a single percentage of data, supporting multiple water waves and animations.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/bmap.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-name">百度地图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">With Baidu map extension, you can display scatter charts, line charts, heatmaps and so on.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/arcgis.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-name">ArcGIS 地图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/wandergis" class="extension-author-name">wandergis</a></div><div class="extension-desc">A combination of ArcGIS maps and ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/leaflet-2.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-name">echarts-leaflet</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/gnijuohz" class="extension-author-name">gnijuohz</a></div><div class="extension-desc">ECharts extension for visualizing data on leaftlet.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/lzxue/echartsLayer" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/mapbox.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/lzxue/echartsLayer" class="extension-name">Mapbox 地图</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/lzxue" class="extension-author-name">lzxue</a></div><div class="extension-desc">A combination of Mapbox maps and ECharts.</div></div></div></div></div></div><div id="functional" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/modularity.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-name">图的模块化</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">The plugin can perform community detection on the ECharts Graph and divide the vertices in the graph into subsets.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-stat" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/stat.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-stat" class="extension-name">统计工具</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/deqingli" class="extension-author-name">李德清</a></div><div class="extension-desc">The statistical extension is a tool for data analysis.</div></div></div></div></div></div><div id="framework" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wangshijun/angular-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wangshijun/angular-echarts" class="extension-name">angular-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/wangshijun" class="extension-author-name">wangshijun</a></div><div class="extension-desc">AngularJs bindings for Baidu ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/bornkiller/echarts-ng" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/bornkiller/echarts-ng" class="extension-name">echarts-ng</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/bornkiller" class="extension-author-name">bornkiller</a></div><div class="extension-desc">Encapsulate ECharts as an instruction using Angular.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/ng-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/ng-echarts" class="extension-name">ng-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">AngularJs version ECharts, supports the latest ECharts3.x.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Justineo/vue-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Justineo/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/Justineo" class="extension-author-name">Justineo</a></div><div class="extension-desc">ECharts component for Vue.js.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/panteng/vue-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/panteng/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/panteng" class="extension-author-name">panteng</a></div><div class="extension-desc">A custom directive for using Echarts in Vue.js apps.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/PUGE/echarts-middleware" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/PUGE/echarts-middleware" class="extension-name">echarts-middleware</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/PUGE" class="extension-author-name">PUGE</a></div><div class="extension-desc">Use ECharts elegantly and efficiently with Vue.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hustcc/echarts-for-react" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hustcc/echarts-for-react" class="extension-name">echarts-for-react</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/hustcc" class="extension-author-name">hustcc</a></div><div class="extension-desc">A simple ECharts react package.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/somonus/react-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/somonus/react-echarts" class="extension-name">react-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/somonus" class="extension-author-name">somonus</a></div><div class="extension-desc">ECharts + react.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/re-echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/re-echarts" class="extension-name">re-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">ECharts + react.</div></div></div></div></div></div><div id="language" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/pyecharts/pyecharts/" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/pyecharts/pyecharts/" class="extension-name">pyecharts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/chenjiandongx" class="extension-author-name">chenjiandongx</a><a href="https://github.com/chfw" class="extension-author-name">chfw</a><a href="https://github.com/kinegratii" class="extension-author-name">kinegratii</a></div><div class="extension-desc">Python Echarts Plotting Library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yufeiminds/echarts-python" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yufeiminds/echarts-python" class="extension-name">echarts-python</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/yufeiminds" class="extension-author-name">yufeiminds</a></div><div class="extension-desc">Generate Echarts options with Python.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/napjon/krisk" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/napjon/krisk" class="extension-name">krisk</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/napjon" class="extension-author-name">napjon</a></div><div class="extension-desc">Krisk bring Echarts to Python, and helpful tools for statistical interactive visualization.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/taiyun/recharts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/taiyun/recharts" class="extension-name">recharts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/taiyun" class="extension-author-name">taiyun</a></div><div class="extension-desc">recharts provides the R language interface of ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yihui/recharts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yihui/recharts" class="extension-name">recharts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/yihui" class="extension-author-name">yihui</a></div><div class="extension-desc">An R Interface to ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-name">ECharts2Shiny</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/XD-DENG" class="extension-author-name">XD-DENG</a></div><div class="extension-desc">To insert interactive charts from ECharts into R Shiny applications.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-name">ECharts.jl</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/randyzwitch" class="extension-author-name">randyzwitch</a></div><div class="extension-desc">Julia package for the ECharts 3 visualization library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-name">purescript-echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/slamdata" class="extension-author-name">slamdata</a></div><div class="extension-desc">Purescript bindings for Echarts library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-name">iOS-Echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/Pluto-Y/" class="extension-author-name">Pluto-Y</a></div><div class="extension-desc">This is a highly custom chart control for iOS and Mac apps, which build with ECharts 2.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/abel533/ECharts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/abel533/ECharts" class="extension-name">ECharts-Java</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/abel533" class="extension-author-name">abel533</a></div><div class="extension-desc">This is a Java version of the ECharts2.x version that implements the Java objects corresponding to the JSON structure in all ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/idoku/EChartsSDK" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/idoku/EChartsSDK" class="extension-name">EChartsSDK</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/idoku" class="extension-author-name">idoku</a></div><div class="extension-desc">ECharts .NET class library, ported from ECharts Java class library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hisune/Echarts-PHP" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hisune/Echarts-PHP" class="extension-name">Echarts-PHP</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/hisune" class="extension-author-name">hisune</a></div><div class="extension-desc">A PHP library that works as a wrapper for Echarts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/entronad/flutter_echarts" class="extension-head"><img src="https://echarts.apache.org/en/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/entronad/flutter_echarts" class="extension-name">flutter_echarts</a><div class="extension-author"><span>Contributors:</span><a href="https://github.com/entronad" class="extension-author-name">entronad</a></div><div class="extension-desc">A Flutter widget to use Echarts in a reactive way.</div></div></div></div></div></div></div></div><div id="submit-extension"><div class="container"><h3>Submit your ECharts extension</h3><p>We will get in touch with you as soon as possible, and the extensions you make will be available to ECharts users on this page.</p><p>Thank you again for your support and contribution to ECharts!</p><a href="mailto:dev@echarts.apache.com" class="btn btn-main btn-thirdary"><img src="https://echarts.apache.org/en/images/btn-email.png?_v_=20200710_1"><span>Send Email</span></a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/download-map.html b/en/download-map.html
index 95680e6..919eac2 100644
--- a/en/download-map.html
+++ b/en/download-map.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -8,7 +8,7 @@
 }
 </script><title>Download Maps - Apache ECharts (incubating)</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Download Maps</h1><p>ECharts doesn't provide with Map data to download now.</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div style="text-align: left; min-height: 300px; margin-top: 30px;" class="page-content container"><p>ECharts doesn't come with Map data. To create Map charts, it is advised to use Baidu Map or other third party maps for the underlying map. Here is an example of <a href="https://echarts.apache.org/examples/en/editor.html?c=map-polygon">ECharts with Baidu Map</a>.</p><p>Please check <a href="./download-extension.html">Download Extension</a> page for other map extensions.</p></div><script type="text/javascript">document.getElementById('nav-download').className = 'active';
-</script><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/download-theme.html b/en/download-theme.html
index fbc8295..3a3f92c 100644
--- a/en/download-theme.html
+++ b/en/download-theme.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -17,7 +17,7 @@
     ...
 });
 &lt;/script&gt;
-</pre></div></div></section><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';
+</pre></div></div></section><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';
 
 $('pre').addClass('prettyprint');
 prettyPrint();
diff --git a/en/download.html b/en/download.html
index 20bcec9..4b23d86 100644
--- a/en/download.html
+++ b/en/download.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -16,7 +16,7 @@
     font-weight: normal;
 }
 */
-</style><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Download</h1><p>Free to choose to download different versions, different topics, the map data you need. You can be customized according to your needs.</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">Option 1: Install from downloaded source code or binary</h3><table id="download-table" class="table"><tr><th>Version</th><th>Release Date</th><th>Download Source from a Mirror</th><th>Dist files on GitHub</th></tr></table><div class="checksum"><p><strong>Note:</strong> when downloading from a mirror please check the <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> and verify the <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> compatible signature from the main <a href="https://www.apache.org">Apache site</a>. Links are provided above (next to the release download link). This <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> file contains the public keys used for signing release. It is recommended that (when possible) a <a href="https://www.apache.org/dev/release-signing#web-of-trust">web of trust</a> is used to confirm the identity of these keys.</p><h4>To verify ECharts releases using GPG:</h4><ol><li>Download the release apache-echarts-X.Y.Z-incubating-src.zip from a mirror site.</li><li>Download the checksum apache-echarts-X.Y.Z-incubating-src.zip.asc from <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a>.</li><li>Download the <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a> file.</li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>To perform a quick check using SHA-512:</h4><ol><li>Download the release apache-echarts-X.Y.Z-incubating-src.zip from a mirror site.</li><li>Download the checksum apache-echarts-X.Y.Z-incubating-src.zip.512 from <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a>.</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) is licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a>.</p></div><h3>Option 2: Install from npm</h3><p><code>npm install echarts</code></p><h3>Option 3: Custom Build</h3><a href="builder.html" class="btn btn-main btn-thirdary more-btn">Customize</a><p>Choose the features you want and build the file online.</p><h3>After downloading...</h3><p><a href="./tutorial.html">Get Started</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://echarts.apache.org/en/js/download.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
+</style><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Download</h1><p>Free to choose to download different versions, different topics, the map data you need. You can be customized according to your needs.</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">Option 1: Install from downloaded source code or binary</h3><table id="download-table" class="table"><tr><th>Version</th><th>Release Date</th><th>Download Source from a Mirror</th><th>Dist files on GitHub</th></tr></table><div class="checksum"><p><strong>Note:</strong> when downloading from a mirror please check the <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> and verify the <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> compatible signature from the main <a href="https://www.apache.org">Apache site</a>. Links are provided above (next to the release download link). This <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> file contains the public keys used for signing release. It is recommended that (when possible) a <a href="https://www.apache.org/dev/release-signing#web-of-trust">web of trust</a> is used to confirm the identity of these keys.</p><h4>To verify ECharts releases using GPG:</h4><ol><li>Download the release apache-echarts-X.Y.Z-incubating-src.zip from a mirror site.</li><li>Download the checksum apache-echarts-X.Y.Z-incubating-src.zip.asc from <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a>.</li><li>Download the <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a> file.</li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>To perform a quick check using SHA-512:</h4><ol><li>Download the release apache-echarts-X.Y.Z-incubating-src.zip from a mirror site.</li><li>Download the checksum apache-echarts-X.Y.Z-incubating-src.zip.512 from <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a>.</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) is licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a>.</p></div><h3>Option 2: Install from npm</h3><p><code>npm install echarts</code></p><h3>Option 3: Custom Build</h3><a href="builder.html" class="btn btn-main btn-thirdary more-btn">Customize</a><p>Choose the features you want and build the file online.</p><h3>After downloading...</h3><p><a href="./tutorial.html">Get Started</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://echarts.apache.org/en/js/download.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
 
 //- var list = [
 //-         {
diff --git a/en/faq.html b/en/faq.html
index b310718..544123a 100644
--- a/en/faq.html
+++ b/en/faq.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,7 +9,7 @@
 </script><title>FAQ - Apache ECharts (incubating)</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="FAQ - Apache ECharts (incubating)"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>FAQ</h1><p>Frequently asked questions</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="faq-page" class="page-content single-page"><div class="page-nav"><h4>Topics</h4><ul></ul></div><div class="page-detail"><h2 id="ask-questions">General Questions</h2><h3>What to do if you have technical problem?</h3><p>1)It is recommended that you read the navigation on the left side of the <a href="https://echarts.apache.org/en/option.html">option manual</a> before you ask questions. In the option manual, you can find out what configuration items does ECharts have. And you can find under the relevant components whether there are configuration items that can implement the functions you need.</p><p>2)Browse FAQ questions on this page.</p><p>3)Create a simple example to reproduce your problem on  <a href="https://gallery.echartsjs.com/editor.html">ECharts Gallery</a>. If you can't use the code to describe the requirements, you can try to provide a design draft or draw a sketch.</p><p>4)Paste the link when you ask questions on <a href="https://stackoverflow.com">stackoverflow</a>, <a href="https://www.oschina.net/question/tag/echarts">OSCHINA</a> or <a href="https://segmentfault.com/t/echarts">segmentfault.com</a> and etc. Plaes attach the example link.</p><h3>Is ECharts free to use?</h3><p>Yes, ECharts is open-sourced under <a href="./license.html">Apache License 2.0</a>.</p><h2 id="axis">Axis</h2><h3>What should I do if the axis label don`t have enough space?</h3><p>You can use <a href="https://echarts.apache.org/en/option.html#xAxis.interval">interval</a> to control how many labels are displayed,  set it to <code>0</code> to display all labels.</p><p>Or you can set <a href="https://echarts.apache.org/en/option.html#yAxis.axisLabel.rotate">axisLabel.rotate</a> to rotate the label a certain angle.</p><h3>Why does it not work when you want to put the axis on the right side?</h3><p>You need to set <a href="https://echarts.apache.org/en/option.html#yAxis.axisLine.onZero">onZero</a> to <code>false</code>.</p><h3>How do I force the first / last label of the axis to be displayed?</h3><p>Both <a href="https://echarts.apache.org/en/option.html#xAxis.axisLabel.showMinLabel">axisLabel.showMinLabel</a> and <a href="https://echarts.apache.org/en/option.html#xAxis.axisLabel.showMaxLabel">axisLabel.showMaxLabel</a> are supported since ECharts version 3.5.2. It can be used to control whether the first / last tags are forced to display.</p><p>If you can't update the version, please refer to this <a href="https://gallery.echartsjs.com/editor.html?c=xry06afSje">example</a> to achieve the same effect.</p><h2 id="legend">legend</h2><h3>What should I do if the legend area overlapped on the chart?</h3><p>You can set the <a href="https://echarts.apache.org/en/option.html#grid">grid</a> to control the position of the chart area. For example, Set a larger <code>grid.top</code> to move drawing area down.</p><p>We are planning to make the layout smarter in the future versions.</p><h2 id="line-chart">line-chart</h2><h3>The ticks on the coordinate axis seems different with the data?</h3><p>Check if you set the <code>stack</code>. You should remove it if you don't want to make a stack line chart.</p><h2 id="bar-chart">bar-chart</h2><h3>Why does the y-axis scale disappear when the values are small?</h3><p>Version 3.5 of ECharts has been fixed this issue.</p><h2 id="map-chart">map-chart</h2><h3>Province names overlap on the chart. How to modify the location of the names?</h3><p>You can modify the <code>cp</code> coordinates of the corresponding province in the map file (JS or JSON), or modify the map data that has been loaded by <code>echarts.getMap('china')</code>.</p><p>For more details, please refer to <a href="https://github.com/apache/incubator-echarts/issues/4379#issuecomment-257765948">GitHub</a>.</p><h3>Where can I download maps from other countries?</h3><p>Map information for other countries can be downloaded from <a href="https://github.com/echarts-maps/echarts-countries-js">here</a>.</p><h3>How can I get the zoom event of a map?</h3><p>First, you need to set the series's <a href="https://echarts.apache.org/en/option.html#series-map.roam">roam</a> to <code>true</code> and then listen for the <code>'georoam'</code> event. Such as:</p><pre><code>myChart.on('georoam', function (params) {
    console.log(params);
-});</code></pre><p>Please refer to <a href="https://gallery.echartsjs.com/editor.html?c=xHyqn_rQ6g">this example</a>.</p><h3>How to make my custom map?</h3><p>The ECharts map is <a href="https://github.com/apache/incubator-echarts/blob/8eeb7e5abe207d0536c62ce1f4ddecc6adfdf85e/src/util/mapData/rawData/encode.js">additionally encoded</a> from original coordinates. You can use the <a href="https://github.com/giscafer/mapshaper-plus">mapshaper-plus tool</a> to upload a custom geojson file and then generate a map file that can be used in Echarts.</p><h2 id="baidu-map">baidu-map</h2><h3>How to use ECharts with Baidu map?</h3><ol><li>Include <code>echarts.js</code>, <code>bmap.js</code> and <code>https://api.map.baidu.com/api?v=2.0&ak=Here is the access key you obtained on the Baidu development platform</code>.</li><li>Set <code>bmap</code> in <code>option</code>,You can refer to this <a href="https://echarts.apache.org/examples/en/editor.html?c=effectScatter-bmap">example</a>.</li><li>If you need to get a Baidu map instance, you can use <code>chart.getModel().getComponent('bmap').getBMap()</code>,and then make do settings based on <a href="https://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html">Baidu Maps API</a> .</li></ol><p>There are more examples about Baidu maps on <a href="https://gallery.echartsjs.com/explore.html#components=bmap~sort=rank~timeframe=all~author=all">ECharts Gallery</a> , which can be used as a reference.</p><h2 id="gauge-chart">gauge-chart</h2><h3>How to set the dashboard color?</h3><p>You can use <a href="https://echarts.apache.org/en/option.html#series-gauge.axisLine.lineStyle.color">axisLine.lineStyle.color</a>.</p><h2 id="event">Event processing</h2><h3>How do I get events such as chart clicks?</h3><p>Pelease read <a href="https://echarts.apache.org/en/tutorial.html#Events%20and%20Actions%20in%20ECharts"> official website tutorial</a>. The types of events supported by ECharts can be found in the <a href="https://echarts.apache.org/en/api.html#events">related API</a>.</p><h2 id="others">others</h2><h3>Why is the chart not displayed?</h3><p>You can check the following situations:</p><ul><li>Whether <code>echarts.js</code> is loaded normally.</li><li>Whether<code>echarts</code>  variable exists.</li><li>Whether the DOM container has a width or height when calling <code>echarts.init</code>.</li></ul><h3>Where can I learn ECharts?</h3><p>The official website is the best learning platform. In addition, learning other people's work on the <a href="https://gallery.echartsjs.com">ECharts Gallery</a> is also a good choice.</p><p>ECharts related projects and resources can be found at <a href="https://github.com/ecomfe/awesome-echarts">awesome-echarts</a>.</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+});</code></pre><p>Please refer to <a href="https://gallery.echartsjs.com/editor.html?c=xHyqn_rQ6g">this example</a>.</p><h3>How to make my custom map?</h3><p>The ECharts map is <a href="https://github.com/apache/incubator-echarts/blob/8eeb7e5abe207d0536c62ce1f4ddecc6adfdf85e/src/util/mapData/rawData/encode.js">additionally encoded</a> from original coordinates. You can use the <a href="https://github.com/giscafer/mapshaper-plus">mapshaper-plus tool</a> to upload a custom geojson file and then generate a map file that can be used in Echarts.</p><h2 id="baidu-map">baidu-map</h2><h3>How to use ECharts with Baidu map?</h3><ol><li>Include <code>echarts.js</code>, <code>bmap.js</code> and <code>https://api.map.baidu.com/api?v=2.0&ak=Here is the access key you obtained on the Baidu development platform</code>.</li><li>Set <code>bmap</code> in <code>option</code>,You can refer to this <a href="https://echarts.apache.org/examples/en/editor.html?c=effectScatter-bmap">example</a>.</li><li>If you need to get a Baidu map instance, you can use <code>chart.getModel().getComponent('bmap').getBMap()</code>,and then make do settings based on <a href="https://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html">Baidu Maps API</a> .</li></ol><p>There are more examples about Baidu maps on <a href="https://gallery.echartsjs.com/explore.html#components=bmap~sort=rank~timeframe=all~author=all">ECharts Gallery</a> , which can be used as a reference.</p><h2 id="gauge-chart">gauge-chart</h2><h3>How to set the dashboard color?</h3><p>You can use <a href="https://echarts.apache.org/en/option.html#series-gauge.axisLine.lineStyle.color">axisLine.lineStyle.color</a>.</p><h2 id="event">Event processing</h2><h3>How do I get events such as chart clicks?</h3><p>Pelease read <a href="https://echarts.apache.org/en/tutorial.html#Events%20and%20Actions%20in%20ECharts"> official website tutorial</a>. The types of events supported by ECharts can be found in the <a href="https://echarts.apache.org/en/api.html#events">related API</a>.</p><h2 id="others">others</h2><h3>Why is the chart not displayed?</h3><p>You can check the following situations:</p><ul><li>Whether <code>echarts.js</code> is loaded normally.</li><li>Whether<code>echarts</code>  variable exists.</li><li>Whether the DOM container has a width or height when calling <code>echarts.init</code>.</li></ul><h3>Where can I learn ECharts?</h3><p>The official website is the best learning platform. In addition, learning other people's work on the <a href="https://gallery.echartsjs.com">ECharts Gallery</a> is also a good choice.</p><p>ECharts related projects and resources can be found at <a href="https://github.com/ecomfe/awesome-echarts">awesome-echarts</a>.</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/feature.html b/en/feature.html
index df49e66..3e04b5e 100644
--- a/en/feature.html
+++ b/en/feature.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Features - Apache ECharts (incubating)</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>Features</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content single-page"><div class="page-nav"><h4>Features</h4><ul></ul></div><div class="page-detail"><p class="page-detail-desc">Apache ECharts (incubating)<sup>TM</sup> is an open-sourced JavaScript visualization tool, which can run fluently on PC and mobile devices. It is compatible with most modern Web Browsers, e.g., IE8/9/10/11, Chrome, Firefox, Safari and so on. ECharts depends on <a href="https://github.com/ecomfe/zrender" target="_blank">ZRender</a>, a graphic rendering engine, to create intuitive, interactive, and highly-customizable charts.</p><h2 id="chart-types">Abundant Chart Types</h2><p>The basic chart types ECharts supports include <a href="option.html#series-line" target="_blank">line series</a>, <a href="option.html#series-line" target="_blank">bar series</a>, <a href="option.html#series-scatter" target="_blank">scatter series</a>, <a href="option.html#series-pie" target="_blank">pie charts</a>, <a href="option.html#series-candlestick" target="_blank">candle-stick series</a>, <a href="option.html#series-boxplot" target="_blank">boxplot series</a> for statistics, <a href="option.html#series-map" target="_blank">map series</a>, <a href="option.html#series-heatmap" target="_blank">heatmap series</a>, <a href="option.html#series-lines" target="_blank">lines series</a> for directional information, <a href="option.html#series-graph" target="_blank">graph series</a> for relationships, <a href="option.html#series-treemap" target="_blank">treemap series</a>, <a href="option.html#series-sunburst">sunburst series</a>, <a href="option.html#series-parallel" target="_blank">parallel series</a> for multi-dimensional data, <a href="option.html#series-funnel" target="_blank">funnel series</a>, <a href="option.html#series-gauge" target="_blank">gauge series</a>. And it's extremely easy to create a combinition of them with ECharts.</p><p>Besides the built-in chart types, ECharts also provide the <a href="option.html#series-custom">customed series</a> for users to create a specific chart types. To use it, you should only pass in a callback function named <em>renderItem</em>, and return any graphic elements you wish to draw to according to the data. What makes it even better is that it can interact with the existing ECharts components and you don't have to worry about the interaction with them.</p><p>If the default package size is too large for you, you can choose the chart types and components you need and download in <a href="builder.html">the online builder</a>.</p><h2 id="dataset">Multiple Data Format Ready-To-Use</h2><p>The built-in <code>dataset</code> attribute from ECharts v4.0 supports data formats including two-dimensional table, key-value object, and so on. The map from data to graphic can be easily set by the <code>encode</code> attribute. This is a more intuitive way to think when developing a chart, and it saves much time writing data-converting steps for developpers. Futhermore, it saves memory since different components can share on piece of data rather than copying.</p><p>ECharts supports TypedArray, which occupies less memory than array and is more gabbage-collection-friendly. For big data visualization, it is suggested to use TypedArray to improve performance.</p><h2 id="big-data">Data Visualization of Tens of Millions on Web</h2><p>With the help of imcremental rendering technique since v4.0 and optimization of all ascpects, ECharts can display the visualization of tens of millions of data. What's more, interactions like scaling and transforming are fluent all the same.</p><p>Tens of millions of data usually takes over hundreds of MB spaces. ECharts provide streaming data ability since v4.0 and makes it possible to render as much data as loaded from WebSocket. There is no need to wait for all data to be loaded to start rendering.</p><img src="https://echarts.apache.org/en/images/features/scatterGL.jpg?_v_=20200710_1" width="60%"><br /><img src="https://echarts.apache.org/en/images/features/scatterGL2.jpg?_v_=20200710_1" width="30%"><img src="https://echarts.apache.org/en/images/features/scatterGL3.jpg?_v_=20200710_1" width="30%"><h2 id="mobile">Mobile Optimization</h2><p>ECharts has been carefully optimized for mobile interaction, such zooming and panning the coordinate system with your fingers on small screens. The PC users can also use the mouse wheel to do the same interaction.</p><p>The fine-grained modularity and packaging mechanism allows ECharts to have a small package size on the mobile, and the optional SVG rendering engine makes the memory cost of the mobile much smaller.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=area-simple&amp;reset=1&amp;edit=1&amp;renderer=svg" width="60%" height="400"></iframe><h2 id="mult-platform">Multi-Rendering Solutions and Cross-Platform Support</h2><p>ECharts supports rendering charts in the form of Canvas, SVG (v4.0+), and VML. VML is compatible with lower versions of IE; SVG reduces the memory cost on mobiles; and Canvas can easily handle large data visualization and special rendering effects. Different rendering methods provide more choices, making ECharts performs better in different scenarios.</p><p>In addition to PC and mobile browsers, ECharts can also be used with node-canvas on Node for efficient server-side rendering (SSR). And ECharts support Wechat Applet rendering since v4.0.</p><p>Community contributors also provide us with a variety of different language extensions. For example, <a href="https://github.com/pyecharts/pyecharts" target="_blank">pyecharts</a> for Python, <a href="https://github.com/cosname/recharts" target="_blank">recharts</a> for R, <a href="https://github.com/randyzwitch/ECharts.jl">ECharts.jl</a> for Julia and so on.</p><p>We hope that the platform and language will not be the limit for everyone to use ECharts for visualization!</p><h2 id="interaction">Interactive Data Exploration In-Depth</h2><p>Interaction is an important means of mining information from data. Overview first, zoom filtering to view details as needed is a basic requirement for data visualization interaction.</p><p>ECharts has been on the road of <em>interaction</em>. We have provided <a href="option.html#legend" target="_blank">legend</a>, <a href="option.html#visualMap" target="_blank">visualMap</a>, <a href="option.html#dataZoom" target="_blank">dataZoom</a>, <a href="option.html#tooltip" target="_blank">tooltip</a>, <a href="option.html#brush">brushing</a> and other ready-to-use interactive components, which can perform interactive operations such as multi-dimensional data screening, view zooming, and display details on the data.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=scatter-matrix&amp;reset=1&amp;edit=1" width="60%" height="540"></iframe><h2 id="visual-mapping">Multi-Dimensional Data Support and Rich Visual Coding</h2><p>ECharts 3 began to strengthen support for multi-dimensional data. In addition to the common multi-dimensional data visualization tools such as parallel coordinates, for traditional scatter plots, etc., the input data can also be multiple dimensions. With the rich visual coding provided by the visual mapping component <a href="option.html#visualMap" target="_blank">visualMap</a>, it is possible to map data of different dimensions to color, size, transparency, shading, etc. Different visual channels.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=scatter-nutrients-matrix&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="dynamic-data">Dynamic Data</h2><p>ECharts is driven by data, and changes in data drive changes in the chart. So the implementation of dynamic data has become extremely simple, just need to get the data, fill in the data, ECharts will find the difference between the two sets of data and then use the appropriate animation to represent the data changes. The <a href="option.html#timeline" target="_blank">timeline</a> component can present data information in a higher time dimension.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=scatter-life-expectancy-timeline&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="fancy-effects">Special Effects</h2><p>ECharts provides eye-catching effects for the visualization of geographic data such as line data and point data.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=lines-bmap-effect&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="gl">More Powerful and Beautiful 3D Visualization with GL</h2><p>Do you want to achieve 3D visualization in VR, large screen scenes? We provide WebGL-based ECharts GL. You can use ECharts GL to draw 3D Earth, buildings, and population distribution histograms as easily as ECharts common components. Furthermore, we also provide configuration items so that you can get artistic results with a few lines of configuration!</p><img src="https://echarts.apache.org/en/images/features/flowGL-line.jpg?_v_=20200710_1" width="40%"><img src="https://echarts.apache.org/en/images/features/buildings-ny.jpg?_v_=20200710_1" width="40%"><br /><img src="https://echarts.apache.org/en/images/features/capetown-taxi.jpg?_v_=20200710_1" width="40%"><img src="https://echarts.apache.org/en/images/features/population.jpg?_v_=20200710_1" width="40%"><h2 id="aria">Accessibility</h2><p>When we talk about visualization, we tend to naturally associate it with seeing, but it is one-sided. The W3C has developed the Accessible Rich Internet Applications Suite (WAI-ARIA), which aims to make web content and web applications accessible to more people with disabilities.</p><p>ECharts 4.0 complies with this specification and supports automatic generation of descriptions based on chart configuration items, enabling people with visual disabilities to understand the chart content with the help of reading devices, so that charts can be accessed by more people!</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>Features</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content single-page"><div class="page-nav"><h4>Features</h4><ul></ul></div><div class="page-detail"><p class="page-detail-desc">Apache ECharts (incubating)<sup>TM</sup> is an open-sourced JavaScript visualization tool, which can run fluently on PC and mobile devices. It is compatible with most modern Web Browsers, e.g., IE8/9/10/11, Chrome, Firefox, Safari and so on. ECharts depends on <a href="https://github.com/ecomfe/zrender" target="_blank">ZRender</a>, a graphic rendering engine, to create intuitive, interactive, and highly-customizable charts.</p><h2 id="chart-types">Abundant Chart Types</h2><p>The basic chart types ECharts supports include <a href="option.html#series-line" target="_blank">line series</a>, <a href="option.html#series-line" target="_blank">bar series</a>, <a href="option.html#series-scatter" target="_blank">scatter series</a>, <a href="option.html#series-pie" target="_blank">pie charts</a>, <a href="option.html#series-candlestick" target="_blank">candle-stick series</a>, <a href="option.html#series-boxplot" target="_blank">boxplot series</a> for statistics, <a href="option.html#series-map" target="_blank">map series</a>, <a href="option.html#series-heatmap" target="_blank">heatmap series</a>, <a href="option.html#series-lines" target="_blank">lines series</a> for directional information, <a href="option.html#series-graph" target="_blank">graph series</a> for relationships, <a href="option.html#series-treemap" target="_blank">treemap series</a>, <a href="option.html#series-sunburst">sunburst series</a>, <a href="option.html#series-parallel" target="_blank">parallel series</a> for multi-dimensional data, <a href="option.html#series-funnel" target="_blank">funnel series</a>, <a href="option.html#series-gauge" target="_blank">gauge series</a>. And it's extremely easy to create a combinition of them with ECharts.</p><p>Besides the built-in chart types, ECharts also provide the <a href="option.html#series-custom">customed series</a> for users to create a specific chart types. To use it, you should only pass in a callback function named <em>renderItem</em>, and return any graphic elements you wish to draw to according to the data. What makes it even better is that it can interact with the existing ECharts components and you don't have to worry about the interaction with them.</p><p>If the default package size is too large for you, you can choose the chart types and components you need and download in <a href="builder.html">the online builder</a>.</p><h2 id="dataset">Multiple Data Format Ready-To-Use</h2><p>The built-in <code>dataset</code> attribute from ECharts v4.0 supports data formats including two-dimensional table, key-value object, and so on. The map from data to graphic can be easily set by the <code>encode</code> attribute. This is a more intuitive way to think when developing a chart, and it saves much time writing data-converting steps for developpers. Futhermore, it saves memory since different components can share on piece of data rather than copying.</p><p>ECharts supports TypedArray, which occupies less memory than array and is more gabbage-collection-friendly. For big data visualization, it is suggested to use TypedArray to improve performance.</p><h2 id="big-data">Data Visualization of Tens of Millions on Web</h2><p>With the help of imcremental rendering technique since v4.0 and optimization of all ascpects, ECharts can display the visualization of tens of millions of data. What's more, interactions like scaling and transforming are fluent all the same.</p><p>Tens of millions of data usually takes over hundreds of MB spaces. ECharts provide streaming data ability since v4.0 and makes it possible to render as much data as loaded from WebSocket. There is no need to wait for all data to be loaded to start rendering.</p><img src="https://echarts.apache.org/en/images/features/scatterGL.jpg?_v_=20200710_1" width="60%"><br /><img src="https://echarts.apache.org/en/images/features/scatterGL2.jpg?_v_=20200710_1" width="30%"><img src="https://echarts.apache.org/en/images/features/scatterGL3.jpg?_v_=20200710_1" width="30%"><h2 id="mobile">Mobile Optimization</h2><p>ECharts has been carefully optimized for mobile interaction, such zooming and panning the coordinate system with your fingers on small screens. The PC users can also use the mouse wheel to do the same interaction.</p><p>The fine-grained modularity and packaging mechanism allows ECharts to have a small package size on the mobile, and the optional SVG rendering engine makes the memory cost of the mobile much smaller.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=area-simple&amp;reset=1&amp;edit=1&amp;renderer=svg" width="60%" height="400"></iframe><h2 id="mult-platform">Multi-Rendering Solutions and Cross-Platform Support</h2><p>ECharts supports rendering charts in the form of Canvas, SVG (v4.0+), and VML. VML is compatible with lower versions of IE; SVG reduces the memory cost on mobiles; and Canvas can easily handle large data visualization and special rendering effects. Different rendering methods provide more choices, making ECharts performs better in different scenarios.</p><p>In addition to PC and mobile browsers, ECharts can also be used with node-canvas on Node for efficient server-side rendering (SSR). And ECharts support Wechat Applet rendering since v4.0.</p><p>Community contributors also provide us with a variety of different language extensions. For example, <a href="https://github.com/pyecharts/pyecharts" target="_blank">pyecharts</a> for Python, <a href="https://github.com/cosname/recharts" target="_blank">recharts</a> for R, <a href="https://github.com/randyzwitch/ECharts.jl">ECharts.jl</a> for Julia and so on.</p><p>We hope that the platform and language will not be the limit for everyone to use ECharts for visualization!</p><h2 id="interaction">Interactive Data Exploration In-Depth</h2><p>Interaction is an important means of mining information from data. Overview first, zoom filtering to view details as needed is a basic requirement for data visualization interaction.</p><p>ECharts has been on the road of <em>interaction</em>. We have provided <a href="option.html#legend" target="_blank">legend</a>, <a href="option.html#visualMap" target="_blank">visualMap</a>, <a href="option.html#dataZoom" target="_blank">dataZoom</a>, <a href="option.html#tooltip" target="_blank">tooltip</a>, <a href="option.html#brush">brushing</a> and other ready-to-use interactive components, which can perform interactive operations such as multi-dimensional data screening, view zooming, and display details on the data.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=scatter-matrix&amp;reset=1&amp;edit=1" width="60%" height="540"></iframe><h2 id="visual-mapping">Multi-Dimensional Data Support and Rich Visual Coding</h2><p>ECharts 3 began to strengthen support for multi-dimensional data. In addition to the common multi-dimensional data visualization tools such as parallel coordinates, for traditional scatter plots, etc., the input data can also be multiple dimensions. With the rich visual coding provided by the visual mapping component <a href="option.html#visualMap" target="_blank">visualMap</a>, it is possible to map data of different dimensions to color, size, transparency, shading, etc. Different visual channels.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=scatter-nutrients-matrix&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="dynamic-data">Dynamic Data</h2><p>ECharts is driven by data, and changes in data drive changes in the chart. So the implementation of dynamic data has become extremely simple, just need to get the data, fill in the data, ECharts will find the difference between the two sets of data and then use the appropriate animation to represent the data changes. The <a href="option.html#timeline" target="_blank">timeline</a> component can present data information in a higher time dimension.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=scatter-life-expectancy-timeline&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="fancy-effects">Special Effects</h2><p>ECharts provides eye-catching effects for the visualization of geographic data such as line data and point data.</p><iframe data-src="https://echarts.apache.org/examples/en/view.html?c=lines-bmap-effect&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="gl">More Powerful and Beautiful 3D Visualization with GL</h2><p>Do you want to achieve 3D visualization in VR, large screen scenes? We provide WebGL-based ECharts GL. You can use ECharts GL to draw 3D Earth, buildings, and population distribution histograms as easily as ECharts common components. Furthermore, we also provide configuration items so that you can get artistic results with a few lines of configuration!</p><img src="https://echarts.apache.org/en/images/features/flowGL-line.jpg?_v_=20200710_1" width="40%"><img src="https://echarts.apache.org/en/images/features/buildings-ny.jpg?_v_=20200710_1" width="40%"><br /><img src="https://echarts.apache.org/en/images/features/capetown-taxi.jpg?_v_=20200710_1" width="40%"><img src="https://echarts.apache.org/en/images/features/population.jpg?_v_=20200710_1" width="40%"><h2 id="aria">Accessibility</h2><p>When we talk about visualization, we tend to naturally associate it with seeing, but it is one-sided. The W3C has developed the Accessible Rich Internet Applications Suite (WAI-ARIA), which aims to make web content and web applications accessible to more people with disabilities.</p><p>ECharts 4.0 complies with this specification and supports automatic generation of descriptions based on chart configuration items, enabling people with visual disabilities to understand the chart content with the help of reading devices, so that charts can be accessed by more people!</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/images/extensions/arcgis.jpg b/en/images/extensions/arcgis.jpg
index 10a81c1..4f26a1e 100644
--- a/en/images/extensions/arcgis.jpg
+++ b/en/images/extensions/arcgis.jpg
Binary files differ
diff --git a/en/images/extensions/bmap.jpg b/en/images/extensions/bmap.jpg
index 7ac617b..1d6ffaa 100644
--- a/en/images/extensions/bmap.jpg
+++ b/en/images/extensions/bmap.jpg
Binary files differ
diff --git a/en/images/extensions/gl.png b/en/images/extensions/gl.png
old mode 100755
new mode 100644
index 9a99272..009b0a3
--- a/en/images/extensions/gl.png
+++ b/en/images/extensions/gl.png
Binary files differ
diff --git a/en/images/extensions/leaflet-2.jpg b/en/images/extensions/leaflet-2.jpg
index bc34204..32f0650 100644
--- a/en/images/extensions/leaflet-2.jpg
+++ b/en/images/extensions/leaflet-2.jpg
Binary files differ
diff --git a/en/images/extensions/leaflet.jpg b/en/images/extensions/leaflet.jpg
deleted file mode 100644
index d65b33e..0000000
--- a/en/images/extensions/leaflet.jpg
+++ /dev/null
Binary files differ
diff --git a/en/images/extensions/liquidfill.jpg b/en/images/extensions/liquidfill.jpg
index 8a53c45..7c7c71e 100644
--- a/en/images/extensions/liquidfill.jpg
+++ b/en/images/extensions/liquidfill.jpg
Binary files differ
diff --git a/en/images/extensions/mapbox.jpg b/en/images/extensions/mapbox.jpg
index 77bebce..25b4171 100644
--- a/en/images/extensions/mapbox.jpg
+++ b/en/images/extensions/mapbox.jpg
Binary files differ
diff --git a/en/images/extensions/modularity.jpg b/en/images/extensions/modularity.jpg
index a3918d9..f418f45 100644
--- a/en/images/extensions/modularity.jpg
+++ b/en/images/extensions/modularity.jpg
Binary files differ
diff --git a/en/images/extensions/stat.jpg b/en/images/extensions/stat.jpg
index f3a7fd6..fabf561 100644
--- a/en/images/extensions/stat.jpg
+++ b/en/images/extensions/stat.jpg
Binary files differ
diff --git a/en/images/extensions/word-cloud.jpg b/en/images/extensions/word-cloud.jpg
index 3d5c490..ef0c594 100644
--- a/en/images/extensions/word-cloud.jpg
+++ b/en/images/extensions/word-cloud.jpg
Binary files differ
diff --git a/en/index.html b/en/index.html
index 715eb86..0e00243 100644
--- a/en/index.html
+++ b/en/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -17,9 +17,9 @@
 
 </script><section id="feature-section"><div class="container"><div class="row features"><p>Apache ECharts (incubating)<sup>TM</sup> is an incubation project at <a target="_blank" href="https://www.apache.org/">The Apache Software Foundation</a> (ASF).</p></div><div class="row features"><div class="col-sm-4"><div class="feature-icon-panel"><svg width="36px" height="33px" viewbox="0 0 36 33" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><defs></defs><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-320.000000, -826.000000)" stroke="#333743" stroke-width="2"><g id="Group-7" transform="translate(321.000000, 827.387847)"><path id="Oval-1-Copy-2" d="M17,29.5876845 C17,29.5876845 0.5,15.970603 0.5,10.4351463 C0.5,4.89968971 5.02192403,0.41231548 10.6,0.41231548 C13.0289902,0.41231548 17,3.27642672 17,3.27642672 C17,3.27642672 20.9710098,0.41231548 23.4,0.41231548 C28.978076,0.41231548 33.5,4.89968971 33.5,10.4351463 C33.5,15.970603 17,29.5876845 17,29.5876845 Z"></path><path id="Path-4" d="M8.97721839,4.43098465 C8.97721839,4.43098465 4.65711371,4.98291942 5.76387751,8.9986647"></path></g></g></g></svg></div><h3>Free to use</h3><p>Open sourced under Apache-2.0 License</p></div><div class="col-sm-4"><div class="feature-icon-panel"><svg width="37px" height="36px" viewbox="0 0 37 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><defs><rect id="path-1" x="0.402989808" y="0.675409258" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-2" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-1"></use></mask><rect id="path-3" x="0.402989808" y="19.9416819" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-4" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-3"></use></mask><rect id="path-5" x="20.0265472" y="0.675409258" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-6" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-5"></use></mask><rect id="path-7" x="20.0265472" y="19.9416819" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-8" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-7"></use></mask></defs><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-701.000000, -824.000000)"><g id="Group-12" transform="translate(702.000000, 824.000000)"><use id="Rectangle-2" stroke="#333743" mask="url(#mask-2)" stroke-width="4" xlink:href="#path-1"></use><path id="Line" d="M16.6179041,10.4063517 L0.445091444,10.4063517" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy-3" d="M16.6179041,5.4063517 L0.445091444,5.4063517" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy" d="M6,1.07200204 L6,16.2280375" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy-2" d="M11,1.07200204 L11,16.2280375" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><use id="Rectangle-2-Copy-2" stroke="#333743" mask="url(#mask-4)" stroke-width="4" xlink:href="#path-3"></use><use id="Rectangle-2-Copy" stroke="#333743" mask="url(#mask-6)" stroke-width="4" xlink:href="#path-5"></use><use id="Rectangle-2-Copy-3" stroke="#333743" mask="url(#mask-8)" stroke-width="4" xlink:href="#path-7"></use></g></g></g></svg></div><h3>Rich Features</h3><p>Caters for all needs</p></div><div class="col-sm-4"><div class="feature-icon-panel"><svg width="36px" height="31px" viewbox="0 0 36 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-1084.000000, -827.000000)" fill="#333743"><g id="Group-38" transform="translate(1057.000000, 797.000000)"><path id="Shape" d="M63,56.361686 C63,51.671658 60.3077922,47.6639411 56.5050056,46.0305295 C58.3479474,44.7003672 59.5616758,42.4363346 59.5616758,39.8656065 C59.5616758,36.354116 57.2992585,33.4181102 54.2632182,32.6530946 C54.2357116,32.6462026 54.2082051,32.6496486 54.1841368,32.6599867 C54.1497535,32.6565406 54.1153703,32.6496486 54.0809871,32.6496486 C53.4311438,32.6496486 52.9050802,33.2182413 52.9050802,33.9177826 C52.9050802,34.5518495 53.3348707,35.068752 53.8953176,35.1652404 C53.995029,35.2100386 54.1256853,35.2410528 54.1325619,35.2444988 C55.8895456,35.8889038 57.1582872,37.6842783 57.1582872,39.8001322 C57.1582872,42.1606533 55.5835347,44.1214365 53.5067869,44.5315124 C53.5033486,44.5315124 53.4999103,44.5384045 53.4999103,44.5384045 C52.8088071,44.5866487 52.2586752,45.2000396 52.2586752,45.9581631 C52.2586752,46.7266247 52.8225604,47.3503537 53.5274169,47.3813678 C53.5308552,47.3848138 53.5377318,47.3917059 53.5411702,47.3917059 C57.718734,47.850026 60.6791312,51.688888 60.6791312,56.361686 C60.6791312,57.0543353 61.1983181,57.6160359 61.8412847,57.6160359 C62.4670598,57.6160359 62.9724934,57.0819034 62.9965617,56.4133762 C62.9965617,56.4064842 63,56.4030382 63,56.3961462 L63,56.3892541 L63,56.361686 L63,56.361686 Z M27,55.9123667 C27,51.2223386 29.6922078,47.2146218 33.4949944,45.5812101 C31.6520526,44.2510479 30.4383242,41.9870152 30.4383242,39.4162872 C30.4383242,35.9047967 32.7007415,32.9687909 35.7367818,32.2037753 C35.7642884,32.1968832 35.7917949,32.2003293 35.8158632,32.2106673 C35.8502465,32.2072213 35.8846297,32.2003293 35.9190129,32.2003293 C36.5688562,32.2003293 37.0949198,32.7689219 37.0949198,33.4684632 C37.0949198,34.1025302 36.6651293,34.6194326 36.1046824,34.7159211 C36.004971,34.7607193 35.8743147,34.7917334 35.8674381,34.7951795 C34.1104544,35.4395845 32.8417128,37.2349589 32.8417128,39.3508129 C32.8417128,41.7113339 34.4164653,43.6721172 36.4932131,44.0821931 C36.4966514,44.0821931 36.5000897,44.0890851 36.5000897,44.0890851 C37.1911929,44.1373293 37.7413248,44.7507202 37.7413248,45.5088438 C37.7413248,46.2773054 37.1774396,46.9010343 36.4725831,46.9320485 C36.4691448,46.9354945 36.4622682,46.9423865 36.4588298,46.9423865 C32.281266,47.4007067 29.3208688,51.2395687 29.3208688,55.9123667 C29.3208688,56.6050159 28.8016819,57.1667165 28.1587153,57.1667165 C27.5329402,57.1667165 27.0275066,56.632584 27.0034383,55.9640569 C27.0034383,55.9571649 27,55.9537189 27,55.9468268 L27,55.9399348 L27,55.9123667 L27,55.9123667 Z M49.0919787,46.2372904 C51.2925061,44.645231 52.7434789,41.9401083 52.7434789,38.8662618 C52.7434789,33.9694728 49.0644721,29.9996622 44.5258841,29.9996622 C39.9872962,29.9996622 36.3082893,33.9694728 36.3082893,38.8662618 C36.3082893,41.9401083 37.7592621,44.645231 39.9597896,46.2372904 C35.4074484,48.1980736 32.1926153,52.9914822 32.1926153,58.6015965 C32.1926153,58.91863 32.2098069,59.2287715 32.2304368,59.5389129 L32.2338752,59.5389129 C32.2338752,60.2212241 32.7461855,60.7760327 33.3788371,60.7760327 C34.0114888,60.7760327 34.5237991,60.2246701 34.5237991,59.5389129 C34.5237991,59.5010067 34.5169224,59.4631006 34.5134841,59.4251944 C34.4928542,59.1529591 34.4722242,58.8807238 34.4722242,58.6015965 C34.4722242,52.6089744 38.9729906,47.7535376 44.5224458,47.7535376 C50.0753394,47.7535376 54.5761057,52.6089744 54.5761057,58.6015965 C54.5761057,58.8910619 54.5554758,59.1736352 54.5348458,59.4562085 C54.5348458,59.4699926 54.5314075,59.4837767 54.5314075,59.4975607 L54.5314075,59.5354669 L54.5348458,59.5354669 C54.5554758,60.200548 55.0574711,60.7346805 55.6763695,60.7346805 C56.2952678,60.7346805 56.7972632,60.200548 56.8178931,59.5354669 L56.8213314,59.5354669 C56.8419614,59.2253255 56.859153,58.915184 56.859153,58.6015965 C56.8557147,52.9914822 53.6374432,48.1980736 49.0919787,46.2372904 L49.0919787,46.2372904 Z M44.5224458,45.2379457 C41.2629145,45.2379457 38.6188432,42.3846443 38.6188432,38.8662618 C38.6188432,35.3478793 41.2629145,32.4945779 44.5224458,32.4945779 C47.7819771,32.4945779 50.4260484,35.3478793 50.4260484,38.8662618 C50.4260484,42.3846443 47.7819771,45.2379457 44.5224458,45.2379457 L44.5224458,45.2379457 Z"></path></g></g></g></svg></div><h3>Active Community</h3><p><!-- Place this tag where you want the button to render. -->
 <a class="github-button" href="https://github.com/apache/incubator-echarts" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star apache/incubator-echarts on GitHub">GitHub Stars</a></p></div></div><div id="feature-4" class="row feature-detail"><div class="col-sm-4 col"><h2>Brand-new v4.0</h2><p>Rendering ability for ten-million-level data</p><p>Supports both SVG and Canvas rendering</p><p>Seperates data and style configuring</p><p>Accessibility supports</p><p>Wechart and Powerpoint supports</p><div class="feature-btn"><a href="./tutorial.html">Learn More<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><video id="video-feature-4" loop="true" muted="true" data-src="https://echarts.apache.org/en/video/feature-4.mp4" poster="https://echarts.apache.org/en/video/feature-4.jpg?_v_=20200710_1" class="lazy feature-video"></video><a id="video-feature-4-play" href="javascript:;" onclick="playVideo(&quot;video-feature-4&quot;)" class="feature-play-btn video-play-btn video-btn"><svg width="19px" height="25px" viewBox="0 0 19 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-23.000000, -18.000000)" fill="#AA344C"><path d="M41.365908,29.4271388 L41.3664843,29.4265626 L26.3794329,19.1497136 L26.3747509,19.1541315 C26.0642269,18.8592621 25.6429678,18.677793 25.1786824,18.677793 C24.2236284,18.677793 23.4494433,19.4443188 23.4494433,20.3905371 C23.4494433,20.910214 23.4270417,21.9276946 23.4494433,21.9056292 L23.4494433,30.6673861 L23.4494433,39.8901629 C23.4494433,39.8977982 23.4494433,40.4825908 23.4494433,40.9444991 C23.4494433,41.8901412 24.2236284,42.656691 25.1786824,42.656691 C25.6447205,42.656691 26.0677564,42.4740454 26.3782564,42.1764869 L26.3794329,42.1770872 L41.3664843,31.9005503 L41.3659081,31.8996379 C41.6917266,31.5882735 41.894997,31.1514078 41.894997,30.6670739 C41.894997,30.6658974 41.894997,30.6650091 41.894997,30.6635444 C41.894997,30.6623679 41.894997,30.6609273 41.894997,30.6600389 C41.894997,30.175657 41.6917265,29.7384792 41.365908,29.4271388 Z"></path></g></g></svg></a><a id="video-feature-4-pause" href="javascript:;" onclick="pauseVideo(&quot;video-feature-4&quot;)" class="feature-play-btn video-pause-btn video-btn"><svg width="17px" height="22px" viewBox="0 0 17 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-22.000000, -19.000000)" fill="#AA344C"><g transform="translate(22.667242, 19.000000)"><path d="M2,0 C3.1045695,-2.02906125e-16 4,0.8954305 4,2 L4,20 C4,21.1045695 3.1045695,22 2,22 C0.8954305,22 1.3527075e-16,21.1045695 0,20 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 Z M14,0 C15.1045695,-2.02906125e-16 16,0.8954305 16,2 L16,20 C16,21.1045695 15.1045695,22 14,22 C12.8954305,22 12,21.1045695 12,20 L12,2 C12,0.8954305 12.8954305,2.02906125e-16 14,0 Z"></path></g></g></g></svg></a></div></div><div id="feature-dimension" class="row feature-detail"><div class="col-sm-4 col mobile"><h2>Multi-dimension data analysis</h2><h3>Brush data for detail</h3><p>Dig more out of data</p><h3>Multi-chart interaction</h3><p>Analysis the relationship between multiple charts</p><div class="feature-btn"><a href="./tutorial.html">Learn More<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><div id="col-desktop"><img data-src="https://echarts.apache.org/en/images/feature-1.png?_v_=20200710_1" class="lazy"><video id="video-feature-1" loop="true" muted="true" data-src="https://echarts.apache.org/en/video/feature-1.mp4" poster="https://echarts.apache.org/en/video/feature-2.jpg?_v_=20200710_1" class="lazy feature-video"></video><a id="video-feature-1-play" href="javascript:;" onclick="playVideo(&quot;video-feature-1&quot;)" class="feature-play-btn video-play-btn video-btn"><svg width="19px" height="25px" viewBox="0 0 19 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-23.000000, -18.000000)" fill="#AA344C"><path d="M41.365908,29.4271388 L41.3664843,29.4265626 L26.3794329,19.1497136 L26.3747509,19.1541315 C26.0642269,18.8592621 25.6429678,18.677793 25.1786824,18.677793 C24.2236284,18.677793 23.4494433,19.4443188 23.4494433,20.3905371 C23.4494433,20.910214 23.4270417,21.9276946 23.4494433,21.9056292 L23.4494433,30.6673861 L23.4494433,39.8901629 C23.4494433,39.8977982 23.4494433,40.4825908 23.4494433,40.9444991 C23.4494433,41.8901412 24.2236284,42.656691 25.1786824,42.656691 C25.6447205,42.656691 26.0677564,42.4740454 26.3782564,42.1764869 L26.3794329,42.1770872 L41.3664843,31.9005503 L41.3659081,31.8996379 C41.6917266,31.5882735 41.894997,31.1514078 41.894997,30.6670739 C41.894997,30.6658974 41.894997,30.6650091 41.894997,30.6635444 C41.894997,30.6623679 41.894997,30.6609273 41.894997,30.6600389 C41.894997,30.175657 41.6917265,29.7384792 41.365908,29.4271388 Z"></path></g></g></svg></a><a id="video-feature-1-pause" href="javascript:;" onclick="pauseVideo(&quot;video-feature-1&quot;)" class="feature-play-btn video-pause-btn video-btn"><svg width="17px" height="22px" viewBox="0 0 17 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-22.000000, -19.000000)" fill="#AA344C"><g transform="translate(22.667242, 19.000000)"><path d="M2,0 C3.1045695,-2.02906125e-16 4,0.8954305 4,2 L4,20 C4,21.1045695 3.1045695,22 2,22 C0.8954305,22 1.3527075e-16,21.1045695 0,20 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 Z M14,0 C15.1045695,-2.02906125e-16 16,0.8954305 16,2 L16,20 C16,21.1045695 15.1045695,22 14,22 C12.8954305,22 12,21.1045695 12,20 L12,2 C12,0.8954305 12.8954305,2.02906125e-16 14,0 Z"></path></g></g></g></svg></a></div></div><div id="col-analysis" class="col-sm-4 col pc"><h2>Multi-dimension data analysis</h2><h3>Brush data for detail</h3><p>Dig more out of data</p><h3>Multi-chart interaction</h3><p>Analysis the relationship between multiple charts</p><div class="feature-btn"><a href="./tutorial.html">Learn More<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div></div><div class="row feature-detail"><div id="col-data" class="col-sm-4 col"><h2>Charts for all sized devices</h2><h3>PC / Phone / Pad / Large Screen ...</h3><p>Responsive design for all devices</p><div class="feature-btn"><a href="./tutorial.html">Learn More<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><div id="col-desktop"><img data-src="https://echarts.apache.org/en/images/index-feature.jpg?_v_=20200710_1" class="lazy"></div></div><script type="text/javascript">window.supportTouch && (document.getElementById('ch-main').className += ' ch-on-touch');
-</script></div></div></section><section id="publication"><div class="container"><div class="col-sm-8 col"><h2>ECharts: A Declarative Framework for Rapid Construction of Web-based Visualization</h2><p class="note"><i class="note-icon"><img classs="lazy" data-src="https://echarts.apache.org/en/images/note.svg?_v_=20200710_1" /></i> Please cite the following paper whenever you use ECharts in your R&D projects, products, research papers, technical reports, news reports, books, presentations, teaching, patents, and other related intelligence activities.</p><p class="link">Visual Informatics, 2018<a href="https://www.sciencedirect.com/science/article/pii/S2468502X18300068">[PDF]</a></p></div><div class="col-sm-4 col"><div class="img-container"><img data-src="https://echarts.apache.org/en/images/pipeline.jpg?_v_=20200710_1" alt="" class="lazy"></div></div></div></section><section id="about-section" class="normal"><div class="container"><h3>Follow Us</h3><p>You may follow Apache ECharts (incubating) to keep informed.</p><div class="btn-panel"><a id="btn-github" href="https://github.com/apache/incubator-echarts"><div class="btn-content"><img data-src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1" class="lazy"><span>GitHub</span></div><div class="btn-shadow"></div></a><a id="btn-weibo" href="https://weibo.com/echarts"><div class="btn-content"><img data-src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1" class="lazy"><span>Weibo</span></div><div class="btn-shadow"></div></a><a id="btn-twitter" href="https://twitter.com/echartsjs"><div class="btn-content"><img data-src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1" class="lazy"><span>Twitter</span></div><div class="btn-shadow"></div></a></div></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script>window.lazyLoadOptions = {
+</script></div></div></section><section id="publication"><div class="container"><div class="col-sm-8 col"><h2>ECharts: A Declarative Framework for Rapid Construction of Web-based Visualization</h2><p class="note"><i class="note-icon"><img classs="lazy" data-src="https://echarts.apache.org/en/images/note.svg?_v_=20200710_1" /></i> Please cite the following paper whenever you use ECharts in your R&D projects, products, research papers, technical reports, news reports, books, presentations, teaching, patents, and other related intelligence activities.</p><p class="link">Visual Informatics, 2018<a href="https://www.sciencedirect.com/science/article/pii/S2468502X18300068">[PDF]</a></p></div><div class="col-sm-4 col"><div class="img-container"><img data-src="https://echarts.apache.org/en/images/pipeline.jpg?_v_=20200710_1" alt="" class="lazy"></div></div></div></section><section id="about-section" class="normal"><div class="container"><h3>Follow Us</h3><p>You may follow Apache ECharts (incubating) to keep informed.</p><div class="btn-panel"><a id="btn-github" href="https://github.com/apache/incubator-echarts"><div class="btn-content"><img data-src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1" class="lazy"><span>GitHub</span></div><div class="btn-shadow"></div></a><a id="btn-weibo" href="https://weibo.com/echarts"><div class="btn-content"><img data-src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1" class="lazy"><span>Weibo</span></div><div class="btn-shadow"></div></a><a id="btn-twitter" href="https://twitter.com/echartsjs"><div class="btn-content"><img data-src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1" class="lazy"><span>Twitter</span></div><div class="btn-shadow"></div></a></div></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script>window.lazyLoadOptions = {
     elements_selector: ".lazy"
-};</script><script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@12.0.0/dist/lazyload.min.js"></script><script src="https://echarts.apache.org/en/js/index.js?_v_=1598903776431"></script><script async defer src="https://buttons.github.io/buttons.js"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+};</script><script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@12.0.0/dist/lazyload.min.js"></script><script src="https://echarts.apache.org/en/js/index.js?_v_=1603774175523"></script><script async defer src="https://buttons.github.io/buttons.js"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/js/doc-bundle.js b/en/js/doc-bundle.js
index 6b8199a..2db769c 100644
--- a/en/js/doc-bundle.js
+++ b/en/js/doc-bundle.js
@@ -5,4 +5,4 @@
 * Copyright (c) 2014–2018, Julian Kühnel
 * Released under the MIT license https://git.io/vwTVl
 *****************************************************/
-e.exports=function(){"use strict";var e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},t=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},n=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},a=function(){function e(n){var r=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:5e3;t(this,e),this.ctx=n,this.iframes=r,this.exclude=a,this.iframesTimeout=i}return n(e,[{key:"getContexts",value:function(){var e=[];return(void 0!==this.ctx&&this.ctx?NodeList.prototype.isPrototypeOf(this.ctx)?Array.prototype.slice.call(this.ctx):Array.isArray(this.ctx)?this.ctx:"string"==typeof this.ctx?Array.prototype.slice.call(document.querySelectorAll(this.ctx)):[this.ctx]:[]).forEach((function(t){var n=e.filter((function(e){return e.contains(t)})).length>0;-1!==e.indexOf(t)||n||e.push(t)})),e}},{key:"getIframeContents",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},r=void 0;try{var a=e.contentWindow;if(r=a.document,!a||!r)throw new Error("iframe inaccessible")}catch(e){n()}r&&t(r)}},{key:"isIframeBlank",value:function(e){var t="about:blank",n=e.getAttribute("src").trim();return e.contentWindow.location.href===t&&n!==t&&n}},{key:"observeIframeLoad",value:function(e,t,n){var r=this,a=!1,i=null,o=function o(){if(!a){a=!0,clearTimeout(i);try{r.isIframeBlank(e)||(e.removeEventListener("load",o),r.getIframeContents(e,t,n))}catch(e){n()}}};e.addEventListener("load",o),i=setTimeout(o,this.iframesTimeout)}},{key:"onIframeReady",value:function(e,t,n){try{"complete"===e.contentWindow.document.readyState?this.isIframeBlank(e)?this.observeIframeLoad(e,t,n):this.getIframeContents(e,t,n):this.observeIframeLoad(e,t,n)}catch(e){n()}}},{key:"waitForIframes",value:function(e,t){var n=this,r=0;this.forEachIframe(e,(function(){return!0}),(function(e){r++,n.waitForIframes(e.querySelector("html"),(function(){--r||t()}))}),(function(e){e||t()}))}},{key:"forEachIframe",value:function(t,n,r){var a=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},o=t.querySelectorAll("iframe"),s=o.length,l=0;o=Array.prototype.slice.call(o);var c=function(){--s<=0&&i(l)};s||c(),o.forEach((function(t){e.matches(t,a.exclude)?c():a.onIframeReady(t,(function(e){n(t)&&(l++,r(e)),c()}),c)}))}},{key:"createIterator",value:function(e,t,n){return document.createNodeIterator(e,t,n,!1)}},{key:"createInstanceOnIframe",value:function(t){return new e(t.querySelector("html"),this.iframes)}},{key:"compareNodeIframe",value:function(e,t,n){if(e.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_PRECEDING){if(null===t)return!0;if(t.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_FOLLOWING)return!0}return!1}},{key:"getIteratorNode",value:function(e){var t=e.previousNode();return{prevNode:t,node:(null===t||e.nextNode())&&e.nextNode()}}},{key:"checkIframeFilter",value:function(e,t,n,r){var a=!1,i=!1;return r.forEach((function(e,t){e.val===n&&(a=t,i=e.handled)})),this.compareNodeIframe(e,t,n)?(!1!==a||i?!1===a||i||(r[a].handled=!0):r.push({val:n,handled:!0}),!0):(!1===a&&r.push({val:n,handled:!1}),!1)}},{key:"handleOpenIframes",value:function(e,t,n,r){var a=this;e.forEach((function(e){e.handled||a.getIframeContents(e.val,(function(e){a.createInstanceOnIframe(e).forEachNode(t,n,r)}))}))}},{key:"iterateThroughNodes",value:function(e,t,n,r,a){for(var i,o=this,s=this.createIterator(t,e,r),l=[],c=[],u=void 0,h=void 0;i=void 0,i=o.getIteratorNode(s),h=i.prevNode,u=i.node;)this.iframes&&this.forEachIframe(t,(function(e){return o.checkIframeFilter(u,h,e,l)}),(function(t){o.createInstanceOnIframe(t).forEachNode(e,(function(e){return c.push(e)}),r)})),c.push(u);c.forEach((function(e){n(e)})),this.iframes&&this.handleOpenIframes(l,e,n,r),a()}},{key:"forEachNode",value:function(e,t,n){var r=this,a=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},i=this.getContexts(),o=i.length;o||a(),i.forEach((function(i){var s=function(){r.iterateThroughNodes(e,i,t,n,(function(){--o<=0&&a()}))};r.iframes?r.waitForIframes(i,s):s()}))}}],[{key:"matches",value:function(e,t){var n="string"==typeof t?[t]:t,r=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector;if(r){var a=!1;return n.every((function(t){return!r.call(e,t)||(a=!0,!1)})),a}return!1}}]),e}(),i=function(){function i(e){t(this,i),this.ctx=e,this.ie=!1;var n=window.navigator.userAgent;(n.indexOf("MSIE")>-1||n.indexOf("Trident")>-1)&&(this.ie=!0)}return n(i,[{key:"log",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"debug",r=this.opt.log;this.opt.debug&&"object"===(void 0===r?"undefined":e(r))&&"function"==typeof r[n]&&r[n]("mark.js: "+t)}},{key:"escapeStr",value:function(e){return e.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g,"\\$&")}},{key:"createRegExp",value:function(e){return"disabled"!==this.opt.wildcards&&(e=this.setupWildcardsRegExp(e)),e=this.escapeStr(e),Object.keys(this.opt.synonyms).length&&(e=this.createSynonymsRegExp(e)),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),this.opt.diacritics&&(e=this.createDiacriticsRegExp(e)),e=this.createMergedBlanksRegExp(e),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.createJoinersRegExp(e)),"disabled"!==this.opt.wildcards&&(e=this.createWildcardsRegExp(e)),e=this.createAccuracyRegExp(e)}},{key:"createSynonymsRegExp",value:function(e){var t=this.opt.synonyms,n=this.opt.caseSensitive?"":"i",r=this.opt.ignoreJoiners||this.opt.ignorePunctuation.length?"\0":"";for(var a in t)if(t.hasOwnProperty(a)){var i=t[a],o="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(a):this.escapeStr(a),s="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(i):this.escapeStr(i);""!==o&&""!==s&&(e=e.replace(new RegExp("("+this.escapeStr(o)+"|"+this.escapeStr(s)+")","gm"+n),r+"("+this.processSynomyms(o)+"|"+this.processSynomyms(s)+")"+r))}return e}},{key:"processSynomyms",value:function(e){return(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),e}},{key:"setupWildcardsRegExp",value:function(e){return(e=e.replace(/(?:\\)*\?/g,(function(e){return"\\"===e.charAt(0)?"?":""}))).replace(/(?:\\)*\*/g,(function(e){return"\\"===e.charAt(0)?"*":""}))}},{key:"createWildcardsRegExp",value:function(e){var t="withSpaces"===this.opt.wildcards;return e.replace(/\u0001/g,t?"[\\S\\s]?":"\\S?").replace(/\u0002/g,t?"[\\S\\s]*?":"\\S*")}},{key:"setupIgnoreJoinersRegExp",value:function(e){return e.replace(/[^(|)\\]/g,(function(e,t,n){var r=n.charAt(t+1);return/[(|)\\]/.test(r)||""===r?e:e+"\0"}))}},{key:"createJoinersRegExp",value:function(e){var t=[],n=this.opt.ignorePunctuation;return Array.isArray(n)&&n.length&&t.push(this.escapeStr(n.join(""))),this.opt.ignoreJoiners&&t.push("\\u00ad\\u200b\\u200c\\u200d"),t.length?e.split(/\u0000+/).join("["+t.join("")+"]*"):e}},{key:"createDiacriticsRegExp",value:function(e){var t=this.opt.caseSensitive?"":"i",n=this.opt.caseSensitive?["aàáảãạăằắẳẵặâầấẩẫậäåāą","AÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćč","CÇĆČ","dđď","DĐĎ","eèéẻẽẹêềếểễệëěēę","EÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïī","IÌÍỈĨỊÎÏĪ","lł","LŁ","nñňń","NÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøō","OÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rř","RŘ","sšśșş","SŠŚȘŞ","tťțţ","TŤȚŢ","uùúủũụưừứửữựûüůū","UÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿ","YÝỲỶỸỴŸ","zžżź","ZŽŻŹ"]:["aàáảãạăằắẳẵặâầấẩẫậäåāąAÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćčCÇĆČ","dđďDĐĎ","eèéẻẽẹêềếểễệëěēęEÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïīIÌÍỈĨỊÎÏĪ","lłLŁ","nñňńNÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøōOÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rřRŘ","sšśșşSŠŚȘŞ","tťțţTŤȚŢ","uùúủũụưừứửữựûüůūUÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿYÝỲỶỸỴŸ","zžżźZŽŻŹ"],r=[];return e.split("").forEach((function(a){n.every((function(n){if(-1!==n.indexOf(a)){if(r.indexOf(n)>-1)return!1;e=e.replace(new RegExp("["+n+"]","gm"+t),"["+n+"]"),r.push(n)}return!0}))})),e}},{key:"createMergedBlanksRegExp",value:function(e){return e.replace(/[\s]+/gim,"[\\s]+")}},{key:"createAccuracyRegExp",value:function(e){var t=this,n=this.opt.accuracy,r="string"==typeof n?n:n.value,a="string"==typeof n?[]:n.limiters,i="";switch(a.forEach((function(e){i+="|"+t.escapeStr(e)})),r){case"partially":default:return"()("+e+")";case"complementary":return"()([^"+(i="\\s"+(i||this.escapeStr("!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~¡¿")))+"]*"+e+"[^"+i+"]*)";case"exactly":return"(^|\\s"+i+")("+e+")(?=$|\\s"+i+")"}}},{key:"getSeparatedKeywords",value:function(e){var t=this,n=[];return e.forEach((function(e){t.opt.separateWordSearch?e.split(" ").forEach((function(e){e.trim()&&-1===n.indexOf(e)&&n.push(e)})):e.trim()&&-1===n.indexOf(e)&&n.push(e)})),{keywords:n.sort((function(e,t){return t.length-e.length})),length:n.length}}},{key:"isNumeric",value:function(e){return Number(parseFloat(e))==e}},{key:"checkRanges",value:function(e){var t=this;if(!Array.isArray(e)||"[object Object]"!==Object.prototype.toString.call(e[0]))return this.log("markRanges() will only accept an array of objects"),this.opt.noMatch(e),[];var n=[],r=0;return e.sort((function(e,t){return e.start-t.start})).forEach((function(e){var a=t.callNoMatchOnInvalidRanges(e,r),i=a.start,o=a.end;a.valid&&(e.start=i,e.length=o-i,n.push(e),r=o)})),n}},{key:"callNoMatchOnInvalidRanges",value:function(e,t){var n=void 0,r=void 0,a=!1;return e&&void 0!==e.start?(r=(n=parseInt(e.start,10))+parseInt(e.length,10),this.isNumeric(e.start)&&this.isNumeric(e.length)&&r-t>0&&r-n>0?a=!0:(this.log("Ignoring invalid or overlapping range: "+JSON.stringify(e)),this.opt.noMatch(e))):(this.log("Ignoring invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:n,end:r,valid:a}}},{key:"checkWhitespaceRanges",value:function(e,t,n){var r=void 0,a=!0,i=n.length,o=t-i,s=parseInt(e.start,10)-o;return(r=(s=s>i?i:s)+parseInt(e.length,10))>i&&(r=i,this.log("End range automatically set to the max value of "+i)),s<0||r-s<0||s>i||r>i?(a=!1,this.log("Invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)):""===n.substring(s,r).replace(/\s+/g,"")&&(a=!1,this.log("Skipping whitespace only range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:s,end:r,valid:a}}},{key:"getTextNodes",value:function(e){var t=this,n="",r=[];this.iterator.forEachNode(NodeFilter.SHOW_TEXT,(function(e){r.push({start:n.length,end:(n+=e.textContent).length,node:e})}),(function(e){return t.matchesExclude(e.parentNode)?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),(function(){e({value:n,nodes:r})}))}},{key:"matchesExclude",value:function(e){return a.matches(e,this.opt.exclude.concat(["script","style","title","head","html"]))}},{key:"wrapRangeInTextNode",value:function(e,t,n){var r=this.opt.element?this.opt.element:"mark",a=e.splitText(t),i=a.splitText(n-t),o=document.createElement(r);return o.setAttribute("data-markjs","true"),this.opt.className&&o.setAttribute("class",this.opt.className),o.textContent=a.textContent,a.parentNode.replaceChild(o,a),i}},{key:"wrapRangeInMappedTextNode",value:function(e,t,n,r,a){var i=this;e.nodes.every((function(o,s){var l=e.nodes[s+1];if(void 0===l||l.start>t){if(!r(o.node))return!1;var c=t-o.start,u=(n>o.end?o.end:n)-o.start,h=e.value.substr(0,o.start),p=e.value.substr(u+o.start);if(o.node=i.wrapRangeInTextNode(o.node,c,u),e.value=h+p,e.nodes.forEach((function(t,n){n>=s&&(e.nodes[n].start>0&&n!==s&&(e.nodes[n].start-=u),e.nodes[n].end-=u)})),n-=u,a(o.node.previousSibling,o.start),!(n>o.end))return!1;t=o.end}return!0}))}},{key:"wrapMatches",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){t.nodes.forEach((function(t){t=t.node;for(var a=void 0;null!==(a=e.exec(t.textContent))&&""!==a[o];)if(n(a[o],t)){var s=a.index;if(0!==o)for(var l=1;l<o;l++)s+=a[l].length;t=i.wrapRangeInTextNode(t,s,s+a[o].length),r(t.previousSibling),e.lastIndex=0}})),a()}))}},{key:"wrapMatchesAcrossElements",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){for(var s=void 0;null!==(s=e.exec(t.value))&&""!==s[o];){var l=s.index;if(0!==o)for(var c=1;c<o;c++)l+=s[c].length;var u=l+s[o].length;i.wrapRangeInMappedTextNode(t,l,u,(function(e){return n(s[o],e)}),(function(t,n){e.lastIndex=n,r(t)}))}a()}))}},{key:"wrapRangeFromIndex",value:function(e,t,n,r){var a=this;this.getTextNodes((function(i){var o=i.value.length;e.forEach((function(e,r){var s=a.checkWhitespaceRanges(e,o,i.value),l=s.start,c=s.end;s.valid&&a.wrapRangeInMappedTextNode(i,l,c,(function(n){return t(n,e,i.value.substring(l,c),r)}),(function(t){n(t,e)}))})),r()}))}},{key:"unwrapMatches",value:function(e){for(var t=e.parentNode,n=document.createDocumentFragment();e.firstChild;)n.appendChild(e.removeChild(e.firstChild));t.replaceChild(n,e),this.ie?this.normalizeTextNode(t):t.normalize()}},{key:"normalizeTextNode",value:function(e){if(e){if(3===e.nodeType)for(;e.nextSibling&&3===e.nextSibling.nodeType;)e.nodeValue+=e.nextSibling.nodeValue,e.parentNode.removeChild(e.nextSibling);else this.normalizeTextNode(e.firstChild);this.normalizeTextNode(e.nextSibling)}}},{key:"markRegExp",value:function(e,t){var n=this;this.opt=t,this.log('Searching with expression "'+e+'"');var r=0,a="wrapMatches";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),this[a](e,this.opt.ignoreGroups,(function(e,t){return n.opt.filter(t,e,r)}),(function(e){r++,n.opt.each(e)}),(function(){0===r&&n.opt.noMatch(e),n.opt.done(r)}))}},{key:"mark",value:function(e,t){var n=this;this.opt=t;var r=0,a="wrapMatches",i=this.getSeparatedKeywords("string"==typeof e?[e]:e),o=i.keywords,s=i.length,l=this.opt.caseSensitive?"":"i";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),0===s?this.opt.done(r):function e(t){var i=new RegExp(n.createRegExp(t),"gm"+l),c=0;n.log('Searching with expression "'+i+'"'),n[a](i,1,(function(e,a){return n.opt.filter(a,t,r,c)}),(function(e){c++,r++,n.opt.each(e)}),(function(){0===c&&n.opt.noMatch(t),o[s-1]===t?n.opt.done(r):e(o[o.indexOf(t)+1])}))}(o[0])}},{key:"markRanges",value:function(e,t){var n=this;this.opt=t;var r=0,a=this.checkRanges(e);a&&a.length?(this.log("Starting to mark with the following ranges: "+JSON.stringify(a)),this.wrapRangeFromIndex(a,(function(e,t,r,a){return n.opt.filter(e,t,r,a)}),(function(e,t){r++,n.opt.each(e,t)}),(function(){n.opt.done(r)}))):this.opt.done(r)}},{key:"unmark",value:function(e){var t=this;this.opt=e;var n=this.opt.element?this.opt.element:"*";n+="[data-markjs]",this.opt.className&&(n+="."+this.opt.className),this.log('Removal selector "'+n+'"'),this.iterator.forEachNode(NodeFilter.SHOW_ELEMENT,(function(e){t.unwrapMatches(e)}),(function(e){var r=a.matches(e,n),i=t.matchesExclude(e);return!r||i?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),this.opt.done)}},{key:"opt",set:function(e){this._opt=r({},{element:"",className:"",exclude:[],iframes:!1,iframesTimeout:5e3,separateWordSearch:!0,diacritics:!0,synonyms:{},accuracy:"partially",acrossElements:!1,caseSensitive:!1,ignoreJoiners:!1,ignoreGroups:0,ignorePunctuation:[],wildcards:"disabled",each:function(){},noMatch:function(){},filter:function(){return!0},done:function(){},debug:!1,log:window.console},e)},get:function(){return this._opt}},{key:"iterator",get:function(){return new a(this.ctx,this.opt.iframes,this.opt.exclude,this.opt.iframesTimeout)}}]),i}();return function(e){var t=this,n=new i(e);return this.mark=function(e,r){return n.mark(e,r),t},this.markRegExp=function(e,r){return n.markRegExp(e,r),t},this.markRanges=function(e,r){return n.markRanges(e,r),t},this.unmark=function(e){return n.unmark(e),t},this}}()},function(e,t,n){(function(t){var n=/^\s+|\s+$/g,r=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,i=/^0o[0-7]+$/i,o=parseInt,s="object"==typeof t&&t&&t.Object===Object&&t,l="object"==typeof self&&self&&self.Object===Object&&self,c=s||l||Function("return this")(),u=Object.prototype.toString,h=Math.max,p=Math.min,f=function(){return c.Date.now()};function d(e){var t=typeof e;return!!e&&("object"==t||"function"==t)}function m(e){if("number"==typeof e)return e;if(function(e){return"symbol"==typeof e||function(e){return!!e&&"object"==typeof e}(e)&&"[object Symbol]"==u.call(e)}(e))return NaN;if(d(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=d(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=e.replace(n,"");var s=a.test(e);return s||i.test(e)?o(e.slice(2),s?2:8):r.test(e)?NaN:+e}e.exports=function(e,t,n){var r,a,i,o,s,l,c=0,u=!1,v=!1,g=!0;if("function"!=typeof e)throw new TypeError("Expected a function");function _(t){var n=r,i=a;return r=a=void 0,c=t,o=e.apply(i,n)}function y(e){return c=e,s=setTimeout(x,t),u?_(e):o}function b(e){var n=e-l;return void 0===l||n>=t||n<0||v&&e-c>=i}function x(){var e=f();if(b(e))return E(e);s=setTimeout(x,function(e){var n=t-(e-l);return v?p(n,i-(e-c)):n}(e))}function E(e){return s=void 0,g&&r?_(e):(r=a=void 0,o)}function w(){var e=f(),n=b(e);if(r=arguments,a=this,l=e,n){if(void 0===s)return y(l);if(v)return s=setTimeout(x,t),_(l)}return void 0===s&&(s=setTimeout(x,t)),o}return t=m(t)||0,d(n)&&(u=!!n.leading,i=(v="maxWait"in n)?h(m(n.maxWait)||0,t):i,g="trailing"in n?!!n.trailing:g),w.cancel=function(){void 0!==s&&clearTimeout(s),c=0,r=l=a=s=void 0},w.flush=function(){return void 0===s?o:E(f())},w}}).call(this,n(22))},function(e,t,n){"use strict";var r=n(2);n.n(r).a},function(e,t,n){"use strict";var r=n(3);n.n(r).a},function(e,t,n){"use strict";var r=n(4);n.n(r).a},function(e,t,n){"use strict";var r=n(5);n.n(r).a},function(e,t,n){"use strict";var r=n(6);n.n(r).a},function(e,t,n){"use strict";var r=n(7);n.n(r).a},function(e,t,n){"use strict";var r=n(8);n.n(r).a},function(e,t,n){"use strict";var r=n(9);n.n(r).a},function(e,t,n){"use strict";var r=n(10);n.n(r).a},function(e,t,n){"use strict";var r=n(11);n.n(r).a},function(e,t,n){},function(e,t,n){},function(e,t,n){"use strict";var r=n(12);n.n(r).a},function(e,t,n){"use strict";var r=n(13);n.n(r).a},function(e,t,n){"use strict";var r=n(14);n.n(r).a},function(e,t,n){"use strict";var r=n(15);n.n(r).a},function(e,t,n){"use strict";var r=n(16);n.n(r).a},function(e,t,n){"use strict";var r=n(17);n.n(r).a},function(e,t,n){"use strict";var r=n(18);n.n(r).a},function(e,t,n){},function(e,t,n){"use strict";n.r(t),n.d(t,"init",(function(){return fr}));var r=n(0),a=n.n(r),i=["style","currency","currencyDisplay","useGrouping","minimumIntegerDigits","minimumFractionDigits","maximumFractionDigits","minimumSignificantDigits","maximumSignificantDigits","localeMatcher","formatMatcher","unit"];function o(e,t){"undefined"!=typeof console&&(console.warn("[vue-i18n] "+e),t&&console.warn(t.stack))}var s=Array.isArray;function l(e){return null!==e&&"object"==typeof e}function c(e){return"string"==typeof e}var u=Object.prototype.toString;function h(e){return"[object Object]"===u.call(e)}function p(e){return null==e}function f(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];var n=null,r=null;return 1===e.length?l(e[0])||Array.isArray(e[0])?r=e[0]:"string"==typeof e[0]&&(n=e[0]):2===e.length&&("string"==typeof e[0]&&(n=e[0]),(l(e[1])||Array.isArray(e[1]))&&(r=e[1])),{locale:n,params:r}}function d(e){return JSON.parse(JSON.stringify(e))}function m(e,t){return!!~e.indexOf(t)}var v=Object.prototype.hasOwnProperty;function g(e,t){return v.call(e,t)}function _(e){for(var t=arguments,n=Object(e),r=1;r<arguments.length;r++){var a=t[r];if(null!=a){var i=void 0;for(i in a)g(a,i)&&(l(a[i])?n[i]=_(n[i],a[i]):n[i]=a[i])}}return n}function y(e,t){if(e===t)return!0;var n=l(e),r=l(t);if(!n||!r)return!n&&!r&&String(e)===String(t);try{var a=Array.isArray(e),i=Array.isArray(t);if(a&&i)return e.length===t.length&&e.every((function(e,n){return y(e,t[n])}));if(a||i)return!1;var o=Object.keys(e),s=Object.keys(t);return o.length===s.length&&o.every((function(n){return y(e[n],t[n])}))}catch(e){return!1}}var b={beforeCreate:function(){var e=this.$options;if(e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n)if(e.i18n instanceof J){if(e.__i18n)try{var t={};e.__i18n.forEach((function(e){t=_(t,JSON.parse(e))})),Object.keys(t).forEach((function(n){e.i18n.mergeLocaleMessage(n,t[n])}))}catch(e){0}this._i18n=e.i18n,this._i18nWatcher=this._i18n.watchI18nData()}else if(h(e.i18n)){var n=this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this.$root.$i18n:null;if(n&&(e.i18n.root=this.$root,e.i18n.formatter=n.formatter,e.i18n.fallbackLocale=n.fallbackLocale,e.i18n.formatFallbackMessages=n.formatFallbackMessages,e.i18n.silentTranslationWarn=n.silentTranslationWarn,e.i18n.silentFallbackWarn=n.silentFallbackWarn,e.i18n.pluralizationRules=n.pluralizationRules,e.i18n.preserveDirectiveContent=n.preserveDirectiveContent),e.__i18n)try{var r={};e.__i18n.forEach((function(e){r=_(r,JSON.parse(e))})),e.i18n.messages=r}catch(e){0}var a=e.i18n.sharedMessages;a&&h(a)&&(e.i18n.messages=_(e.i18n.messages,a)),this._i18n=new J(e.i18n),this._i18nWatcher=this._i18n.watchI18nData(),(void 0===e.i18n.sync||e.i18n.sync)&&(this._localeWatcher=this.$i18n.watchLocale()),n&&n.onComponentInstanceCreated(this._i18n)}else 0;else this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this._i18n=this.$root.$i18n:e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J&&(this._i18n=e.parent.$i18n)},beforeMount:function(){var e=this.$options;e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n?(e.i18n instanceof J||h(e.i18n))&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0):(this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J||e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J)&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0)},beforeDestroy:function(){if(this._i18n){var e=this;this.$nextTick((function(){e._subscribing&&(e._i18n.unsubscribeDataChanging(e),delete e._subscribing),e._i18nWatcher&&(e._i18nWatcher(),e._i18n.destroyVM(),delete e._i18nWatcher),e._localeWatcher&&(e._localeWatcher(),delete e._localeWatcher)}))}}},x={name:"i18n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},path:{type:String,required:!0},locale:{type:String},places:{type:[Array,Object]}},render:function(e,t){var n=t.data,r=t.parent,a=t.props,i=t.slots,o=r.$i18n;if(o){var s=a.path,l=a.locale,c=a.places,u=i(),h=o.i(s,l,function(e){var t;for(t in e)if("default"!==t)return!1;return Boolean(t)}(u)||c?function(e,t){var n=t?function(e){0;return Array.isArray(e)?e.reduce(w,{}):Object.assign({},e)}(t):{};if(!e)return n;var r=(e=e.filter((function(e){return e.tag||""!==e.text.trim()}))).every(C);0;return e.reduce(r?E:w,n)}(u.default,c):u),p=a.tag&&!0!==a.tag||!1===a.tag?a.tag:"span";return p?e(p,n,h):h}}};function E(e,t){return t.data&&t.data.attrs&&t.data.attrs.place&&(e[t.data.attrs.place]=t),e}function w(e,t,n){return e[n]=t,e}function C(e){return Boolean(e.data&&e.data.attrs&&e.data.attrs.place)}var S,k={name:"i18n-n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},value:{type:Number,required:!0},format:{type:[String,Object]},locale:{type:String}},render:function(e,t){var n=t.props,r=t.parent,a=t.data,o=r.$i18n;if(!o)return null;var s=null,u=null;c(n.format)?s=n.format:l(n.format)&&(n.format.key&&(s=n.format.key),u=Object.keys(n.format).reduce((function(e,t){var r;return m(i,t)?Object.assign({},e,((r={})[t]=n.format[t],r)):e}),null));var h=n.locale||o.locale,p=o._ntp(n.value,h,s,u),f=p.map((function(e,t){var n,r=a.scopedSlots&&a.scopedSlots[e.type];return r?r(((n={})[e.type]=e.value,n.index=t,n.parts=p,n)):e.value})),d=n.tag&&!0!==n.tag||!1===n.tag?n.tag:"span";return d?e(d,{attrs:a.attrs,class:a.class,staticClass:a.staticClass},f):f}};function O(e,t,n){T(e,n)&&I(e,t,n)}function M(e,t,n,r){if(T(e,n)){var a=n.context.$i18n;(function(e,t){var n=t.context;return e._locale===n.$i18n.locale})(e,n)&&y(t.value,t.oldValue)&&y(e._localeMessage,a.getLocaleMessage(a.locale))||I(e,t,n)}}function N(e,t,n,r){if(n.context){var a=n.context.$i18n||{};t.modifiers.preserve||a.preserveDirectiveContent||(e.textContent=""),e._vt=void 0,delete e._vt,e._locale=void 0,delete e._locale,e._localeMessage=void 0,delete e._localeMessage}else o("Vue instance does not exists in VNode context")}function T(e,t){var n=t.context;return n?!!n.$i18n||(o("VueI18n instance does not exists in Vue instance"),!1):(o("Vue instance does not exists in VNode context"),!1)}function I(e,t,n){var r,a,i=function(e){var t,n,r,a;c(e)?t=e:h(e)&&(t=e.path,n=e.locale,r=e.args,a=e.choice);return{path:t,locale:n,args:r,choice:a}}(t.value),s=i.path,l=i.locale,u=i.args,p=i.choice;if(s||l||u)if(s){var f=n.context;e._vt=e.textContent=null!=p?(r=f.$i18n).tc.apply(r,[s,p].concat(R(l,u))):(a=f.$i18n).t.apply(a,[s].concat(R(l,u))),e._locale=f.$i18n.locale,e._localeMessage=f.$i18n.getLocaleMessage(f.$i18n.locale)}else o("`path` is required in v-t directive");else o("value type not supported")}function R(e,t){var n=[];return e&&n.push(e),t&&(Array.isArray(t)||h(t))&&n.push(t),n}function A(e){A.installed=!0;(S=e).version&&Number(S.version.split(".")[0]);(function(e){e.prototype.hasOwnProperty("$i18n")||Object.defineProperty(e.prototype,"$i18n",{get:function(){return this._i18n}}),e.prototype.$t=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.$i18n;return r._t.apply(r,[e,r.locale,r._getMessages(),this].concat(t))},e.prototype.$tc=function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];var a=this.$i18n;return a._tc.apply(a,[e,a.locale,a._getMessages(),this,t].concat(n))},e.prototype.$te=function(e,t){var n=this.$i18n;return n._te(e,n.locale,n._getMessages(),t)},e.prototype.$d=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).d.apply(t,[e].concat(n))},e.prototype.$n=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).n.apply(t,[e].concat(n))}})(S),S.mixin(b),S.directive("t",{bind:O,update:M,unbind:N}),S.component(x.name,x),S.component(k.name,k),S.config.optionMergeStrategies.i18n=function(e,t){return void 0===t?e:t}}var L=function(){this._caches=Object.create(null)};L.prototype.interpolate=function(e,t){if(!t)return[e];var n=this._caches[e];return n||(n=function(e){var t=[],n=0,r="";for(;n<e.length;){var a=e[n++];if("{"===a){r&&t.push({type:"text",value:r}),r="";var i="";for(a=e[n++];void 0!==a&&"}"!==a;)i+=a,a=e[n++];var o="}"===a,s=D.test(i)?"list":o&&$.test(i)?"named":"unknown";t.push({value:i,type:s})}else"%"===a?"{"!==e[n]&&(r+=a):r+=a}return r&&t.push({type:"text",value:r}),t}(e),this._caches[e]=n),function(e,t){var n=[],r=0,a=Array.isArray(t)?"list":l(t)?"named":"unknown";if("unknown"===a)return n;for(;r<e.length;){var i=e[r];switch(i.type){case"text":n.push(i.value);break;case"list":n.push(t[parseInt(i.value,10)]);break;case"named":"named"===a&&n.push(t[i.value]);break;case"unknown":0}r++}return n}(n,t)};var D=/^(?:\d)+/,$=/^(?:\w)+/;var P=[];P[0]={ws:[0],ident:[3,0],"[":[4],eof:[7]},P[1]={ws:[1],".":[2],"[":[4],eof:[7]},P[2]={ws:[2],ident:[3,0],0:[3,0],number:[3,0]},P[3]={ident:[3,0],0:[3,0],number:[3,0],ws:[1,1],".":[2,1],"[":[4,1],eof:[7,1]},P[4]={"'":[5,0],'"':[6,0],"[":[4,2],"]":[1,3],eof:8,else:[4,0]},P[5]={"'":[4,0],eof:8,else:[5,0]},P[6]={'"':[4,0],eof:8,else:[6,0]};var V=/^\s?(?:true|false|-?[\d.]+|'[^']*'|"[^"]*")\s?$/;function j(e){if(null==e)return"eof";switch(e.charCodeAt(0)){case 91:case 93:case 46:case 34:case 39:return e;case 95:case 36:case 45:return"ident";case 9:case 10:case 13:case 160:case 65279:case 8232:case 8233:return"ws"}return"ident"}function F(e){var t,n,r,a=e.trim();return("0"!==e.charAt(0)||!isNaN(e))&&(r=a,V.test(r)?(n=(t=a).charCodeAt(0))!==t.charCodeAt(t.length-1)||34!==n&&39!==n?t:t.slice(1,-1):"*"+a)}var z=function(){this._cache=Object.create(null)};z.prototype.parsePath=function(e){var t=this._cache[e];return t||(t=function(e){var t,n,r,a,i,o,s,l=[],c=-1,u=0,h=0,p=[];function f(){var t=e[c+1];if(5===u&&"'"===t||6===u&&'"'===t)return c++,r="\\"+t,p[0](),!0}for(p[1]=function(){void 0!==n&&(l.push(n),n=void 0)},p[0]=function(){void 0===n?n=r:n+=r},p[2]=function(){p[0](),h++},p[3]=function(){if(h>0)h--,u=4,p[0]();else{if(h=0,void 0===n)return!1;if(!1===(n=F(n)))return!1;p[1]()}};null!==u;)if(c++,"\\"!==(t=e[c])||!f()){if(a=j(t),8===(i=(s=P[u])[a]||s.else||8))return;if(u=i[0],(o=p[i[1]])&&(r=void 0===(r=i[2])?t:r,!1===o()))return;if(7===u)return l}}(e))&&(this._cache[e]=t),t||[]},z.prototype.getPathValue=function(e,t){if(!l(e))return null;var n=this.parsePath(t);if(0===n.length)return null;for(var r=n.length,a=e,i=0;i<r;){var o=a[n[i]];if(void 0===o)return null;a=o,i++}return a};var B,W=/<\/?[\w\s="/.':;#-\/]+>/,U=/(?:@(?:\.[a-z]+)?:(?:[\w\-_|.]+|\([\w\-_|.]+\)))/g,H=/^@(?:\.([a-z]+))?:/,q=/[()]/g,G={upper:function(e){return e.toLocaleUpperCase()},lower:function(e){return e.toLocaleLowerCase()},capitalize:function(e){return""+e.charAt(0).toLocaleUpperCase()+e.substr(1)}},K=new L,J=function(e){var t=this;void 0===e&&(e={}),!S&&"undefined"!=typeof window&&window.Vue&&A(window.Vue);var n=e.locale||"en-US",r=!1!==e.fallbackLocale&&(e.fallbackLocale||"en-US"),a=e.messages||{},i=e.dateTimeFormats||{},o=e.numberFormats||{};this._vm=null,this._formatter=e.formatter||K,this._modifiers=e.modifiers||{},this._missing=e.missing||null,this._root=e.root||null,this._sync=void 0===e.sync||!!e.sync,this._fallbackRoot=void 0===e.fallbackRoot||!!e.fallbackRoot,this._formatFallbackMessages=void 0!==e.formatFallbackMessages&&!!e.formatFallbackMessages,this._silentTranslationWarn=void 0!==e.silentTranslationWarn&&e.silentTranslationWarn,this._silentFallbackWarn=void 0!==e.silentFallbackWarn&&!!e.silentFallbackWarn,this._dateTimeFormatters={},this._numberFormatters={},this._path=new z,this._dataListeners=[],this._componentInstanceCreatedListener=e.componentInstanceCreatedListener||null,this._preserveDirectiveContent=void 0!==e.preserveDirectiveContent&&!!e.preserveDirectiveContent,this.pluralizationRules=e.pluralizationRules||{},this._warnHtmlInMessage=e.warnHtmlInMessage||"off",this._postTranslation=e.postTranslation||null,this.getChoiceIndex=function(e,n){var r=Object.getPrototypeOf(t);if(r&&r.getChoiceIndex)return r.getChoiceIndex.call(t,e,n);var a,i;return t.locale in t.pluralizationRules?t.pluralizationRules[t.locale].apply(t,[e,n]):(a=e,i=n,a=Math.abs(a),2===i?a?a>1?1:0:1:a?Math.min(a,2):0)},this._exist=function(e,n){return!(!e||!n)&&(!p(t._path.getPathValue(e,n))||!!e[n])},"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||Object.keys(a).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,a[e])})),this._initVM({locale:n,fallbackLocale:r,messages:a,dateTimeFormats:i,numberFormats:o})},Q={vm:{configurable:!0},messages:{configurable:!0},dateTimeFormats:{configurable:!0},numberFormats:{configurable:!0},availableLocales:{configurable:!0},locale:{configurable:!0},fallbackLocale:{configurable:!0},formatFallbackMessages:{configurable:!0},missing:{configurable:!0},formatter:{configurable:!0},silentTranslationWarn:{configurable:!0},silentFallbackWarn:{configurable:!0},preserveDirectiveContent:{configurable:!0},warnHtmlInMessage:{configurable:!0},postTranslation:{configurable:!0}};J.prototype._checkLocaleMessage=function(e,t,n){var r=function(e,t,n,a){if(h(n))Object.keys(n).forEach((function(i){var o=n[i];h(o)?(a.push(i),a.push("."),r(e,t,o,a),a.pop(),a.pop()):(a.push(i),r(e,t,o,a),a.pop())}));else if(Array.isArray(n))n.forEach((function(n,i){h(n)?(a.push("["+i+"]"),a.push("."),r(e,t,n,a),a.pop(),a.pop()):(a.push("["+i+"]"),r(e,t,n,a),a.pop())}));else if(c(n)){if(W.test(n)){var i="Detected HTML in message '"+n+"' of keypath '"+a.join("")+"' at '"+t+"'. Consider component interpolation with '<i18n>' to avoid XSS. See https://bit.ly/2ZqJzkp";"warn"===e?o(i):"error"===e&&function(e,t){"undefined"!=typeof console&&(console.error("[vue-i18n] "+e),t&&console.error(t.stack))}(i)}}};r(t,e,n,[])},J.prototype._initVM=function(e){var t=S.config.silent;S.config.silent=!0,this._vm=new S({data:e}),S.config.silent=t},J.prototype.destroyVM=function(){this._vm.$destroy()},J.prototype.subscribeDataChanging=function(e){this._dataListeners.push(e)},J.prototype.unsubscribeDataChanging=function(e){!function(e,t){if(e.length){var n=e.indexOf(t);if(n>-1)e.splice(n,1)}}(this._dataListeners,e)},J.prototype.watchI18nData=function(){var e=this;return this._vm.$watch("$data",(function(){for(var t=e._dataListeners.length;t--;)S.nextTick((function(){e._dataListeners[t]&&e._dataListeners[t].$forceUpdate()}))}),{deep:!0})},J.prototype.watchLocale=function(){if(!this._sync||!this._root)return null;var e=this._vm;return this._root.$i18n.vm.$watch("locale",(function(t){e.$set(e,"locale",t),e.$forceUpdate()}),{immediate:!0})},J.prototype.onComponentInstanceCreated=function(e){this._componentInstanceCreatedListener&&this._componentInstanceCreatedListener(e,this)},Q.vm.get=function(){return this._vm},Q.messages.get=function(){return d(this._getMessages())},Q.dateTimeFormats.get=function(){return d(this._getDateTimeFormats())},Q.numberFormats.get=function(){return d(this._getNumberFormats())},Q.availableLocales.get=function(){return Object.keys(this.messages).sort()},Q.locale.get=function(){return this._vm.locale},Q.locale.set=function(e){this._vm.$set(this._vm,"locale",e)},Q.fallbackLocale.get=function(){return this._vm.fallbackLocale},Q.fallbackLocale.set=function(e){this._localeChainCache={},this._vm.$set(this._vm,"fallbackLocale",e)},Q.formatFallbackMessages.get=function(){return this._formatFallbackMessages},Q.formatFallbackMessages.set=function(e){this._formatFallbackMessages=e},Q.missing.get=function(){return this._missing},Q.missing.set=function(e){this._missing=e},Q.formatter.get=function(){return this._formatter},Q.formatter.set=function(e){this._formatter=e},Q.silentTranslationWarn.get=function(){return this._silentTranslationWarn},Q.silentTranslationWarn.set=function(e){this._silentTranslationWarn=e},Q.silentFallbackWarn.get=function(){return this._silentFallbackWarn},Q.silentFallbackWarn.set=function(e){this._silentFallbackWarn=e},Q.preserveDirectiveContent.get=function(){return this._preserveDirectiveContent},Q.preserveDirectiveContent.set=function(e){this._preserveDirectiveContent=e},Q.warnHtmlInMessage.get=function(){return this._warnHtmlInMessage},Q.warnHtmlInMessage.set=function(e){var t=this,n=this._warnHtmlInMessage;if(this._warnHtmlInMessage=e,n!==e&&("warn"===e||"error"===e)){var r=this._getMessages();Object.keys(r).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,r[e])}))}},Q.postTranslation.get=function(){return this._postTranslation},Q.postTranslation.set=function(e){this._postTranslation=e},J.prototype._getMessages=function(){return this._vm.messages},J.prototype._getDateTimeFormats=function(){return this._vm.dateTimeFormats},J.prototype._getNumberFormats=function(){return this._vm.numberFormats},J.prototype._warnDefault=function(e,t,n,r,a,i){if(!p(n))return n;if(this._missing){var o=this._missing.apply(null,[e,t,r,a]);if(c(o))return o}else 0;if(this._formatFallbackMessages){var s=f.apply(void 0,a);return this._render(t,i,s.params,t)}return t},J.prototype._isFallbackRoot=function(e){return!e&&!p(this._root)&&this._fallbackRoot},J.prototype._isSilentFallbackWarn=function(e){return this._silentFallbackWarn instanceof RegExp?this._silentFallbackWarn.test(e):this._silentFallbackWarn},J.prototype._isSilentFallback=function(e,t){return this._isSilentFallbackWarn(t)&&(this._isFallbackRoot()||e!==this.fallbackLocale)},J.prototype._isSilentTranslationWarn=function(e){return this._silentTranslationWarn instanceof RegExp?this._silentTranslationWarn.test(e):this._silentTranslationWarn},J.prototype._interpolate=function(e,t,n,r,a,i,o){if(!t)return null;var s,l=this._path.getPathValue(t,n);if(Array.isArray(l)||h(l))return l;if(p(l)){if(!h(t))return null;if(!c(s=t[n]))return null}else{if(!c(l))return null;s=l}return(s.indexOf("@:")>=0||s.indexOf("@.")>=0)&&(s=this._link(e,t,s,r,"raw",i,o)),this._render(s,a,i,n)},J.prototype._link=function(e,t,n,r,a,i,o){var s=n,l=s.match(U);for(var c in l)if(l.hasOwnProperty(c)){var u=l[c],h=u.match(H),p=h[0],f=h[1],d=u.replace(p,"").replace(q,"");if(m(o,d))return s;o.push(d);var v=this._interpolate(e,t,d,r,"raw"===a?"string":a,"raw"===a?void 0:i,o);if(this._isFallbackRoot(v)){if(!this._root)throw Error("unexpected error");var g=this._root.$i18n;v=g._translate(g._getMessages(),g.locale,g.fallbackLocale,d,r,a,i)}v=this._warnDefault(e,d,v,r,Array.isArray(i)?i:[i],a),this._modifiers.hasOwnProperty(f)?v=this._modifiers[f](v):G.hasOwnProperty(f)&&(v=G[f](v)),o.pop(),s=v?s.replace(u,v):s}return s},J.prototype._render=function(e,t,n,r){var a=this._formatter.interpolate(e,n,r);return a||(a=K.interpolate(e,n,r)),"string"!==t||c(a)?a:a.join("")},J.prototype._appendItemToChain=function(e,t,n){var r=!1;return m(e,t)||(r=!0,t&&(r="!"!==t[t.length-1],t=t.replace(/!/g,""),e.push(t),n&&n[t]&&(r=n[t]))),r},J.prototype._appendLocaleToChain=function(e,t,n){var r,a=t.split("-");do{var i=a.join("-");r=this._appendItemToChain(e,i,n),a.splice(-1,1)}while(a.length&&!0===r);return r},J.prototype._appendBlockToChain=function(e,t,n){for(var r=!0,a=0;a<t.length&&"boolean"==typeof r;a++){var i=t[a];c(i)&&(r=this._appendLocaleToChain(e,i,n))}return r},J.prototype._getLocaleChain=function(e,t){if(""===e)return[];this._localeChainCache||(this._localeChainCache={});var n=this._localeChainCache[e];if(!n){t||(t=this.fallbackLocale),n=[];for(var r,a=[e];s(a);)a=this._appendBlockToChain(n,a,t);(a=c(r=s(t)?t:l(t)?t.default?t.default:null:t)?[r]:r)&&this._appendBlockToChain(n,a,null),this._localeChainCache[e]=n}return n},J.prototype._translate=function(e,t,n,r,a,i,o){for(var s,l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(!p(s=this._interpolate(u,e[u],r,a,i,o,[r])))return s}return null},J.prototype._t=function(e,t,n,r){for(var a,i=[],o=arguments.length-4;o-- >0;)i[o]=arguments[o+4];if(!e)return"";var s=f.apply(void 0,i),l=s.locale||t,c=this._translate(n,l,this.fallbackLocale,e,r,"string",s.params);if(this._isFallbackRoot(c)){if(!this._root)throw Error("unexpected error");return(a=this._root).$t.apply(a,[e].concat(i))}return c=this._warnDefault(l,e,c,r,i,"string"),this._postTranslation&&null!=c&&(c=this._postTranslation(c,e)),c},J.prototype.t=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this)._t.apply(t,[e,this.locale,this._getMessages(),null].concat(n))},J.prototype._i=function(e,t,n,r,a){var i=this._translate(n,t,this.fallbackLocale,e,r,"raw",a);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.i(e,t,a)}return this._warnDefault(t,e,i,r,[a],"raw")},J.prototype.i=function(e,t,n){return e?(c(t)||(t=this.locale),this._i(e,t,this._getMessages(),null,n)):""},J.prototype._tc=function(e,t,n,r,a){for(var i,o=[],s=arguments.length-5;s-- >0;)o[s]=arguments[s+5];if(!e)return"";void 0===a&&(a=1);var l={count:a,n:a},c=f.apply(void 0,o);return c.params=Object.assign(l,c.params),o=null===c.locale?[c.params]:[c.locale,c.params],this.fetchChoice((i=this)._t.apply(i,[e,t,n,r].concat(o)),a)},J.prototype.fetchChoice=function(e,t){if(!e&&!c(e))return null;var n=e.split("|");return n[t=this.getChoiceIndex(t,n.length)]?n[t].trim():e},J.prototype.tc=function(e,t){for(var n,r=[],a=arguments.length-2;a-- >0;)r[a]=arguments[a+2];return(n=this)._tc.apply(n,[e,this.locale,this._getMessages(),null,t].concat(r))},J.prototype._te=function(e,t,n){for(var r=[],a=arguments.length-3;a-- >0;)r[a]=arguments[a+3];var i=f.apply(void 0,r).locale||t;return this._exist(n[i],e)},J.prototype.te=function(e,t){return this._te(e,this.locale,this._getMessages(),t)},J.prototype.getLocaleMessage=function(e){return d(this._vm.messages[e]||{})},J.prototype.setLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,t)},J.prototype.mergeLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,_({},this._vm.messages[e]||{},t))},J.prototype.getDateTimeFormat=function(e){return d(this._vm.dateTimeFormats[e]||{})},J.prototype.setDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,t),this._clearDateTimeFormat(e,t)},J.prototype.mergeDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,_(this._vm.dateTimeFormats[e]||{},t)),this._clearDateTimeFormat(e,t)},J.prototype._clearDateTimeFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._dateTimeFormatters.hasOwnProperty(r)&&delete this._dateTimeFormatters[r]}},J.prototype._localizeDateTime=function(e,t,n,r,a){for(var i=t,o=r[i],s=this._getLocaleChain(t,n),l=0;l<s.length;l++){var c=s[l];if(i=c,!p(o=r[c])&&!p(o[a]))break}if(p(o)||p(o[a]))return null;var u=o[a],h=i+"__"+a,f=this._dateTimeFormatters[h];return f||(f=this._dateTimeFormatters[h]=new Intl.DateTimeFormat(i,u)),f.format(e)},J.prototype._d=function(e,t,n){if(!n)return new Intl.DateTimeFormat(t).format(e);var r=this._localizeDateTime(e,t,this.fallbackLocale,this._getDateTimeFormats(),n);if(this._isFallbackRoot(r)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.d(e,n,t)}return r||""},J.prototype.d=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._d(e,r,a)},J.prototype.getNumberFormat=function(e){return d(this._vm.numberFormats[e]||{})},J.prototype.setNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,t),this._clearNumberFormat(e,t)},J.prototype.mergeNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,_(this._vm.numberFormats[e]||{},t)),this._clearNumberFormat(e,t)},J.prototype._clearNumberFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._numberFormatters.hasOwnProperty(r)&&delete this._numberFormatters[r]}},J.prototype._getNumberFormatter=function(e,t,n,r,a,i){for(var o=t,s=r[o],l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(o=u,!p(s=r[u])&&!p(s[a]))break}if(p(s)||p(s[a]))return null;var h,f=s[a];if(i)h=new Intl.NumberFormat(o,Object.assign({},f,i));else{var d=o+"__"+a;(h=this._numberFormatters[d])||(h=this._numberFormatters[d]=new Intl.NumberFormat(o,f))}return h},J.prototype._n=function(e,t,n,r){if(!J.availabilities.numberFormat)return"";if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).format(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.format(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.n(e,Object.assign({},{key:n,locale:t},r))}return i||""},J.prototype.n=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null,o=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key),o=Object.keys(t[0]).reduce((function(e,n){var r;return m(i,n)?Object.assign({},e,((r={})[n]=t[0][n],r)):e}),null)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._n(e,r,a,o)},J.prototype._ntp=function(e,t,n,r){if(!J.availabilities.numberFormat)return[];if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).formatToParts(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.formatToParts(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n._ntp(e,t,n,r)}return i||[]},Object.defineProperties(J.prototype,Q),Object.defineProperty(J,"availabilities",{get:function(){if(!B){var e="undefined"!=typeof Intl;B={dateTimeFormat:e&&void 0!==Intl.DateTimeFormat,numberFormat:e&&void 0!==Intl.NumberFormat}}return B}}),J.install=A,J.version="8.18.2";var X=J,Z=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("el-container",{class:["ec-doc","ec-doc-"+e.shared.docType,"ec-doc-locale-"+e.shared.locale]},[n("el-aside",{staticStyle:{height:"100%"},attrs:{width:"300px"}},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("Search"),e._v(" "),n("DocNav")],1),e._v(" "),n("el-main",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1)],1)};Z._withStripped=!0;var Y=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-nav"},[e.isOption?n("h3",[e._v(e._s(e.title))]):e._e(),e._v(" "),n("div",{staticClass:"toolbox"},[e.isOption?n("span",{staticClass:"item",on:{click:e.collapseAll}},[n("i",{staticClass:"el-icon-s-fold"}),e._v(e._s(e.$t("nav.collapseAll")))]):e._e()]),e._v(" "),n("el-tree",{ref:"tree",attrs:{"node-key":"path","empty-text":"",props:e.props,lazy:"","default-expanded-keys":e.expandedKeys,indent:10,"expand-on-click-node":!1,load:e.loadTreeNode,data:e.treeData,"current-node-key":e.initialSelectedNode},on:{"current-change":e.onSelectNode},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.node,a=t.data;return"tutorial"!==e.shared.docType?n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(r.expanded&&a.labelExpanded||a.label))]),e._v(" "),null!=a.defaultValue?n("span",{staticClass:"default-value"},[e._v(e._s(a.defaultValue))]):r.isLeaf?n("span",{staticClass:"default-value"},[e._v("...")]):e._e(),e._v(" "),a.isRoot||r.expanded?e._e():n("span",[e._v(",")])]):n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(a.label))])])}}],null,!0)})],1)};Y._withStripped=!0;var ee,te,ne,re,ae=n(21),ie=n(23);function oe(e){return(oe="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var se,le,ce={},ue={},he=[];function pe(e){return new Promise((function(t,n){var r=Object(ie.getDocJSONPVarNname)(e),a="".concat(ee,"/").concat(e,"?").concat(ne),i=document.createElement("script");i.async=!0,i.onload=function(){window[r]?t(window[r]):n("Load failed. ".concat(r))},i.src=a,document.body.appendChild(i)}))}function fe(e){return"doc-content-"+e.replace(/[\. <>]/g,"-")}function de(){if(!re)throw new Error("Preload json with url first");return re}function me(e,t,n,r){return e,ee=t,te=n,ne=r||"1",re||(re=pe("".concat(te,"-outline.js")).then((function(e){return function(e){function t(e,t,n){return e?e+n+t:t}function n(e,r){e.type||(e.type=oe(e.default)),e.type instanceof Array||(e.type=[e.type]);for(var a=0;a<e.type.length;a++)"*"===e.type[a]&&(e.type[a]="any");if(e.arrayItemType?e.path=t(r.path,e.arrayItemType,"-"):e.path=t(r.path,e.prop,"."),e.children){e.path.indexOf(".")<0&&!e.children[0].arrayItemType&&(se[e.path]=e);for(var i=0;i<e.children.length;i++)n(e.children[i],e)}ue[e.path]=e}e,se={};for(var r=0;r<e.children.length;r++)n(e.children[r],{});return e.isRoot=!0,he=Object.keys(ue),e}(e)}))),re}function ve(e){if(!se)throw new Error("Outline data is not loaded.");var t=e.split(".")[0],n=se[t]&&e?te+"."+t:te;if(!ce[n]){var r=pe("".concat(n,".js"));ce[n]={fetcher:r},r.then((function(e){ce[n].indexer=function(e,t){var n,r=[];for(var a in e)r.push({path:t?t+"."+a:a,content:e[a].desc,text:(n=e[a].desc,n.replace(/<[^>]*>?/gm,""))});return{search:function(e){var t=[],n=e.split(/[ +,]/).filter((function(e){return!!e})).map((function(e){return new RegExp(e,"i")}));if(!n.length)return t;for(var a=0;a<r.length;a++){for(var i=!0,o=0;o<n.length;o++)if(!n[o].test(r[a].text)&&!n[o].test(r[a].path)){i=!1;break}i&&t.push(r[a])}return t}}}(e,t)}))}return ce[n]}function ge(e){return ve(e).fetcher}function _e(e){return ue[e]}function ye(e){if(!e)return Object.keys(se)[0];if(_e(e.replace("[i]","")))return e.replace("[i]","");var t,n=e.split(".").map((function(e){var t=_e(e),n=t&&t.children&&t&&t.children[0];return n&&n.arrayItemType?e+"-"+n.arrayItemType:e}));if(_e(n.join(".")))return n.join(".");for(var r=-1/0,a=0;a<he.length;a++){var i=he[a],o=Object(ae.stringSimilarity)(e,i);o>r&&(r=o,t=i)}return t}function be(e){return(be="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var xe=["auto","top","bottom","right"];function Ee(e){ke.computedOptionExampleLayout="auto"===e?window.innerWidth<1400?"bottom":"right":e,ke.optionExampleLayout=e,window.localStorage&&window.localStorage.setItem("_ec_option_example_layout",e)}var we,Ce,Se=(we={},!(Ce=window.localStorage&&window.localStorage.getItem("_ec_option_example_layout"))||"auto"===Ce||xe.indexOf(Ce)<0?(we.mode="auto",we.computedMode=window.innerWidth<1400?"bottom":"right"):we.mode=we.computedMode=Ce,we),ke={docType:"",currentPath:"",fuzzySearch:!1,searchQuery:"",isMobile:!1,locale:"zh",showOptionExample:!1,allOptionExamples:null,cleanMode:!1,currentExampleName:"",currentExampleOption:"",optionExampleLayout:Se.mode,computedOptionExampleLayout:Se.computedMode};function Oe(){if(ke.isMobile){var e=ke.currentPath.split("."),t=_e(ke.currentPath);return t&&(!t.children||!t.children.length)&&e.length>1&&e.pop(),e.join(".")}return ke.currentPath.split(".")[0]}function Me(){return"option"===ke.docType||"option-gl"===ke.docType}var Ne=["markPoint","markLine","markArea","tooltip","axisPointer"];function Te(e,t,n){function r(e,t,a,i){var o=t.shift();if(i=(i?i+".":"")+o,"data"!==a||"object"===be(e)&&!Array.isArray(e)||(e={value:e}),e=Object.assign({},e),!t.length)return void 0===n?(delete e[o],e):(e[o]=n,e);var s=o.split("-"),l=s[0],c=s[1];if(null==e[l]){var u=_e(i);e[l]=function(e){return"markPoint"===e?{data:[{type:"max"}]}:"markLine"===e?{data:[{type:"average"}]}:"markArea"===e?{data:[[{type:"min"},{type:"max"}]]}:void 0}(l)||(u&&u.isArray?[]:{})}var h=e[l];return Array.isArray(h)?"series"===l?e[l]=h.map((function(e,n){return c&&e.type!==c?e:r(e,t.slice(),l,i)})):(e[l]=h.slice(),e[l][0]=r(e[l][0]||{},t.slice(),l,i)):(c&&h.type!==c&&(e[l]=h),e[l]=r(h,t.slice(),l,i)),e}var a=t.split(".")[0];return"timeline"===a&&e.baseOption?Object.assign({},e,{baseOption:r(e.baseOption,t.split("."),"","")}):Ne.indexOf(a)>=0?function e(n,a){if(n[a])return r(n,t.split("."),"","");if(Array.isArray(n)){for(var i=[],o=0;o<n.length;o++)i.push(e(n[o],a));return i}if("object"===be(n)){var s={};for(var l in n)n.hasOwnProperty(l)&&(s[l]=e(n[l],a));return s}return n}(e,a):r(e,t.split("."),"","")}function Ie(){var e=decodeURIComponent(window.location.hash.slice(1));if(e.startsWith("/search/")){var t=e.substr("/search/".length);ke.fuzzySearch=!0,ke.searchQuery=t}else e&&(ke.currentPath=e,ke.fuzzySearch=!1)}function Re(e){window.location.hash="#"+encodeURIComponent(e)}var Ae=n(1),Le=n.n(Ae);function De(e,t){var n=[];return t.children&&t.children.forEach((function(e){var t,r;n.push(((r={path:(t=e).path}).path=t.path,t.arrayItemType?(r.label="{type: ".concat(t.arrayItemType,", ...}"),r.labelExpanded="{"):null!=t.default?(r.defaultValue=t.default,r.label=t.prop+": ",r.leaf=!0):t.isArray?(r.label=t.prop+": [{...}]",r.labelExpanded=t.prop+": [{"):t.isObject?(r.label=t.prop+": {...}",r.labelExpanded=t.prop+": {"):(r.label=t.prop,r.leaf=!0),r.$source=Object.freeze(t),r))})),n}var $e={data:function(){return{props:{isLeaf:"leaf"},title:"setOption({",treeData:[],expandedKeys:[],loading:!0,shared:ke,initialSelectedNode:ke.currentPath}},created:function(){this.updateTreeSelectionAndExpand()},computed:{isOption:function(){return Me()}},methods:{updateTreeSelectionAndExpand:function(){this.expandedKeys=[];for(var e,t=this.shared.currentPath;(e=t.lastIndexOf("."))>=0||(e=t.lastIndexOf("-"))>=0;)t=t.substr(0,e),this.expandedKeys.push(t)},loadTreeNode:function(e,t){var n=this;0===e.level?(this.loading=!1,de().then((function(r){t(De(e.data,r)),setTimeout((function(){n.scrollToCurrentTreeNode()}),200)}))):e.data.children&&e.data.children.length?t(e.data.children):e.data.$source?t(De(e.data,e.data.$source)):t([])},onSelectNode:function(e,t){this.shared.currentPath=e.path},scrollToCurrentTreeNode:function(){var e=this.$el.querySelector(".el-tree-node.is-current");if(e){var t=e.getBoundingClientRect(),n=this.$el.getBoundingClientRect();(t.top>n.bottom||t.bottom<n.top)&&Le()(e,{time:500,align:{top:.1}})}},manualSelectNode:function(e){var t=this;this.updateTreeSelectionAndExpand(),setTimeout((function(){t.$refs.tree.setCurrentKey(null),t.$refs.tree.setCurrentKey(e),setTimeout((function(){t.scrollToCurrentTreeNode()}),200)}),50)},collapseAll:function(){for(var e in this.$refs.tree.store.nodesMap)this.$refs.tree.store.nodesMap[e].expanded=!1}},watch:{"shared.currentPath":function(e){Re(e),this.manualSelectNode(e)}}};n(31);function Pe(e,t,n,r,a,i,o,s){var l,c="function"==typeof e?e.options:e;if(t&&(c.render=t,c.staticRenderFns=n,c._compiled=!0),r&&(c.functional=!0),i&&(c._scopeId="data-v-"+i),o?(l=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),a&&a.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},c._ssrRegister=l):a&&(l=s?function(){a.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:a),l)if(c.functional){c._injectStyles=l;var u=c.render;c.render=function(e,t){return l.call(t),u(e,t)}}else{var h=c.beforeCreate;c.beforeCreate=h?[].concat(h,l):[l]}return{exports:e,options:c}}var Ve=Pe($e,Y,[],!1,null,null,null);Ve.options.__file="src/components/DocNav.vue";var je=Ve.exports,Fe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-main"},[n("div",{ref:"docContentDom",class:["doc-content",e.shared.showOptionExample?"option-example-actived":"","option-example-"+e.shared.computedOptionExampleLayout+"-layout"]},[n("h2",{attrs:{id:e.pageId}},[e._v(e._s(e.pageTitle))]),e._v(" "),e.pageDesc?n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"page-description",domProps:{innerHTML:e._s(e.pageDesc)}}):e._e(),e._v(" "),e.pageDisplayOutline.children&&e.pageDisplayOutline.children&&1<=e.maxDepth?n("div",[n("h3",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),e._l(e.pageDisplayOutline.children,(function(t){return n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.pageDescMap,"max-depth":e.maxDepth,depth:1},on:{"scroll-to-self":e.scrollTo,"toggle-expanded":e.handleCardExpandToggle}})}))],2):e._e()]),e._v(" "),e.showLiveExample?[e.shared.showOptionExample?n("LiveExample",{ref:"liveExample"}):n("div",{staticClass:"open-option-example",on:{click:e.openOptionExample}},[n("i",{staticClass:"el-icon-data-line"}),e._v(" "+e._s(e.$t("example.titleShort"))+"\n        ")])]:e._e()],2)};Fe._withStripped=!0;var ze=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["doc-content-item-card","level-"+e.depth,e.isLeaf?"leaf":"",e.shared.currentPath===e.nodeData.path?"current":""],attrs:{id:e.itemId}},[e.expanded?n("div",{staticClass:"hierarchy-line"}):e._e(),e._v(" "),n("h4",[e.depth>1?n("span",{staticClass:"guider"}):e._e(),e._v(" "),e.supportsExpandable?n("el-button",{attrs:{plain:"",circle:"",size:"mini",icon:e.expanded?"el-icon-minus":"el-icon-plus"},on:{click:e.toggleExpanded}}):e._e(),e._v(" "),e.shared.isMobile?e._e():n("span",{staticClass:"path-parent"},e._l(e.parentPath,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text)+".")])})),0),e._v(" "),n("span",{staticClass:"path-base"},[n("a",{attrs:{href:"#"+e.baseName.link}},[e._v(e._s(e.baseName.text))])]),e._v(" "),e.nodeData.default&&"*"!==e.nodeData.default?n("span",{staticClass:"default-value"},[e._v(" = "+e._s(e.nodeData.default))]):e._e(),e._v(" "),e.uiControl&&e.shared.allOptionExamples&&!e.shared.isMobile?n("span",{class:["control-toggle",e.enableUIControl?"active":""],on:{click:e.toggleUIControl}},[n("i",[e._v("")]),e._v(" "+e._s(e.$t("example.tryDesc"))+"\n            ")]):e._e()],1),e._v(" "),n("div",{staticClass:"prop-types"},e._l(e.nodeData.type,(function(t){return n("span",{key:t,class:["prop-type","prop-type-"+t.toLowerCase()]},[e._v(e._s(t))])})),0),e._v(" "),e.enableUIControl?n("OptionControl",{attrs:{controlConfig:e.uiControl,optionPath:e.nodeData.path}}):e._e(),e._v(" "),n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"item-description",domProps:{innerHTML:e._s(e.desc)}}),e._v(" "),e.supportsExpandable?n("div",{staticClass:"children"},e._l(e.nodeData.children,(function(t){return e.expanded?n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.descMap,depth:e.depth+1,"max-depth":e.maxDepth},on:{"toggle-expanded":e.bubbleEventToggleExapndedEvent,"scroll-to-self":e.bubbleScrollToSelfEvent}}):e._e()})),1):e._e(),e._v(" "),e.expanded&&!e.shared.isMobile||e.isLeaf?e._e():n("PropertiesList",{attrs:{nodeData:e.nodeData,descMap:e.descMap}})],1)};ze._withStripped=!0;var Be=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"properties-list-panel"},[n("h5",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),n("div",{staticClass:"properties-list"},[e._v("\n        {\n        "),e._l(e.displayedProperties,(function(t,r){return n("span",{key:t.path},[e.shared.isMobile?n("span",[n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]):n("el-popover",{attrs:{title:e.getName(t.path),"close-delay":400,"open-delay":200,placement:"top",trigger:"hover"}},[n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"property-popup-desc",domProps:{innerHTML:e._s(e.getDesc(t.path))}}),e._v(" "),n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]),e._v(" "),r<e.displayedProperties.length-1?n("span",[e._v(", ")]):e._e()],1)})),e._v("\n        }\n    ")],2)])};Be._withStripped=!0;var We={props:["nodeData","descMap"],data:function(){return{shared:ke}},computed:{displayedProperties:function(){return this.nodeData.children}},methods:{getDesc:function(e){return this.descMap[e]},getName:function(e){return e.split(".").pop()}}},Ue=(n(32),Pe(We,Be,[],!1,null,null,null));Ue.options.__file="src/components/PropertiesList.vue";var He=Ue.exports,qe=function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"option-control"},[t(this.uiComponent,this._b({tag:"component",attrs:{value:this.defaultValue},on:{change:this.onValueChange}},"component",this.uiAttrs,!1))],1)};qe._withStripped=!0;var Ge=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-color"},[n("el-color-picker",{attrs:{"show-alpha":!0},on:{change:e.onValueChange,"active-change":e.onActiveChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}}),e._v(" "),n("span",{style:{color:e.innerValue||"#aaa"}},[e._v("\n    "+e._s(e.innerValue||e.$t("example.defaultColor"))+"\n")])],1)};Ge._withStripped=!0;var Ke={props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},onActiveChange:function(e){}}},Je=(n(33),Pe(Ke,Ge,[],!1,null,null,null));Je.options.__file="src/controls/ControlColor.vue";var Qe=Je.exports,Xe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-boolean"},[n("el-switch",{attrs:{"active-text":e.$t("example.booleanDesc")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};Xe._withStripped=!0;var Ze=Pe({props:["value"],data:function(){return{innerValue:"true"===this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},Xe,[],!1,null,null,null);Ze.options.__file="src/controls/ControlBoolean.vue";var Ye=Ze.exports,et=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-number"},[n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};et._withStripped=!0;var tt={props:["value","min","max","step"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},nt=(n(34),Pe(tt,et,[],!1,null,null,null));nt.options.__file="src/controls/ControlNumber.vue";var rt=nt.exports,at=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-vector"},[n("el-switch",{attrs:{"active-text":e.$t("example.vectorSetSeparate")},model:{value:e.innerSeparate,callback:function(t){e.innerSeparate=t},expression:"innerSeparate"}}),e._v(" "),e.innerSeparate?n("div",{staticClass:"control-vector-group"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValueArr[r],callback:function(t){e.$set(e.innerValueArr,r,t)},expression:"innerValueArr[index]"}})],1)})),0):n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.innerValueArr[0],callback:function(t){e.$set(e.innerValueArr,0,t)},expression:"innerValueArr[0]"}})],1)};at._withStripped=!0;var it={props:["value","separate","min","max","step","dims"],data:function(){return{innerSeparate:"true"===this.separate,innerValueArr:this.value.split(",").map((function(e){return+e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return+e.trim()}))}},methods:{onValueChange:function(){if(!this.innerSeparate)for(var e=1;e<this.innerValueArr.length;e++)this.innerValueArr[e]=this.innerValueArr[0];this.$emit("change",this.innerValueArr.slice())}}},ot=(n(35),Pe(it,at,[],!1,null,null,null));ot.options.__file="src/controls/ControlVector.vue";var st=ot.exports,lt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-enum"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,class:{"control-enum-special":null!=e.specialValues[t]},attrs:{value:t}},[e._v(e._s(t))])})),1)],1)};lt._withStripped=!0;var ct={true:!0,false:!1},ut={props:["value","options"],computed:{optionsArr:function(){return this.options.split(",").map((function(e){return e.trim()}))},specialValues:function(){return ct}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",ct.hasOwnProperty(this.innerValue)?ct[this.innerValue]:this.innerValue)}}},ht=(n(36),Pe(ut,lt,[],!1,null,null,null));ht.options.__file="src/controls/ControlEnum.vue";var pt=ht.exports,ft=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent"},[n("el-radio-group",{attrs:{size:"mini"},model:{value:e.mode,callback:function(t){e.mode=t},expression:"mode"}},[n("el-radio-button",{attrs:{label:"absolute"}},[e._v(e._s(e.$t("example.absoluteMode")))]),e._v(" "),n("el-radio-button",{attrs:{label:"percent"}},[e._v(e._s(e.$t("example.percentMode")))])],1),e._v(" "),"absolute"===e.mode?n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.absoluteValue,callback:function(t){e.absoluteValue=t},expression:"absoluteValue"}}):n("div",[n("el-slider",{attrs:{min:0,max:100,step:1,"format-tooltip":e.formatTooltip},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}}),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:0,max:100,step:1},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}})],1)],1)};ft._withStripped=!0;var dt={props:["value","min","max","step"],data:function(){var e=this.value.indexOf("%")<0;return{percentValue:e?50:+this.value.replace("%",""),absoluteValue:e?+this.value:0,mode:e?"absolute":"percent"}},watch:{value:function(e){"absolute"===this.mode?this.absoluteValue=+e:this.percentValue=+e.replace("%","")},mode:function(){this.onValueChange()}},methods:{onValueChange:function(){this.$emit("change","absolute"===this.mode?this.absoluteValue:this.percentValue+"%")},formatTooltip:function(e){return e+"%"}}},mt=(n(37),Pe(dt,ft,[],!1,null,null,null));mt.options.__file="src/controls/ControlPercent.vue";var vt=mt.exports,gt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent-vector"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("ControlPercent",{attrs:{value:e.innerValueArr[r],"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:function(t){return e.onValueChange(r,t)}}})],1)})),0)};gt._withStripped=!0;var _t={components:{ControlPercent:vt},props:["value","min","max","step","dims"],data:function(){return{innerValueArr:this.value.split(",").map((function(e){return e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return e.trim()}))}},methods:{onValueChange:function(e,t){this.innerValueArr[e]=t,this.$emit("change",this.innerValueArr.slice())}}},yt=(n(38),Pe(_t,gt,[],!1,null,null,null));yt.options.__file="src/controls/ControlPercentVector.vue";var bt=yt.exports,xt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-text"},[n("el-input",{attrs:{size:"mini",placeholder:e.$t("example.inputPlaceholder")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};xt._withStripped=!0;var Et=Pe({props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},xt,[],!1,null,null,null);Et.options.__file="src/controls/ControlText.vue";var wt=Et.exports,Ct=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-icon"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,attrs:{value:t}},[e._v(e._s(t))])})),1),e._v(" "),n("el-button",{attrs:{size:"mini",type:"primary"},on:{click:e.chooseFile}},[e._v(e._s(e.$t("example.upload")))])],1)};function St(e){return(St="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Ct._withStripped=!0,SVGElement.prototype.getTransformToElement=SVGElement.prototype.getTransformToElement||function(e){return e.getScreenCTM().inverse().multiply(this.getScreenCTM())};var kt=/,?([achlmqrstvxz]),?/gi,Ot=function(e){return e.join(",").replace(kt,"$1")};function Mt(e,t,n,r,a){if(e)if(void 0===r&&(r=!1),void 0===t&&(t=!1),void 0===n&&(n=!1),void 0===a&&(a=!1),e&&e.children&&e.children.length){for(var i=0,o=e.children.length;i<o;i++)Mt(e.children[i],t,n,r,a);e.removeAttribute("transform")}else if(e instanceof SVGCircleElement||e instanceof SVGRectElement||e instanceof SVGEllipseElement||e instanceof SVGLineElement||e instanceof SVGPolygonElement||e instanceof SVGPolylineElement||e instanceof SVGPathElement){var s,l=function(e,t){if(!e)return;for(var n=document.createElementNS(e.ownerSVGElement.namespaceURI,"path"),r=["requiredFeatures","requiredExtensions","systemLanguage","id","xml:base","xml:lang","xml:space","onfocusin","onfocusout","onactivate","onclick","onmousedown","onmouseup","onmouseover","onmousemove","onmouseout","onload","alignment-baseline","baseline-shift","clip","clip-path","clip-rule","color","color-interpolation","color-interpolation-filters","color-profile","color-rendering","cursor","direction","display","dominant-baseline","enable-background","fill","fill-opacity","fill-rule","filter","flood-color","flood-opacity","font-family","font-size","font-size-adjust","font-stretch","font-style","font-variant","font-weight","glyph-orientation-horizontal","glyph-orientation-vertical","image-rendering","kerning","letter-spacing","lighting-color","marker-end","marker-mid","marker-start","mask","opacity","overflow","pointer-events","shape-rendering","stop-color","stop-opacity","stroke","stroke-dasharray","stroke-dashoffset","stroke-linecap","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke-width","text-anchor","text-decoration","text-rendering","unicode-bidi","visibility","word-spacing","writing-mode","class","style","externalResourcesRequired","transform","d","pathLength"],a=0,i=r.length;a<i;a++){var o,s=r[a];(o=e.getAttribute(s))&&n.setAttribute(s,o)}var l="",c=function(e){return!("number"!=typeof e||e==1/0||e<0)},u=1.81,h=e.tagName;switch(h){case"ellipse":case"circle":var p=+e.getAttribute("rx"),f=+e.getAttribute("ry"),d=+e.getAttribute("cx"),m=+e.getAttribute("cy");"circle"==h&&(p=f=+e.getAttribute("r")),l+=Ot([["M",d-p,m],["C",d-p,m-f/u,d-p/u,m-f,d,m-f],["C",d+p/u,m-f,d+p,m-f/u,d+p,m],["C",d+p,m+f/u,d+p/u,m+f,d,m+f],["C",d-p/u,m+f,d-p,m+f/u,d-p,m],["Z"]]);break;case"path":l=e.getAttribute("d");break;case"line":var v=e.getAttribute("x1"),g=e.getAttribute("y1");x2=e.getAttribute("x2"),y2=e.getAttribute("y2"),l="M"+v+","+g+"L"+x2+","+y2;break;case"polyline":l="M"+e.getAttribute("points");break;case"polygon":l="M"+e.getAttribute("points")+"Z";break;case"rect":p=+e.getAttribute("rx"),f=+e.getAttribute("ry");var _=e.getBBox(),y=_.x,b=_.y,x=_.width,E=_.height;if(c(p)||c(f)?c(p)&&!c(f)?f=p:c(f)&&!c(p)?p=f:(p>x/2&&(p=x/2),f>E/2&&(f=E/2)):p=f=0,p||f)if(t)l+=Ot([["M",y+p,b],["H",y+x-p],["A",p,f,0,0,1,y+x,b+f],["V",b+E-f],["A",p,f,0,0,1,y+x-p,b+E],["H",y+p],["A",p,f,0,0,1,y,b+E-f],["V",b+f],["A",p,f,0,0,1,y+p,b]]);else{f||(f=p),l+=Ot([["M",y,b+f],["C",y,b+f/(u=2.19),y+p/u,b,y+p,b],["L",y+x-p,b],["C",y+x-p/u,b,y+x,b+f/u,y+x,b+f],["L",y+x,b+E-f],["C",y+x,b+E-f/u,y+x-p/u,b+E,y+x-p,b+E],["L",y+p,b+E],["C",y+p/u,b+E,y,b+E-f/u,y,b+E-f],["L",y,b+f],["Z"]])}else l+=Ot([["M",y,b],["L",y+x,b],["L",y+x,b+E],["L",y,b+E],["L",y,b],["Z"]])}l&&n.setAttribute("d",l);return e.parentNode.replaceChild(n,e),n}(e,r);if(!l||""==l.getAttribute(u))return"M 0 0";a||0===a?a>15?a=15:a<0&&(a=0):a=!1;var c=l,u=c.getAttribute("d").trim();if(t)h=s=Yt(u);else{var h=s=Gt(u);s=Kt(s)}var p,f,d=c.ownerSVGElement,m=c.getTransformToElement(d),v=(i=0,s.length),g="",_="",y=0,b=0,x=[],E=d.createSVGPoint(),w={},C=0,S=0;for(w.x=null,w.y=null;i<v;i++){if(g=s[i][0].toUpperCase(),_=h[i][0],x[i]=[],x[i][0]=s[i][0],"A"==g)y=s[i][6],b=s[i][7],E.x=s[i][6],E.y=s[i][7],x[i]=Nt(s[i][1],s[i][2],s[i][3],s[i][4],s[i][5],E,m),x[i][1]=x[i][1],x[i][2]=x[i][2],x[i][3]=x[i][3],x[i][6]=x[i][6],x[i][7]=x[i][7];else if("Z"!=g)for(p=1;p<s[i].length;p+=2)"V"==g?b=s[i][p]:"H"==g?y=s[i][p]:(y=s[i][p],b=s[i][p+1]),E.x=y,E.y=b,f=E.matrixTransform(m),"V"==g||"H"==g?(x[i][0]="L",x[i][p]=f.x,x[i][p+1]=f.y):(x[i][p]=f.x,x[i][p+1]=f.y);("Z"!=g&&null===w.x||"M"==g)&&(w.x=y,w.y=b),"Z"==g&&(y=w.x,b=w.y)}var k=0,O=0;for(w.x="",i=0;i<x.length;i++){if("A"==(_=h[i][0])||"M"==_||"L"==_||"C"==_||"S"==_||"Q"==_||"T"==_||"H"==_||"V"==_){var M=N=x[i].length;if("A"==_)x[i][6]=T(x[i][6]),x[i][7]=T(x[i][7]);else for(M--;--M;)x[i][M]=T(x[i][M]);C=x[i][N-2],S=x[i][N-1]}else if("a"==_)k=x[i][6],O=x[i][7],x[i][0]=_,x[i][6]=T(x[i][6]-C),x[i][7]=T(x[i][7]-S),C=k,S=O;else if("m"==_||"l"==_||"c"==_||"s"==_||"q"==_||"t"==_||"h"==_||"v"==_){var N=x[i].length;for(k=x[i][N-2],O=x[i][N-1],p=1;p<N;p+=2)x[i][0]="h"==_||"v"==_?"l":_,x[i][p]=T(x[i][p]-C),x[i][p+1]=T(x[i][p+1]-S);C=k,S=O}("z"!=_.toLowerCase()&&""==w.x||"m"==_.toLowerCase())&&(w.x=C,w.y=S),"z"==_.toLowerCase()&&(C=w.x,S=w.y)}n&&(x=Kt(x)),l.setAttribute("d",Ot(x)),l.removeAttribute("transform")}function T(e){return!1!==a?Math.round(e*Math.pow(10,a))/Math.pow(10,a):e}}function Nt(e,t,n,r,a,i,o,s){function l(e){return Math.abs(e)<1e-16}var c,u,h,p,f,d,m,v,g,_,y,b=[];if(c=e,u=t,h=n*=Math.PI/180,p=parseFloat(Math.sin(h)),f=parseFloat(Math.cos(h)),b[0]=o.a*+c*f+o.c*c*p,b[1]=o.b*+c*f+o.d*c*p,b[2]=o.a*-u*p+o.c*u*f,b[3]=o.b*-u*p+o.d*u*f,g=(d=b[0]*b[0]+b[2]*b[2])-(v=b[1]*b[1]+b[3]*b[3]),l(m=2*(b[0]*b[1]+b[2]*b[3])))n=0,_=d,y=v;else if(l(g))_=d+.5*m,y=d-.5*m,n=Math.PI/4;else{var x=1+m*m/(g*g);_=.5*(d+v+(x=x<0?0:Math.sqrt(x))*g),y=.5*(d+v-x*g),n=.5*Math.atan2(m,g)}return _=_<0?0:Math.sqrt(_),y=y<0?0:Math.sqrt(y),g<=0?(t=_,e=y):(t=y,e=_),o.a*o.d-o.b*o.c<0&&(a=a?0:1),i=i.matrixTransform(o),["A",e,t,n=180*n/Math.PI,r,a,i.x,i.y]}var Tt={},It="hasOwnProperty",Rt=String,At={NaN:1,Infinity:1,"-Infinity":1},Lt=Rt.prototype.toLowerCase,Dt=Rt.prototype.toUpperCase,$t=Object.prototype.toString,Pt="concat",Vt=Math,jt=Vt.max,Ft=(Vt.min,Vt.abs,Vt.pow,Vt.PI),zt=(Vt.round,parseFloat),Bt=(parseInt,kt=/,?([achlmqrstvxz]),?/gi,/([achlmrqstvz])[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*)+)/gi),Wt=/(-?\d*\.?\d*(?:e[\-+]?\d+)?)[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*/gi;Tt.is=function(e,t){return"finite"==(t=Lt.call(t))?!At[It](+e):"array"==t?e instanceof Array:"null"==t&&null===e||t==St(e)&&null!==e||"object"==t&&e===Object(e)||"array"==t&&Array.isArray&&Array.isArray(e)||$t.call(e).slice(8,-1).toLowerCase()==t},Tt._path2string=function(){return this.join(",").replace(kt,"$1")};var Ut=function(e){var t=function e(t){if(Object(t)!==t)return t;var n=new t.constructor;for(var r in t)t[It](r)&&(n[r]=e(t[r]));return n}(e);return t.toString=Tt._path2string,t},Ht=function e(t){var n=e.ps=e.ps||{};return n[t]?n[t].sleep=100:n[t]={sleep:100},setTimeout((function(){for(var e in n)n[It](e)&&e!=t&&(n[e].sleep--,!n[e].sleep&&delete n[e])})),n[t]};function qt(e,t){for(var n=[],r=0,a=e.length;a-2*!t>r;r+=2){var i=[{x:+e[r-2],y:+e[r-1]},{x:+e[r],y:+e[r+1]},{x:+e[r+2],y:+e[r+3]},{x:+e[r+4],y:+e[r+5]}];t?r?a-4==r?i[3]={x:+e[0],y:+e[1]}:a-2==r&&(i[2]={x:+e[0],y:+e[1]},i[3]={x:+e[2],y:+e[3]}):i[0]={x:+e[a-2],y:+e[a-1]}:a-4==r?i[3]=i[2]:r||(i[0]={x:+e[r],y:+e[r+1]}),n.push(["C",(-i[0].x+6*i[1].x+i[2].x)/6,(-i[0].y+6*i[1].y+i[2].y)/6,(i[1].x+6*i[2].x-i[3].x)/6,(i[1].y+6*i[2].y-i[3].y)/6,i[2].x,i[2].y])}return n}var Gt=function(e){if(!e)return null;var t=Ht(e);if(t.arr)return Ut(t.arr);var n={a:7,c:6,h:1,l:2,m:2,r:4,q:4,s:4,t:2,v:1,z:0},r=[];return Tt.is(e,"array")&&Tt.is(e[0],"array")&&(r=Ut(e)),r.length||Rt(e).replace(Bt,(function(e,t,a){var i=[],o=t.toLowerCase();if(a.replace(Wt,(function(e,t){t&&i.push(+t)})),"m"==o&&i.length>2&&(r.push([t][Pt](i.splice(0,2))),o="l",t="m"==t?"l":"L"),"r"==o)r.push([t][Pt](i));else for(;i.length>=n[o]&&(r.push([t][Pt](i.splice(0,n[o]))),n[o]););})),r.toString=Tt._path2string,t.arr=Ut(r),r};var Kt=Jt((function(e){if(Tt.is(e,"array")&&Tt.is(e&&e[0],"array")||(e=Gt(e)),!e||!e.length)return[["M",0,0]];var t=[],n=0,r=0,a=0,i=0,o=0;"M"==e[0][0]&&(a=n=+e[0][1],i=r=+e[0][2],o++,t[0]=["M",n,r]);for(var s,l,c=3==e.length&&"M"==e[0][0]&&"R"==e[1][0].toUpperCase()&&"Z"==e[2][0].toUpperCase(),u=o,h=e.length;u<h;u++){if(t.push(s=[]),(l=e[u])[0]!=Dt.call(l[0]))switch(s[0]=Dt.call(l[0]),s[0]){case"A":s[1]=l[1],s[2]=l[2],s[3]=l[3],s[4]=l[4],s[5]=l[5],s[6]=+(l[6]+n),s[7]=+(l[7]+r);break;case"V":s[1]=+l[1]+r;break;case"H":s[1]=+l[1]+n;break;case"R":for(var p=[n,r][Pt](l.slice(1)),f=2,d=p.length;f<d;f++)p[f]=+p[f]+n,p[++f]=+p[f]+r;t.pop(),t=t[Pt](qt(p,c));break;case"M":a=+l[1]+n,i=+l[2]+r;default:for(f=1,d=l.length;f<d;f++)s[f]=+l[f]+(f%2?n:r)}else if("R"==l[0])p=[n,r][Pt](l.slice(1)),t.pop(),t=t[Pt](qt(p,c)),s=["R"][Pt](l.slice(-2));else for(var m=0,v=l.length;m<v;m++)s[m]=l[m];switch(s[0]){case"Z":n=a,r=i;break;case"H":n=s[1];break;case"V":r=s[1];break;case"M":a=s[s.length-2],i=s[s.length-1];default:n=s[s.length-2],r=s[s.length-1]}}return t.toString=Tt._path2string,t}));function Jt(e,t,n){return function r(){var a=Array.prototype.slice.call(arguments,0),i=a.join("␀"),o=r.cache=r.cache||{},s=r.count=r.count||[];if(o.hasOwnProperty(i)){for(var l=0,c=s.length;l<c;l++)s[l]===i&&s.push(s.splice(l,1)[0]);return n?n(o[i]):o[i]}return s.length>=1e3&&delete o[s.shift()],s.push(i),o[i]=e.apply(t,a),n?n(o[i]):o[i]}}var Qt=function(e,t,n,r){return[e,t,n,r,n,r]},Xt=function(e,t,n,r,a,i){return[1/3*e+2/3*n,1/3*t+2/3*r,1/3*a+2/3*n,1/3*i+2/3*r,a,i]},Zt=Jt((function(e,t,n,r,a,i,o,s,l,c){var u,h=120*Ft/180,p=Ft/180*(+a||0),f=[],d=Jt((function(e,t,n){return{x:e*Math.cos(n)-t*Math.sin(n),y:e*Math.sin(n)+t*Math.cos(n)}}));if(c)w=c[0],C=c[1],x=c[2],E=c[3];else{e=(u=d(e,t,-p)).x,t=u.y,s=(u=d(s,l,-p)).x,l=u.y;Math.cos(Ft/180*a),Math.sin(Ft/180*a);var m=(e-s)/2,v=(t-l)/2,g=m*m/(n*n)+v*v/(r*r);g>1&&(n*=g=Math.sqrt(g),r*=g);var _=n*n,y=r*r,b=(i==o?-1:1)*Math.sqrt(Math.abs((_*y-_*v*v-y*m*m)/(_*v*v+y*m*m))),x=b*n*v/r+(e+s)/2,E=b*-r*m/n+(t+l)/2,w=Math.asin(((t-E)/r).toFixed(9)),C=Math.asin(((l-E)/r).toFixed(9));(w=e<x?Ft-w:w)<0&&(w=2*Ft+w),(C=s<x?Ft-C:C)<0&&(C=2*Ft+C),o&&w>C&&(w-=2*Ft),!o&&C>w&&(C-=2*Ft)}var S=C-w;if(Math.abs(S)>h){var k=C,O=s,M=l;C=w+h*(o&&C>w?1:-1),s=x+n*Math.cos(C),l=E+r*Math.sin(C),f=Zt(s,l,n,r,a,0,o,O,M,[C,k,x,E])}S=C-w;var N=Math.cos(w),T=Math.sin(w),I=Math.cos(C),R=Math.sin(C),A=Math.tan(S/4),L=4/3*n*A,D=4/3*r*A,$=[e,t],P=[e+L*T,t-D*N],V=[s+L*R,l-D*I],j=[s,l];if(P[0]=2*$[0]-P[0],P[1]=2*$[1]-P[1],c)return[P,V,j].concat(f);for(var F=[],z=0,B=(f=[P,V,j].concat(f).join().split(",")).length;z<B;z++)F[z]=z%2?d(f[z-1],f[z],p).y:d(f[z],f[z+1],p).x;return F})),Yt=Jt((function(e,t){var n=!t&&Ht(e);if(!t&&n.curve)return Ut(n.curve);for(var r=Kt(e),a=t&&Kt(t),i={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},o={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},s=function(e,t,n){var r,a;if(!e)return["C",t.x,t.y,t.x,t.y,t.x,t.y];switch(!(e[0]in{T:1,Q:1})&&(t.qx=t.qy=null),e[0]){case"M":t.X=e[1],t.Y=e[2];break;case"A":e=["C"][Pt](Zt.apply(0,[t.x,t.y][Pt](e.slice(1))));break;case"S":"C"==n||"S"==n?(r=2*t.x-t.bx,a=2*t.y-t.by):(r=t.x,a=t.y),e=["C",r,a][Pt](e.slice(1));break;case"T":"Q"==n||"T"==n?(t.qx=2*t.x-t.qx,t.qy=2*t.y-t.qy):(t.qx=t.x,t.qy=t.y),e=["C"][Pt](Xt(t.x,t.y,t.qx,t.qy,e[1],e[2]));break;case"Q":t.qx=e[1],t.qy=e[2],e=["C"][Pt](Xt(t.x,t.y,e[1],e[2],e[3],e[4]));break;case"L":e=["C"][Pt](Qt(t.x,t.y,e[1],e[2]));break;case"H":e=["C"][Pt](Qt(t.x,t.y,e[1],t.y));break;case"V":e=["C"][Pt](Qt(t.x,t.y,t.x,e[1]));break;case"Z":e=["C"][Pt](Qt(t.x,t.y,t.X,t.Y))}return e},l=function(e,t){if(e[t].length>7){e[t].shift();for(var n=e[t];n.length;)u[t]="A",a&&(h[t]="A"),e.splice(t++,0,["C"][Pt](n.splice(0,6)));e.splice(t,1),m=jt(r.length,a&&a.length||0)}},c=function(e,t,n,i,o){e&&t&&"M"==e[o][0]&&"M"!=t[o][0]&&(t.splice(o,0,["M",i.x,i.y]),n.bx=0,n.by=0,n.x=e[o][1],n.y=e[o][2],m=jt(r.length,a&&a.length||0))},u=[],h=[],p="",f="",d=0,m=jt(r.length,a&&a.length||0);d<m;d++){r[d]&&(p=r[d][0]),"C"!=p&&(u[d]=p,d&&(f=u[d-1])),r[d]=s(r[d],i,f),"A"!=u[d]&&"C"==p&&(u[d]="C"),l(r,d),a&&(a[d]&&(p=a[d][0]),"C"!=p&&(h[d]=p,d&&(f=h[d-1])),a[d]=s(a[d],o,f),"A"!=h[d]&&"C"==p&&(h[d]="C"),l(a,d)),c(r,a,i,o,d),c(a,r,o,i,d);var v=r[d],g=a&&a[d],_=v.length,y=a&&g.length;i.x=v[_-2],i.y=v[_-1],i.bx=zt(v[_-4])||i.x,i.by=zt(v[_-3])||i.y,o.bx=a&&(zt(g[y-4])||o.x),o.by=a&&(zt(g[y-3])||o.y),o.x=a&&g[y-2],o.y=a&&g[y-1]}return a||(n.curve=Ut(r)),a?[r,a]:r}),null,Ut);var en=Pe({props:["value"],computed:{optionsArr:function(){return["circle","rect","roundRect","triangle","diamond","pin","arrow","none"]}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},chooseFile:function(){var e=this,t=document.createElement("input");t.type="file",t.accept=".jpg, .jpeg, .png, .svg",t.addEventListener("change",(function(t){var n=t.target.files[0];if(n)if(n.name.endsWith(".svg")){var r=new FileReader;r.addEventListener("load",(function(){var t=function(e){var t=(new DOMParser).parseFromString(e,"text/xml");for(9===t.nodeType&&(t=t.firstChild);"svg"!==t.nodeName.toLowerCase()||1!==t.nodeType;)t=t.nextSibling;return t}(r.result);try{Mt(t)}catch(e){console.error("Unexpected error happens when handling the SVG."),console.error(e.toString())}for(var n=t.querySelectorAll("path"),a=[],i=0;i<n.length;i++)a.push(n[i].getAttribute("d"));e.$emit("change","path://"+a.join(" "))})),r.readAsText(n)}else{var a=new FileReader;a.addEventListener("load",(function(){e.$emit("change","image://"+a.result)})),a.readAsDataURL(n)}})),t.click()}}},Ct,[],!1,null,null,null);en.options.__file="src/controls/ControlIcon.vue";var tn={boolean:Ye,color:Qe,number:rt,vector:st,enum:pt,angle:rt,percent:vt,percentvector:bt,text:wt,icon:en.exports},nn={boolean:function(){return!1},color:function(){return null},number:function(){return 0},angle:function(){return 0},percent:function(){return"50"},enum:function(e){return e.options.split(",")[0].trim()},vector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return 0})).join(",")},percentvector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return"50%"})).join(",")}};var rn={name:"OptionControl",props:["controlConfig","optionPath"],data:function(){return{shared:ke}},computed:{uiComponent:function(){return tn[this.controlConfig.type]},uiAttrs:function(){return function(e){var t={};for(var n in e)e.hasOwnProperty(n)&&"type"!==n&&"default"!==n&&(t[n]=e[n]);return t}(this.controlConfig)},defaultValue:function(){var e=this.controlConfig;return null!=e.default?e.default:nn[e.type]&&nn[e.type](e)}},methods:{onValueChange:function(e){this.shared.cleanMode=this.controlConfig.clean,this.shared.currentExampleOption&&(this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.optionPath,e)))}}},an=(n(39),Pe(rn,qe,[],!1,null,null,null));an.options.__file="src/components/OptionControl.vue";var on={name:"DocContentItemCard",props:["nodeData","descMap","maxDepth","depth"],components:{PropertiesList:He,OptionControl:an.exports},data:function(){return{manualExpanded:null,enableUIControl:!1,shared:ke}},watch:{enableUIControl:function(e){e?(this.shared.showOptionExample||this.$emit("scroll-to-self",this.nodeData.path,300,100),this.shared.showOptionExample=!0):this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.nodeData.path,void 0))},"shared.currentExampleName":function(e,t){e&&t&&(this.enableUIControl=!1)}},computed:{itemId:function(){return fe(this.nodeData.path)},expanded:function(){return!this.isLeaf&&(null!=this.manualExpanded?this.manualExpanded:this.depth<2||ke.currentPath.indexOf(this.nodeData.path)>=0)},isLeaf:function(){return!(this.nodeData.children&&this.nodeData.children.length)},supportsExpandable:function(){return this.depth+1<=this.maxDepth&&!this.isLeaf},desc:function(){var e=this.descMap[this.nodeData.path];return e&&e.desc},uiControl:function(){var e=this.descMap[this.nodeData.path];return e&&e.uiControl},parentPath:function(){for(var e=this.nodeData.path.split("."),t=[],n="",r=0;r<e.length-1;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r],link:n});return t},baseName:function(){return{text:this.nodeData.path.split(".").pop(),link:this.nodeData.path}}},methods:{bubbleEventToggleExapndedEvent:function(){this.$emit("toggle-expanded")},toggleExpanded:function(){this.manualExpanded=!this.expanded,this.$emit("toggle-expanded")},toggleUIControl:function(){this.enableUIControl=!this.enableUIControl},bubbleScrollToSelfEvent:function(e,t,n){this.$emit("scroll-to-self",e,t,n)}}},sn=(n(40),Pe(on,ze,[],!1,null,null,null));sn.options.__file="src/components/DocContentItemCard.vue";var ln=sn.exports,cn=n(24),un=n.n(cn),hn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.shared.computedOptionExampleLayout+"-layout",attrs:{id:"example-panel"}},[n("h2",[e._v(e._s(e.$t("example.title")))]),e._v(" "),n("p",{staticClass:"intro"},[e._v(e._s(e.shared.allOptionExamples?e.$t("example.intro"):e.$t("example.noExample")))]),e._v(" "),e.shared.currentExampleOption?n("div",{staticClass:"preview-and-code"},[n("div",{staticClass:"preview-main"}),e._v(" "),e._m(0),e._v(" "),e.hasError?n("el-alert",{attrs:{title:e.$t("example.setOptionError"),type:"error"}}):e._e()],1):e._e(),e._v(" "),n("div",{staticClass:"toolbar"},[e.shared.allOptionExamples?n("el-select",{staticClass:"example-list",attrs:{size:"mini","popper-append-to-body":!1},model:{value:e.shared.currentExampleName,callback:function(t){e.$set(e.shared,"currentExampleName",t)},expression:"shared.currentExampleName"}},e._l(e.shared.allOptionExamples,(function(t){return n("el-option",{key:t.name,attrs:{value:t.name,label:"en"===e.shared.locale?t["title-en"]:t.title}})})),1):e._e(),e._v(" "),e.shared.currentExampleOption?n("el-button",{attrs:{type:"primary",icon:"el-icon-refresh",size:"mini",title:e.$t("example.refresh")},on:{click:e.refreshForce}}):e._e(),e._v(" "),n("el-button",{directives:[{name:"popover",rawName:"v-popover:changeLayoutPopover",arg:"changeLayoutPopover"}],staticStyle:{"margin-left":"0"},attrs:{type:"primary",icon:"el-icon-s-operation",size:"mini",title:e.$t("example.changeLayout")}}),e._v(" "),n("el-button",{attrs:{size:"mini",circle:"",icon:"el-icon-close"},on:{click:e.closeExamplePanel}})],1),e._v(" "),n("el-popover",{ref:"changeLayoutPopover",attrs:{placement:"bottom",trigger:"click"},model:{value:e.showChangeLayoutPopover,callback:function(t){e.showChangeLayoutPopover=t},expression:"showChangeLayoutPopover"}},[n("div",{staticClass:"example-change-layout"},[n("div",{staticClass:"layout-title"},[n("i",{staticClass:"el-icon-s-operation"}),e._v(e._s(e.$t("example.changeLayout")))]),e._v(" "),n("div",{staticClass:"layout-mode"},[n("el-radio-group",{attrs:{size:"mini"},on:{change:e.changeLayout},model:{value:e.shared.optionExampleLayout,callback:function(t){e.$set(e.shared,"optionExampleLayout",t)},expression:"shared.optionExampleLayout"}},e._l(e.optionExampleLayouts,(function(t){return n("el-radio-button",{key:t,attrs:{label:t}},[e._v(e._s(e.$t("example.layout."+t)))])})),1)],1)])])],1)};hn._withStripped=!0;var pn=n(25),fn=n.n(pn),dn=(n(41),n(42),n(26)),mn=n.n(dn),vn=n(19),gn=n.n(vn);function _n(e,t){return e===t}function yn(e,t,n,r){e.push(function(e,t,n){var r={cmd:e,idx:t};return"="===e&&(r.idx1=n),r}(t,n,r))}var bn=Math.abs;function xn(e,t,n,r,a,i,o,s){var l,c,u,h=n>r,p=a>i,f=bn(r-n),d=bn(i-a);for(c=0;c<=f;c++)for(u=0;u<=d;u++)if(0===c)s[u]=u;else if(0===u)l=s[u],s[u]=c;else{var m=l+(o(e[h?n-c:c-1+n],t[p?a-u:u-1+a])?0:2),v=s[u]+1,g=s[u-1]+1;l=s[u],s[u]=m<v?m:v,g<s[u]&&(s[u]=g)}return s}var En,wn=function(e,t,n){var r,a;n=n||_n;var i=e.length,o=t.length,s=Math.min(i,o),l=[];for(r=0;r<s&&n(e[r],t[r]);r++)yn(l,"=",r,r);for(a=0;a<s&&n(e[i-a-1],t[o-a-1]);a++);if(i-a>=r||o-a>=r){var c=function e(t,n,r,a,i,o,s,l,c){var u,h,p=[],f=a-r,d=o-i;if(f)if(d)if(1===f){var m=t[r],v=!1;for(h=0;h<d;h++)s(m,n[h+i])&&!v?(v=!0,yn(p,"=",r,h+i)):yn(p,"+",h+i);v||yn(p,"-",r)}else if(1===d){var g=n[i];v=!1;for(u=0;u<f;u++)s(g,t[u+r])&&!v?(v=!0,yn(p,"=",u+r,i)):yn(p,"-",u+r);v||yn(p,"+",i)}else{var _=(f/2|0)+r;xn(t,n,r,_,i,o,s,l),xn(t,n,a,_+1,o,i,s,c);var y,b=1/0,x=0;for(h=0;h<=d;h++)(y=l[h]+c[d-h])<b&&(b=y,x=h);p=e(t,n,r,_,i,x+=i,s,l,c);var E=e(t,n,_,a,x,o,s,l,c);for(u=0;u<E.length;u++)p.push(E[u])}else for(u=0;u<f;u++)yn(p,"-",u+r);else for(h=0;h<d;h++)yn(p,"+",h+i);return p}(e,t,r,i-a,r,o-a,n,[],[]);for(r=0;r<c.length;r++)l.push(c[r]);for(r=0;r<a;r++)yn(l,"=",i-a+r,o-a+r)}return l};function Cn(e,t){var n=this;if(this.shared.currentExampleName!==this.lastUpdateExampleName)return this.lastUpdateExampleName=this.shared.currentExampleName,void this.refreshForce();var r=this.$el.querySelector(".preview-main");if(r){if(this.hasError=!1,"undefined"==typeof echarts)(En||(En=new Promise((function(e){var t=document.createElement("script");t.src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js",t.async=!0,t.onload=function(){e(),En=null},document.body.appendChild(t)})))).then((function(){n.echartsInstance||(n.chartInstance=echarts.init(r)),n.shared.cleanMode&&n.chartInstance.clear(),n.chartInstance.setOption(e,!0)}));else{this.echartsInstance||(this.chartInstance=echarts.init(r));try{this.shared.cleanMode&&this.chartInstance.clear(),this.chartInstance.setOption(e,!0)}catch(e){console.error(e),this.hasError=!0}}if(this.cmInstance){var a=this.cmInstance.getValue(),i=this.formattedOptionCodeStr;this.oldHighlightedLines&&this.oldHighlightedLines.forEach((function(e){n.cmInstance.removeLineClass(e,"wrap","option-changed")})),t?(this.cmInstance.setValue(i),this.oldHighlightedLines=[]):this.oldHighlightedLines=function(e,t,n){for(var r=e.split(/\n/),a=t.split(/\n/),i=wn(r,a),o=[],s=i.length,l=s-1;l>=0;l--){var c=i[l];"-"===c.cmd&&n.replaceRange("",{line:c.idx,ch:0},{line:c.idx+1,ch:0})}for(var u=0;u<s;u++){var h=i[u];"+"===h.cmd&&(n.replaceRange(a[h.idx]+"\n",{line:h.idx,ch:0}),o.push(h.idx))}return o.forEach((function(e){n.addLineClass(e,"wrap","option-changed")})),s&&setTimeout((function(){n.scrollIntoView({line:o[0],ch:0},n.getWrapperElement().clientHeight-50)}),20),o}(a,i,this.cmInstance)}else this.cmInstance=fn()(this.$el.querySelector(".codemirror-main"),{value:this.formattedOptionCodeStr,mode:"javascript",theme:"dracula",readOnly:!0});this.lastUpdateExampleName=this.shared.currentExampleName}}var Sn={data:function(){return{shared:ke,hasError:!1,lastUpdateExampleName:"",oldHighlightedLines:[],showChangeLayoutPopover:!1,optionExampleLayouts:xe}},mounted:function(){this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize(),this.shared.currentExampleOption&&this.updateOptionThrottled(this.shared.currentExampleOption),this.shared.allOptionExamples?this.shared.currentExampleName=this.shared.allOptionExamples[0].name:this.shared.currentExampleName=""},destroyed:function(){this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),window.removeEventListener("resize",this.resize)},watch:{"shared.currentExampleOption":function(e){e&&this.updateOptionThrottled(e)},"shared.allOptionExamples":function(e){this.shared.currentExampleName=e?e[0].name:""},"shared.currentExampleName":function(e){this.changeExample(e)}},methods:{updateOption:Cn,updateOptionThrottled:gn()(Cn,300,{leading:!1}),resize:function(){var e=this.$el;e.querySelector(".preview-main");"right"!==this.shared.computedOptionExampleLayout?(e.style.height=.5*window.innerHeight-60+"px",e.style.width="auto"):(e.style.width=.45*e.parentNode.clientWidth+"px",e.style.height="auto"),this.chartInstance&&this.chartInstance.resize()},refreshForce:function(){this.shared.currentExampleOption&&(this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),this.updateOption(this.shared.currentExampleOption,!0))},closeExamplePanel:function(){this.shared.showOptionExample=!1},changeExample:function(e){var t=this.shared.allOptionExamples&&this.shared.allOptionExamples.find((function(t){return t.name===e}));if(!t)return this.shared.currentExampleOption=null,!1;var n=t.code;try{var r=new Function(n+"\n return option");this.shared.currentExampleOption=Object.freeze(r())}catch(e){console.error(e),console.log(n)}},changeLayout:function(e){var t=this;this.showChangeLayoutPopover=!1,Ee(e),this.$nextTick((function(){t.resize()}))}},computed:{optionCodeStr:function(){var e=JSON.stringify(this.shared.currentExampleOption,(function(e,t){return"function"==typeof t?"__functionstart__"+t.toString().replace(/\n/g,"__newline__")+"__functionend__":t}));return"option = ".concat(e)},formattedOptionCodeStr:function(){return mn.a.js(this.optionCodeStr.replace(/"(\w+)"\s*:/g,"$1:").replace(/"__functionstart__/g,"").replace(/__functionend__"/g,"").replace(/__newline__/g,"\n"),{indent_size:2})}}},kn=(n(43),Pe(Sn,hn,[function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"example-code"},[t("div",{staticClass:"codemirror-main"})])}],!1,null,null,null));kn.options.__file="src/components/LiveExample.vue";var On=kn.exports,Mn={components:{DocContentItemCard:ln,LiveExample:On},data:function(){return{loading:!1,pagePath:"",shared:ke,maxDepth:1/0,rootPageDescMap:{},pageOutline:{},pageDescMap:{}}},computed:{pageTitle:function(){return this.pagePath},pageId:function(){return fe(this.pagePath)},pageDesc:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.desc},pageExamples:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.exampleBaseOptions||[]},pageDisplayOutline:function(){return this.shared.isMobile?_e(Oe()):this.pageOutline},showLiveExample:function(){return!this.shared.isMobile&&Me()},needScrollOffset:function(){return this.shared.showOptionExample&&!this.shared.isMobile&&"top"===this.shared.computedOptionExampleLayout}},created:function(){var e=this;ge("").then((function(t){e.rootPageDescMap=Object.freeze(t)})),this._lazyload=new un.a({elements_selector:"iframe",load_delay:300}),this.updateCurrentPath(this.shared.currentPath,!0),this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize()},destroyed:function(){window.removeEventListener("resize",this.resize)},methods:{resize:function(){var e=this;"auto"===this.shared.optionExampleLayout&&Ee("auto"),a.a.nextTick((function(){e.updateDocContentMargin()}))},updateLazyload:function(){var e=this;a.a.nextTick((function(){e._lazyload.update()}))},handleCardExpandToggle:function(){this.updateLazyload()},scrollTo:function(e,t,n){var r=this;setTimeout((function(){var n=ke.isMobile?100:20;r.needScrollOffset&&(n+=r.$refs.liveExample.$el.offsetHeight),Le()(document.getElementById(fe(e)),{time:t||400,align:{top:0,topOffset:n}})}),n||0)},updateCurrentPath:function(e,t){var n=this;if(e)if(_e(e)){var r,a,i=Oe();if(i!==this.pagePath)this.loading=!0,this.pagePath=i,(r=e,a=r.split(".")[0],de().then((function(){return se[a]||de()}))).then((function(r){return r.isRoot?n.maxDepth=0:n.shared.isMobile?n.maxDepth=1:n.maxDepth=1/0,ge(e).then((function(a){n.pageOutline=Object.freeze(Object.assign({},r));var i={},o=e.split(".")[0];for(var s in a)i[o+"."+s]=a[s];n.pageDescMap=Object.freeze(i),n.loading=!1,n.scrollTo(e,600,t?300:50),n.updateLazyload()}))})).catch((function(e){n.pageOutline={},n.loading=!1}));else this.scrollTo(e)}else Re(ye(e));else Re(ye())},openOptionExample:function(){this.shared.showOptionExample=!0},updateDocContentMargin:function(e){if((this.$refs.liveExample||e)&&(this.$refs.docContentDom.style.margin="",!e)){var t=this.shared.computedOptionExampleLayout;if("right"!==t){var n="margin"+t[0].toUpperCase()+t.slice(1),r=this.$refs.liveExample.$el.clientHeight;this.$refs.docContentDom.style[n]=r+"px"}}}},watch:{"shared.currentPath":function(e){var t=this;this.updateCurrentPath(e),a.a.nextTick((function(){t.updateDocContentMargin()}))},pageExamples:function(e){e&&e.length?this.shared.allOptionExamples=Object.freeze(e):this.shared.allOptionExamples=null},"shared.computedOptionExampleLayout":function(){var e=this;a.a.nextTick((function(){e.updateDocContentMargin()}))},"shared.showOptionExample":function(e){var t=this;a.a.nextTick((function(){t.updateDocContentMargin(!e)}))}}},Nn=(n(44),Pe(Mn,Fe,[],!1,null,null,null));Nn.options.__file="src/components/DocContent.vue";var Tn=Nn.exports,In=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search"},[n("el-autocomplete",{staticClass:"search-input",attrs:{"popper-class":"search-input-popper",size:"small","fetch-suggestions":e.searchOptions,debounce:200,placeholder:e.$t("search.placeholder")},on:{select:e.selectPath},nativeOn:{keyup:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.fuzzySearch(t)}},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.item;return[n("div",{staticClass:"doc-path-suggestion-item"},[e._v(e._s(r.path))])]}}]),model:{value:e.queryString,callback:function(t){e.queryString=t},expression:"queryString"}},[e._v(" "),n("el-button",{attrs:{slot:"append",icon:"el-icon-search",type:"primary"},on:{click:e.fuzzySearch},slot:"append"})],1)],1)};In._withStripped=!0;var Rn={data:function(){return{queryString:ke.searchQuery,shared:ke}},computed:{},methods:{searchOptions:function(e,t){e?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:50;return de().then((function(){for(var n=[],r=0;r<he.length;r++){if(n.length>=t)return n;var a=he[r];a.indexOf(e)>=0&&n.push(_e(a))}if(n.length<t){le||(le=new Uint8Array(he.length));for(var i=0,o=0;o<he.length;o++)le[o]=255*Object(ae.stringSimilarity)(he[o],e),le[o]>50&&i++;for(var s={},l=0;n.length<t&&i>0;){for(var c=0,u=void 0,h=0;h<le.length;h++)le[h]>c&&!s[h]&&(u=h,c=le[h]);if(c>50&&(s[u]=!0,n.push(_e(he[u])),i--),++l>200)break}}return n}))}(e,100).then((function(e){t(e)})):t([])},selectPath:function(e){this.shared.currentPath=e.path},fuzzySearch:function(){this.shared.searchQuery=this.queryString,Re("/search/"+this.shared.searchQuery)}}},An=(n(45),Pe(Rn,In,[],!1,null,null,null));An.options.__file="src/components/Search.vue";var Ln=An.exports,Dn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search-result"},[n("h3",[e._v(e._s(e.$t("search.resultTitle")))]),e._v(" "),n("el-input",{attrs:{"prefix-icon":"el-icon-search"},model:{value:e.shared.searchQuery,callback:function(t){e.$set(e.shared,"searchQuery",t)},expression:"shared.searchQuery"}}),e._v(" "),n("div",{staticClass:"result-summary"},[e._v("\n        "+e._s(e.$t("search.foundCountBrief").replace("${searchResultCount}",e.searchResultCount))+",\n        "),e.searchToken?n("span",{staticClass:"searching"},[e._v("\n            搜索中"),n("i",{staticClass:"el-icon-loading"})]):n("span",[e._v("\n            "+e._s(e.$t("search.displayCountBrief").replace("${displayResultCount}",e.displayResultCount))+"\n        ")])]),e._v(" "),e._l(e.searchResult,(function(t){return n("SearchResultItemCard",{key:t.path,attrs:{"item-data":t,"search-query":e.shared.searchQuery}})}))],2)};Dn._withStripped=!0;var $n=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:{"doc-search-result-item-card":!0,"needs-show-more":e.needsShowMoreDesc}},[n("h4",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}]},[n("a",{staticClass:"path",attrs:{href:"#"+e.itemData.path}},[e._v(e._s(e.itemData.path))])]),e._v(" "),e.itemData.similarPaths.length>0?n("div",{staticClass:"other-result"},e._l(e.itemData.similarPaths,(function(t){return n("div",{key:t},[n("a",{attrs:{href:"#"+t}},[e._v(e._s(t))])])})),0):e._e(),e._v(" "),n("div",{staticClass:"item-description"},[n("div",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}],domProps:{innerHTML:e._s(e.itemData.content)}})]),e._v(" "),n("div",{staticClass:"show-more-button"},[n("el-button",{attrs:{icon:"el-icon-more",size:"mini"},on:{click:e.showMore}},[e._v(e._s(e.$t("search.showMore")))])],1)])};$n._withStripped=!0;var Pn={props:["itemData","searchQuery"],data:function(){return{needsShowMoreDesc:!0}},methods:{showMore:function(){this.needsShowMoreDesc=!1}},mounted:function(){var e=this;a.a.nextTick((function(){var t=e.$el.querySelector(".item-description");e.needsShowMoreDesc=t.scrollHeight!==t.clientHeight}))}},Vn=(n(46),Pe(Pn,$n,[],!1,null,null,null));function jn(e){var t=this;console.log("Searching, ",e),this.searchResult=[],this.searchResultCount=0,this.displayResultCount=0,this.static.searchResult.cache={},this.searchToken=Date.now()+"";var n,r,a=this.searchToken;(n=e,r=function(e){if(a===t.searchToken){if(!t.noLimit&&t.displayResultCount<=t.limitedResultCount){for(var n=0;n<e.length;n++){var r=e[n].text,i=t.static.searchResult.cache[r];if(i)i.similarPaths.push(e[n].path);else{var o=Object.freeze({path:e[n].path,content:e[n].content,similarPaths:[]});t.searchResult.push(o),t.static.searchResult.cache[r]=o}}t.displayResultCount+=e.length}t.searchResultCount+=e.length}},de().then((function(){return new Promise((function(e){var t=0;function a(){--t||e()}function i(e){var i=ve(e);i.indexer?r(i.indexer.search(n)):(t++,i.fetcher.then((function(){r(i.indexer.search(n)),a()})).catch((function(e){a()})))}for(var o in i(""),se)i(o);t||e()}))}))).then((function(){t.searchToken=""})).catch((function(){t.searchToken=""}))}Vn.options.__file="src/components/SearchResultItemCard.vue";var Fn={components:{SearchResultItemCard:Vn.exports},data:function(){return{searchResult:[],searchResultCount:0,displayResultCount:0,noLimit:!1,limitedResultCount:200,searchToken:"",static:Object.freeze({searchResult:{cache:null}}),shared:ke}},created:function(){this.updateSearchResultsImmediate(this.shared.searchQuery)},methods:{updateSearchResultsImmediate:jn,updateSearchResults:gn()(jn,500,{leading:!1})},watch:{"shared.searchQuery":function(e){this.updateSearchResults(e),Re("/search/"+this.shared.searchQuery)}}},zn=(n(47),Pe(Fn,Dn,[],!1,null,null,null));zn.options.__file="src/components/SearchResult.vue";var Bn=zn.exports,Wn=function(){var e=this.$createElement;return(this._self._c||e)("div")};Wn._withStripped=!0;var Un=Pe({},Wn,[],!1,null,null,null);Un.options.__file="src/components/Home.vue";var Hn=Un.exports,qn={props:["docType"],data:function(){return{shared:ke}},computed:{pagePath:function(){return Oe()}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,LiveExample:On,Home:Hn}},Gn=(n(48),Pe(qn,Z,[],!1,null,null,null));Gn.options.__file="src/App.vue";var Kn=Gn.exports,Jn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["ec-doc-mobile","ec-doc-"+e.shared.docType]},[n("div",{staticClass:"top-bar"},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("div",{staticClass:"doc-mobile-toolbar"},[n("el-button",{staticClass:"open-nav",attrs:{icon:"el-icon-menu",size:"mini"},on:{click:e.showNav}}),e._v(" "),n("Search")],1)]),e._v(" "),n("el-drawer",{attrs:{direction:"ltr",size:"80%",visible:e.navShown,"show-close":!1},on:{"update:visible":function(t){e.navShown=t}}},[n("DocNav")],1),e._v(" "),n("transition",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1),e._v(" "),e.pagePathParts.length>1?n("div",{staticClass:"doc-breadcrumb"},e._l(e.pagePathParts,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text))])})),0):e._e()],1)};Jn._withStripped=!0;var Qn={props:["docType"],data:function(){return{navShown:!1,shared:ke}},computed:{pagePath:function(){return Oe()},pagePathParts:function(){for(var e=this.pagePath.split("."),t=[],n="",r=0;r<e.length;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r]+(r===e.length-1?"":"."),link:n});return t}},methods:{showNav:function(){this.navShown=!0}},watch:{"shared.currentPath":function(e){this.navShown=!1}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,Home:Hn}},Xn=(n(49),Pe(Qn,Jn,[],!1,null,null,null));Xn.options.__file="src/AppMobile.vue";var Zn=Xn.exports,Yn=n(20),er=n.n(Yn),tr=n(27),nr=n.n(tr),rr=n(28),ar=n.n(rr);n(50);function ir(e){e.querySelectorAll("pre code").forEach((function(e){e.classList.contains("hljs")||er.a.highlightBlock(e)}))}er.a.registerLanguage("javascript",nr.a),er.a.registerLanguage("xml",ar.a),a.a.directive("highlight",{inserted:function(e){ir(e)},update:function(e){ir(e)}});var or=n(29),sr=n.n(or),lr=n(30),cr=n.n(lr);function ur(e,t){function n(){e.__markInstance.mark(t,{diacritics:!0,separateWordSearch:!0})}e.__markInstance?e.__markInstance.unmark({done:function(){n()}}):(e.__markInstance=new sr.a(e),n())}function hr(){window.innerWidth<600?ke.isMobile=!0:ke.isMobile=!1}a.a.directive("mark",{inserted:function(e,t){e.__doMarkDebounced=cr()(ur,500,{trailing:!0,leading:!1}),e.__doMarkDebounced(e,t.value)},update:function(e,t){e.__doMarkDebounced(e,t.value)}});var pr={en:{nav:{option:"Option",API:"API",tutorial:"Tutorial",optionGL:"GL",collapseAll:"Collapse All"},search:{placeholder:"Search document",resultTitle:"Search Result",showMore:"Show more",foundCountBrief:"Found ${searchResultCount} items",displayCountBrief:"${displayResultCount} displayed"},content:{properties:"Properties"},example:{title:"Preview",titleShort:"Preview",intro:"Try different values of the option and preview!",noExample:"No example available for current component.",tryDesc:"Try It",defaultColor:"Default Color",booleanDesc:"Enable",vectorSetSeparate:"SEPARATE",absoluteMode:"ABSOLUTE",percentMode:"PERCENT",inputPlaceholder:"Input to change the text content",builtin:"Builtin",upload:"Upload SVG or PNG",setOptionError:"Something Unexpected Happerns. Click refresh to try again!",refresh:"Refresh",close:"Close",changeLayout:"Change Layout",layout:{auto:"Auto",right:"Right",top:"Top",bottom:"Bottom"}}},zh:{nav:{option:"配置项",API:"API",tutorial:"教程",optionGL:"GL配置",collapseAll:"收起所有"},search:{placeholder:"搜索文档,回车查看更多结果",resultTitle:"文档搜索结果",showMore:"显示更多",foundCountBrief:"找到 ${searchResultCount} 条配置项",displayCountBrief:"显示 ${displayResultCount} 条"},content:{properties:"所有属性"},example:{title:"配置项效果预览",titleShort:"预览",intro:"调节控件可预览配置项不同取值的效果",noExample:"当前组件暂无可用示例",tryDesc:"试一试",defaultColor:"默认颜色",booleanDesc:"开启",vectorSetSeparate:"分别设置",absoluteMode:"绝对值",percentMode:"百分比",inputPlaceholder:"输入改变文本",builtin:"内置",upload:"上传 SVG 或 PNG",setOptionError:"发生了一些意料之外的错误,点击刷新再试试!",refresh:"刷新",close:"关闭",changeLayout:"切换布局",layout:{auto:"自动",right:"右侧",top:"顶部",bottom:"底部"}}}};function fr(e,t){window.addEventListener("resize",hr),hr();var n=t.cdnRoot||t.baseUrl;me(t.baseUrl,n,t.docType,t.version).then((function(){if(window.addEventListener("hashchange",(function(e){Ie()})),Ie(),ke.docType=t.docType,ke.locale=t.locale,"string"==typeof e&&(e=document.querySelector(e)),!e)throw new Error("Can't find el.");var n=document.createElement("div");e.appendChild(n);var r=new X({locale:t.locale,fallbackLocale:"en",messages:pr});new a.a({i18n:r,el:n,render:function(e){return console.log("iMobile: ",ke.isMobile),ke.isMobile?e(Zn):e(Kn)}})}))}}])}));
\ No newline at end of file
+e.exports=function(){"use strict";var e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},t=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},n=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},a=function(){function e(n){var r=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:5e3;t(this,e),this.ctx=n,this.iframes=r,this.exclude=a,this.iframesTimeout=i}return n(e,[{key:"getContexts",value:function(){var e=[];return(void 0!==this.ctx&&this.ctx?NodeList.prototype.isPrototypeOf(this.ctx)?Array.prototype.slice.call(this.ctx):Array.isArray(this.ctx)?this.ctx:"string"==typeof this.ctx?Array.prototype.slice.call(document.querySelectorAll(this.ctx)):[this.ctx]:[]).forEach((function(t){var n=e.filter((function(e){return e.contains(t)})).length>0;-1!==e.indexOf(t)||n||e.push(t)})),e}},{key:"getIframeContents",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},r=void 0;try{var a=e.contentWindow;if(r=a.document,!a||!r)throw new Error("iframe inaccessible")}catch(e){n()}r&&t(r)}},{key:"isIframeBlank",value:function(e){var t="about:blank",n=e.getAttribute("src").trim();return e.contentWindow.location.href===t&&n!==t&&n}},{key:"observeIframeLoad",value:function(e,t,n){var r=this,a=!1,i=null,o=function o(){if(!a){a=!0,clearTimeout(i);try{r.isIframeBlank(e)||(e.removeEventListener("load",o),r.getIframeContents(e,t,n))}catch(e){n()}}};e.addEventListener("load",o),i=setTimeout(o,this.iframesTimeout)}},{key:"onIframeReady",value:function(e,t,n){try{"complete"===e.contentWindow.document.readyState?this.isIframeBlank(e)?this.observeIframeLoad(e,t,n):this.getIframeContents(e,t,n):this.observeIframeLoad(e,t,n)}catch(e){n()}}},{key:"waitForIframes",value:function(e,t){var n=this,r=0;this.forEachIframe(e,(function(){return!0}),(function(e){r++,n.waitForIframes(e.querySelector("html"),(function(){--r||t()}))}),(function(e){e||t()}))}},{key:"forEachIframe",value:function(t,n,r){var a=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},o=t.querySelectorAll("iframe"),s=o.length,l=0;o=Array.prototype.slice.call(o);var c=function(){--s<=0&&i(l)};s||c(),o.forEach((function(t){e.matches(t,a.exclude)?c():a.onIframeReady(t,(function(e){n(t)&&(l++,r(e)),c()}),c)}))}},{key:"createIterator",value:function(e,t,n){return document.createNodeIterator(e,t,n,!1)}},{key:"createInstanceOnIframe",value:function(t){return new e(t.querySelector("html"),this.iframes)}},{key:"compareNodeIframe",value:function(e,t,n){if(e.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_PRECEDING){if(null===t)return!0;if(t.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_FOLLOWING)return!0}return!1}},{key:"getIteratorNode",value:function(e){var t=e.previousNode();return{prevNode:t,node:(null===t||e.nextNode())&&e.nextNode()}}},{key:"checkIframeFilter",value:function(e,t,n,r){var a=!1,i=!1;return r.forEach((function(e,t){e.val===n&&(a=t,i=e.handled)})),this.compareNodeIframe(e,t,n)?(!1!==a||i?!1===a||i||(r[a].handled=!0):r.push({val:n,handled:!0}),!0):(!1===a&&r.push({val:n,handled:!1}),!1)}},{key:"handleOpenIframes",value:function(e,t,n,r){var a=this;e.forEach((function(e){e.handled||a.getIframeContents(e.val,(function(e){a.createInstanceOnIframe(e).forEachNode(t,n,r)}))}))}},{key:"iterateThroughNodes",value:function(e,t,n,r,a){for(var i,o=this,s=this.createIterator(t,e,r),l=[],c=[],u=void 0,h=void 0;i=void 0,i=o.getIteratorNode(s),h=i.prevNode,u=i.node;)this.iframes&&this.forEachIframe(t,(function(e){return o.checkIframeFilter(u,h,e,l)}),(function(t){o.createInstanceOnIframe(t).forEachNode(e,(function(e){return c.push(e)}),r)})),c.push(u);c.forEach((function(e){n(e)})),this.iframes&&this.handleOpenIframes(l,e,n,r),a()}},{key:"forEachNode",value:function(e,t,n){var r=this,a=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},i=this.getContexts(),o=i.length;o||a(),i.forEach((function(i){var s=function(){r.iterateThroughNodes(e,i,t,n,(function(){--o<=0&&a()}))};r.iframes?r.waitForIframes(i,s):s()}))}}],[{key:"matches",value:function(e,t){var n="string"==typeof t?[t]:t,r=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector;if(r){var a=!1;return n.every((function(t){return!r.call(e,t)||(a=!0,!1)})),a}return!1}}]),e}(),i=function(){function i(e){t(this,i),this.ctx=e,this.ie=!1;var n=window.navigator.userAgent;(n.indexOf("MSIE")>-1||n.indexOf("Trident")>-1)&&(this.ie=!0)}return n(i,[{key:"log",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"debug",r=this.opt.log;this.opt.debug&&"object"===(void 0===r?"undefined":e(r))&&"function"==typeof r[n]&&r[n]("mark.js: "+t)}},{key:"escapeStr",value:function(e){return e.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g,"\\$&")}},{key:"createRegExp",value:function(e){return"disabled"!==this.opt.wildcards&&(e=this.setupWildcardsRegExp(e)),e=this.escapeStr(e),Object.keys(this.opt.synonyms).length&&(e=this.createSynonymsRegExp(e)),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),this.opt.diacritics&&(e=this.createDiacriticsRegExp(e)),e=this.createMergedBlanksRegExp(e),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.createJoinersRegExp(e)),"disabled"!==this.opt.wildcards&&(e=this.createWildcardsRegExp(e)),e=this.createAccuracyRegExp(e)}},{key:"createSynonymsRegExp",value:function(e){var t=this.opt.synonyms,n=this.opt.caseSensitive?"":"i",r=this.opt.ignoreJoiners||this.opt.ignorePunctuation.length?"\0":"";for(var a in t)if(t.hasOwnProperty(a)){var i=t[a],o="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(a):this.escapeStr(a),s="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(i):this.escapeStr(i);""!==o&&""!==s&&(e=e.replace(new RegExp("("+this.escapeStr(o)+"|"+this.escapeStr(s)+")","gm"+n),r+"("+this.processSynomyms(o)+"|"+this.processSynomyms(s)+")"+r))}return e}},{key:"processSynomyms",value:function(e){return(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),e}},{key:"setupWildcardsRegExp",value:function(e){return(e=e.replace(/(?:\\)*\?/g,(function(e){return"\\"===e.charAt(0)?"?":""}))).replace(/(?:\\)*\*/g,(function(e){return"\\"===e.charAt(0)?"*":""}))}},{key:"createWildcardsRegExp",value:function(e){var t="withSpaces"===this.opt.wildcards;return e.replace(/\u0001/g,t?"[\\S\\s]?":"\\S?").replace(/\u0002/g,t?"[\\S\\s]*?":"\\S*")}},{key:"setupIgnoreJoinersRegExp",value:function(e){return e.replace(/[^(|)\\]/g,(function(e,t,n){var r=n.charAt(t+1);return/[(|)\\]/.test(r)||""===r?e:e+"\0"}))}},{key:"createJoinersRegExp",value:function(e){var t=[],n=this.opt.ignorePunctuation;return Array.isArray(n)&&n.length&&t.push(this.escapeStr(n.join(""))),this.opt.ignoreJoiners&&t.push("\\u00ad\\u200b\\u200c\\u200d"),t.length?e.split(/\u0000+/).join("["+t.join("")+"]*"):e}},{key:"createDiacriticsRegExp",value:function(e){var t=this.opt.caseSensitive?"":"i",n=this.opt.caseSensitive?["aàáảãạăằắẳẵặâầấẩẫậäåāą","AÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćč","CÇĆČ","dđď","DĐĎ","eèéẻẽẹêềếểễệëěēę","EÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïī","IÌÍỈĨỊÎÏĪ","lł","LŁ","nñňń","NÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøō","OÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rř","RŘ","sšśșş","SŠŚȘŞ","tťțţ","TŤȚŢ","uùúủũụưừứửữựûüůū","UÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿ","YÝỲỶỸỴŸ","zžżź","ZŽŻŹ"]:["aàáảãạăằắẳẵặâầấẩẫậäåāąAÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćčCÇĆČ","dđďDĐĎ","eèéẻẽẹêềếểễệëěēęEÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïīIÌÍỈĨỊÎÏĪ","lłLŁ","nñňńNÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøōOÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rřRŘ","sšśșşSŠŚȘŞ","tťțţTŤȚŢ","uùúủũụưừứửữựûüůūUÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿYÝỲỶỸỴŸ","zžżźZŽŻŹ"],r=[];return e.split("").forEach((function(a){n.every((function(n){if(-1!==n.indexOf(a)){if(r.indexOf(n)>-1)return!1;e=e.replace(new RegExp("["+n+"]","gm"+t),"["+n+"]"),r.push(n)}return!0}))})),e}},{key:"createMergedBlanksRegExp",value:function(e){return e.replace(/[\s]+/gim,"[\\s]+")}},{key:"createAccuracyRegExp",value:function(e){var t=this,n=this.opt.accuracy,r="string"==typeof n?n:n.value,a="string"==typeof n?[]:n.limiters,i="";switch(a.forEach((function(e){i+="|"+t.escapeStr(e)})),r){case"partially":default:return"()("+e+")";case"complementary":return"()([^"+(i="\\s"+(i||this.escapeStr("!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~¡¿")))+"]*"+e+"[^"+i+"]*)";case"exactly":return"(^|\\s"+i+")("+e+")(?=$|\\s"+i+")"}}},{key:"getSeparatedKeywords",value:function(e){var t=this,n=[];return e.forEach((function(e){t.opt.separateWordSearch?e.split(" ").forEach((function(e){e.trim()&&-1===n.indexOf(e)&&n.push(e)})):e.trim()&&-1===n.indexOf(e)&&n.push(e)})),{keywords:n.sort((function(e,t){return t.length-e.length})),length:n.length}}},{key:"isNumeric",value:function(e){return Number(parseFloat(e))==e}},{key:"checkRanges",value:function(e){var t=this;if(!Array.isArray(e)||"[object Object]"!==Object.prototype.toString.call(e[0]))return this.log("markRanges() will only accept an array of objects"),this.opt.noMatch(e),[];var n=[],r=0;return e.sort((function(e,t){return e.start-t.start})).forEach((function(e){var a=t.callNoMatchOnInvalidRanges(e,r),i=a.start,o=a.end;a.valid&&(e.start=i,e.length=o-i,n.push(e),r=o)})),n}},{key:"callNoMatchOnInvalidRanges",value:function(e,t){var n=void 0,r=void 0,a=!1;return e&&void 0!==e.start?(r=(n=parseInt(e.start,10))+parseInt(e.length,10),this.isNumeric(e.start)&&this.isNumeric(e.length)&&r-t>0&&r-n>0?a=!0:(this.log("Ignoring invalid or overlapping range: "+JSON.stringify(e)),this.opt.noMatch(e))):(this.log("Ignoring invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:n,end:r,valid:a}}},{key:"checkWhitespaceRanges",value:function(e,t,n){var r=void 0,a=!0,i=n.length,o=t-i,s=parseInt(e.start,10)-o;return(r=(s=s>i?i:s)+parseInt(e.length,10))>i&&(r=i,this.log("End range automatically set to the max value of "+i)),s<0||r-s<0||s>i||r>i?(a=!1,this.log("Invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)):""===n.substring(s,r).replace(/\s+/g,"")&&(a=!1,this.log("Skipping whitespace only range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:s,end:r,valid:a}}},{key:"getTextNodes",value:function(e){var t=this,n="",r=[];this.iterator.forEachNode(NodeFilter.SHOW_TEXT,(function(e){r.push({start:n.length,end:(n+=e.textContent).length,node:e})}),(function(e){return t.matchesExclude(e.parentNode)?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),(function(){e({value:n,nodes:r})}))}},{key:"matchesExclude",value:function(e){return a.matches(e,this.opt.exclude.concat(["script","style","title","head","html"]))}},{key:"wrapRangeInTextNode",value:function(e,t,n){var r=this.opt.element?this.opt.element:"mark",a=e.splitText(t),i=a.splitText(n-t),o=document.createElement(r);return o.setAttribute("data-markjs","true"),this.opt.className&&o.setAttribute("class",this.opt.className),o.textContent=a.textContent,a.parentNode.replaceChild(o,a),i}},{key:"wrapRangeInMappedTextNode",value:function(e,t,n,r,a){var i=this;e.nodes.every((function(o,s){var l=e.nodes[s+1];if(void 0===l||l.start>t){if(!r(o.node))return!1;var c=t-o.start,u=(n>o.end?o.end:n)-o.start,h=e.value.substr(0,o.start),p=e.value.substr(u+o.start);if(o.node=i.wrapRangeInTextNode(o.node,c,u),e.value=h+p,e.nodes.forEach((function(t,n){n>=s&&(e.nodes[n].start>0&&n!==s&&(e.nodes[n].start-=u),e.nodes[n].end-=u)})),n-=u,a(o.node.previousSibling,o.start),!(n>o.end))return!1;t=o.end}return!0}))}},{key:"wrapMatches",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){t.nodes.forEach((function(t){t=t.node;for(var a=void 0;null!==(a=e.exec(t.textContent))&&""!==a[o];)if(n(a[o],t)){var s=a.index;if(0!==o)for(var l=1;l<o;l++)s+=a[l].length;t=i.wrapRangeInTextNode(t,s,s+a[o].length),r(t.previousSibling),e.lastIndex=0}})),a()}))}},{key:"wrapMatchesAcrossElements",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){for(var s=void 0;null!==(s=e.exec(t.value))&&""!==s[o];){var l=s.index;if(0!==o)for(var c=1;c<o;c++)l+=s[c].length;var u=l+s[o].length;i.wrapRangeInMappedTextNode(t,l,u,(function(e){return n(s[o],e)}),(function(t,n){e.lastIndex=n,r(t)}))}a()}))}},{key:"wrapRangeFromIndex",value:function(e,t,n,r){var a=this;this.getTextNodes((function(i){var o=i.value.length;e.forEach((function(e,r){var s=a.checkWhitespaceRanges(e,o,i.value),l=s.start,c=s.end;s.valid&&a.wrapRangeInMappedTextNode(i,l,c,(function(n){return t(n,e,i.value.substring(l,c),r)}),(function(t){n(t,e)}))})),r()}))}},{key:"unwrapMatches",value:function(e){for(var t=e.parentNode,n=document.createDocumentFragment();e.firstChild;)n.appendChild(e.removeChild(e.firstChild));t.replaceChild(n,e),this.ie?this.normalizeTextNode(t):t.normalize()}},{key:"normalizeTextNode",value:function(e){if(e){if(3===e.nodeType)for(;e.nextSibling&&3===e.nextSibling.nodeType;)e.nodeValue+=e.nextSibling.nodeValue,e.parentNode.removeChild(e.nextSibling);else this.normalizeTextNode(e.firstChild);this.normalizeTextNode(e.nextSibling)}}},{key:"markRegExp",value:function(e,t){var n=this;this.opt=t,this.log('Searching with expression "'+e+'"');var r=0,a="wrapMatches";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),this[a](e,this.opt.ignoreGroups,(function(e,t){return n.opt.filter(t,e,r)}),(function(e){r++,n.opt.each(e)}),(function(){0===r&&n.opt.noMatch(e),n.opt.done(r)}))}},{key:"mark",value:function(e,t){var n=this;this.opt=t;var r=0,a="wrapMatches",i=this.getSeparatedKeywords("string"==typeof e?[e]:e),o=i.keywords,s=i.length,l=this.opt.caseSensitive?"":"i";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),0===s?this.opt.done(r):function e(t){var i=new RegExp(n.createRegExp(t),"gm"+l),c=0;n.log('Searching with expression "'+i+'"'),n[a](i,1,(function(e,a){return n.opt.filter(a,t,r,c)}),(function(e){c++,r++,n.opt.each(e)}),(function(){0===c&&n.opt.noMatch(t),o[s-1]===t?n.opt.done(r):e(o[o.indexOf(t)+1])}))}(o[0])}},{key:"markRanges",value:function(e,t){var n=this;this.opt=t;var r=0,a=this.checkRanges(e);a&&a.length?(this.log("Starting to mark with the following ranges: "+JSON.stringify(a)),this.wrapRangeFromIndex(a,(function(e,t,r,a){return n.opt.filter(e,t,r,a)}),(function(e,t){r++,n.opt.each(e,t)}),(function(){n.opt.done(r)}))):this.opt.done(r)}},{key:"unmark",value:function(e){var t=this;this.opt=e;var n=this.opt.element?this.opt.element:"*";n+="[data-markjs]",this.opt.className&&(n+="."+this.opt.className),this.log('Removal selector "'+n+'"'),this.iterator.forEachNode(NodeFilter.SHOW_ELEMENT,(function(e){t.unwrapMatches(e)}),(function(e){var r=a.matches(e,n),i=t.matchesExclude(e);return!r||i?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),this.opt.done)}},{key:"opt",set:function(e){this._opt=r({},{element:"",className:"",exclude:[],iframes:!1,iframesTimeout:5e3,separateWordSearch:!0,diacritics:!0,synonyms:{},accuracy:"partially",acrossElements:!1,caseSensitive:!1,ignoreJoiners:!1,ignoreGroups:0,ignorePunctuation:[],wildcards:"disabled",each:function(){},noMatch:function(){},filter:function(){return!0},done:function(){},debug:!1,log:window.console},e)},get:function(){return this._opt}},{key:"iterator",get:function(){return new a(this.ctx,this.opt.iframes,this.opt.exclude,this.opt.iframesTimeout)}}]),i}();return function(e){var t=this,n=new i(e);return this.mark=function(e,r){return n.mark(e,r),t},this.markRegExp=function(e,r){return n.markRegExp(e,r),t},this.markRanges=function(e,r){return n.markRanges(e,r),t},this.unmark=function(e){return n.unmark(e),t},this}}()},function(e,t,n){(function(t){var n=/^\s+|\s+$/g,r=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,i=/^0o[0-7]+$/i,o=parseInt,s="object"==typeof t&&t&&t.Object===Object&&t,l="object"==typeof self&&self&&self.Object===Object&&self,c=s||l||Function("return this")(),u=Object.prototype.toString,h=Math.max,p=Math.min,f=function(){return c.Date.now()};function d(e){var t=typeof e;return!!e&&("object"==t||"function"==t)}function m(e){if("number"==typeof e)return e;if(function(e){return"symbol"==typeof e||function(e){return!!e&&"object"==typeof e}(e)&&"[object Symbol]"==u.call(e)}(e))return NaN;if(d(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=d(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=e.replace(n,"");var s=a.test(e);return s||i.test(e)?o(e.slice(2),s?2:8):r.test(e)?NaN:+e}e.exports=function(e,t,n){var r,a,i,o,s,l,c=0,u=!1,v=!1,g=!0;if("function"!=typeof e)throw new TypeError("Expected a function");function _(t){var n=r,i=a;return r=a=void 0,c=t,o=e.apply(i,n)}function y(e){return c=e,s=setTimeout(x,t),u?_(e):o}function b(e){var n=e-l;return void 0===l||n>=t||n<0||v&&e-c>=i}function x(){var e=f();if(b(e))return E(e);s=setTimeout(x,function(e){var n=t-(e-l);return v?p(n,i-(e-c)):n}(e))}function E(e){return s=void 0,g&&r?_(e):(r=a=void 0,o)}function w(){var e=f(),n=b(e);if(r=arguments,a=this,l=e,n){if(void 0===s)return y(l);if(v)return s=setTimeout(x,t),_(l)}return void 0===s&&(s=setTimeout(x,t)),o}return t=m(t)||0,d(n)&&(u=!!n.leading,i=(v="maxWait"in n)?h(m(n.maxWait)||0,t):i,g="trailing"in n?!!n.trailing:g),w.cancel=function(){void 0!==s&&clearTimeout(s),c=0,r=l=a=s=void 0},w.flush=function(){return void 0===s?o:E(f())},w}}).call(this,n(22))},function(e,t,n){"use strict";var r=n(2);n.n(r).a},function(e,t,n){"use strict";var r=n(3);n.n(r).a},function(e,t,n){"use strict";var r=n(4);n.n(r).a},function(e,t,n){"use strict";var r=n(5);n.n(r).a},function(e,t,n){"use strict";var r=n(6);n.n(r).a},function(e,t,n){"use strict";var r=n(7);n.n(r).a},function(e,t,n){"use strict";var r=n(8);n.n(r).a},function(e,t,n){"use strict";var r=n(9);n.n(r).a},function(e,t,n){"use strict";var r=n(10);n.n(r).a},function(e,t,n){"use strict";var r=n(11);n.n(r).a},function(e,t,n){},function(e,t,n){},function(e,t,n){"use strict";var r=n(12);n.n(r).a},function(e,t,n){"use strict";var r=n(13);n.n(r).a},function(e,t,n){"use strict";var r=n(14);n.n(r).a},function(e,t,n){"use strict";var r=n(15);n.n(r).a},function(e,t,n){"use strict";var r=n(16);n.n(r).a},function(e,t,n){"use strict";var r=n(17);n.n(r).a},function(e,t,n){"use strict";var r=n(18);n.n(r).a},function(e,t,n){},function(e,t,n){"use strict";n.r(t),n.d(t,"init",(function(){return fr}));var r=n(0),a=n.n(r),i=["style","currency","currencyDisplay","useGrouping","minimumIntegerDigits","minimumFractionDigits","maximumFractionDigits","minimumSignificantDigits","maximumSignificantDigits","localeMatcher","formatMatcher","unit"];function o(e,t){"undefined"!=typeof console&&(console.warn("[vue-i18n] "+e),t&&console.warn(t.stack))}var s=Array.isArray;function l(e){return null!==e&&"object"==typeof e}function c(e){return"string"==typeof e}var u=Object.prototype.toString;function h(e){return"[object Object]"===u.call(e)}function p(e){return null==e}function f(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];var n=null,r=null;return 1===e.length?l(e[0])||Array.isArray(e[0])?r=e[0]:"string"==typeof e[0]&&(n=e[0]):2===e.length&&("string"==typeof e[0]&&(n=e[0]),(l(e[1])||Array.isArray(e[1]))&&(r=e[1])),{locale:n,params:r}}function d(e){return JSON.parse(JSON.stringify(e))}function m(e,t){return!!~e.indexOf(t)}var v=Object.prototype.hasOwnProperty;function g(e,t){return v.call(e,t)}function _(e){for(var t=arguments,n=Object(e),r=1;r<arguments.length;r++){var a=t[r];if(null!=a){var i=void 0;for(i in a)g(a,i)&&(l(a[i])?n[i]=_(n[i],a[i]):n[i]=a[i])}}return n}function y(e,t){if(e===t)return!0;var n=l(e),r=l(t);if(!n||!r)return!n&&!r&&String(e)===String(t);try{var a=Array.isArray(e),i=Array.isArray(t);if(a&&i)return e.length===t.length&&e.every((function(e,n){return y(e,t[n])}));if(a||i)return!1;var o=Object.keys(e),s=Object.keys(t);return o.length===s.length&&o.every((function(n){return y(e[n],t[n])}))}catch(e){return!1}}var b={beforeCreate:function(){var e=this.$options;if(e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n)if(e.i18n instanceof J){if(e.__i18n)try{var t={};e.__i18n.forEach((function(e){t=_(t,JSON.parse(e))})),Object.keys(t).forEach((function(n){e.i18n.mergeLocaleMessage(n,t[n])}))}catch(e){0}this._i18n=e.i18n,this._i18nWatcher=this._i18n.watchI18nData()}else if(h(e.i18n)){var n=this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this.$root.$i18n:null;if(n&&(e.i18n.root=this.$root,e.i18n.formatter=n.formatter,e.i18n.fallbackLocale=n.fallbackLocale,e.i18n.formatFallbackMessages=n.formatFallbackMessages,e.i18n.silentTranslationWarn=n.silentTranslationWarn,e.i18n.silentFallbackWarn=n.silentFallbackWarn,e.i18n.pluralizationRules=n.pluralizationRules,e.i18n.preserveDirectiveContent=n.preserveDirectiveContent),e.__i18n)try{var r={};e.__i18n.forEach((function(e){r=_(r,JSON.parse(e))})),e.i18n.messages=r}catch(e){0}var a=e.i18n.sharedMessages;a&&h(a)&&(e.i18n.messages=_(e.i18n.messages,a)),this._i18n=new J(e.i18n),this._i18nWatcher=this._i18n.watchI18nData(),(void 0===e.i18n.sync||e.i18n.sync)&&(this._localeWatcher=this.$i18n.watchLocale()),n&&n.onComponentInstanceCreated(this._i18n)}else 0;else this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this._i18n=this.$root.$i18n:e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J&&(this._i18n=e.parent.$i18n)},beforeMount:function(){var e=this.$options;e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n?(e.i18n instanceof J||h(e.i18n))&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0):(this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J||e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J)&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0)},beforeDestroy:function(){if(this._i18n){var e=this;this.$nextTick((function(){e._subscribing&&(e._i18n.unsubscribeDataChanging(e),delete e._subscribing),e._i18nWatcher&&(e._i18nWatcher(),e._i18n.destroyVM(),delete e._i18nWatcher),e._localeWatcher&&(e._localeWatcher(),delete e._localeWatcher)}))}}},x={name:"i18n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},path:{type:String,required:!0},locale:{type:String},places:{type:[Array,Object]}},render:function(e,t){var n=t.data,r=t.parent,a=t.props,i=t.slots,o=r.$i18n;if(o){var s=a.path,l=a.locale,c=a.places,u=i(),h=o.i(s,l,function(e){var t;for(t in e)if("default"!==t)return!1;return Boolean(t)}(u)||c?function(e,t){var n=t?function(e){0;return Array.isArray(e)?e.reduce(w,{}):Object.assign({},e)}(t):{};if(!e)return n;var r=(e=e.filter((function(e){return e.tag||""!==e.text.trim()}))).every(C);0;return e.reduce(r?E:w,n)}(u.default,c):u),p=a.tag&&!0!==a.tag||!1===a.tag?a.tag:"span";return p?e(p,n,h):h}}};function E(e,t){return t.data&&t.data.attrs&&t.data.attrs.place&&(e[t.data.attrs.place]=t),e}function w(e,t,n){return e[n]=t,e}function C(e){return Boolean(e.data&&e.data.attrs&&e.data.attrs.place)}var S,k={name:"i18n-n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},value:{type:Number,required:!0},format:{type:[String,Object]},locale:{type:String}},render:function(e,t){var n=t.props,r=t.parent,a=t.data,o=r.$i18n;if(!o)return null;var s=null,u=null;c(n.format)?s=n.format:l(n.format)&&(n.format.key&&(s=n.format.key),u=Object.keys(n.format).reduce((function(e,t){var r;return m(i,t)?Object.assign({},e,((r={})[t]=n.format[t],r)):e}),null));var h=n.locale||o.locale,p=o._ntp(n.value,h,s,u),f=p.map((function(e,t){var n,r=a.scopedSlots&&a.scopedSlots[e.type];return r?r(((n={})[e.type]=e.value,n.index=t,n.parts=p,n)):e.value})),d=n.tag&&!0!==n.tag||!1===n.tag?n.tag:"span";return d?e(d,{attrs:a.attrs,class:a.class,staticClass:a.staticClass},f):f}};function O(e,t,n){T(e,n)&&I(e,t,n)}function M(e,t,n,r){if(T(e,n)){var a=n.context.$i18n;(function(e,t){var n=t.context;return e._locale===n.$i18n.locale})(e,n)&&y(t.value,t.oldValue)&&y(e._localeMessage,a.getLocaleMessage(a.locale))||I(e,t,n)}}function N(e,t,n,r){if(n.context){var a=n.context.$i18n||{};t.modifiers.preserve||a.preserveDirectiveContent||(e.textContent=""),e._vt=void 0,delete e._vt,e._locale=void 0,delete e._locale,e._localeMessage=void 0,delete e._localeMessage}else o("Vue instance does not exists in VNode context")}function T(e,t){var n=t.context;return n?!!n.$i18n||(o("VueI18n instance does not exists in Vue instance"),!1):(o("Vue instance does not exists in VNode context"),!1)}function I(e,t,n){var r,a,i=function(e){var t,n,r,a;c(e)?t=e:h(e)&&(t=e.path,n=e.locale,r=e.args,a=e.choice);return{path:t,locale:n,args:r,choice:a}}(t.value),s=i.path,l=i.locale,u=i.args,p=i.choice;if(s||l||u)if(s){var f=n.context;e._vt=e.textContent=null!=p?(r=f.$i18n).tc.apply(r,[s,p].concat(R(l,u))):(a=f.$i18n).t.apply(a,[s].concat(R(l,u))),e._locale=f.$i18n.locale,e._localeMessage=f.$i18n.getLocaleMessage(f.$i18n.locale)}else o("`path` is required in v-t directive");else o("value type not supported")}function R(e,t){var n=[];return e&&n.push(e),t&&(Array.isArray(t)||h(t))&&n.push(t),n}function A(e){A.installed=!0;(S=e).version&&Number(S.version.split(".")[0]);(function(e){e.prototype.hasOwnProperty("$i18n")||Object.defineProperty(e.prototype,"$i18n",{get:function(){return this._i18n}}),e.prototype.$t=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.$i18n;return r._t.apply(r,[e,r.locale,r._getMessages(),this].concat(t))},e.prototype.$tc=function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];var a=this.$i18n;return a._tc.apply(a,[e,a.locale,a._getMessages(),this,t].concat(n))},e.prototype.$te=function(e,t){var n=this.$i18n;return n._te(e,n.locale,n._getMessages(),t)},e.prototype.$d=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).d.apply(t,[e].concat(n))},e.prototype.$n=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).n.apply(t,[e].concat(n))}})(S),S.mixin(b),S.directive("t",{bind:O,update:M,unbind:N}),S.component(x.name,x),S.component(k.name,k),S.config.optionMergeStrategies.i18n=function(e,t){return void 0===t?e:t}}var L=function(){this._caches=Object.create(null)};L.prototype.interpolate=function(e,t){if(!t)return[e];var n=this._caches[e];return n||(n=function(e){var t=[],n=0,r="";for(;n<e.length;){var a=e[n++];if("{"===a){r&&t.push({type:"text",value:r}),r="";var i="";for(a=e[n++];void 0!==a&&"}"!==a;)i+=a,a=e[n++];var o="}"===a,s=D.test(i)?"list":o&&$.test(i)?"named":"unknown";t.push({value:i,type:s})}else"%"===a?"{"!==e[n]&&(r+=a):r+=a}return r&&t.push({type:"text",value:r}),t}(e),this._caches[e]=n),function(e,t){var n=[],r=0,a=Array.isArray(t)?"list":l(t)?"named":"unknown";if("unknown"===a)return n;for(;r<e.length;){var i=e[r];switch(i.type){case"text":n.push(i.value);break;case"list":n.push(t[parseInt(i.value,10)]);break;case"named":"named"===a&&n.push(t[i.value]);break;case"unknown":0}r++}return n}(n,t)};var D=/^(?:\d)+/,$=/^(?:\w)+/;var P=[];P[0]={ws:[0],ident:[3,0],"[":[4],eof:[7]},P[1]={ws:[1],".":[2],"[":[4],eof:[7]},P[2]={ws:[2],ident:[3,0],0:[3,0],number:[3,0]},P[3]={ident:[3,0],0:[3,0],number:[3,0],ws:[1,1],".":[2,1],"[":[4,1],eof:[7,1]},P[4]={"'":[5,0],'"':[6,0],"[":[4,2],"]":[1,3],eof:8,else:[4,0]},P[5]={"'":[4,0],eof:8,else:[5,0]},P[6]={'"':[4,0],eof:8,else:[6,0]};var V=/^\s?(?:true|false|-?[\d.]+|'[^']*'|"[^"]*")\s?$/;function j(e){if(null==e)return"eof";switch(e.charCodeAt(0)){case 91:case 93:case 46:case 34:case 39:return e;case 95:case 36:case 45:return"ident";case 9:case 10:case 13:case 160:case 65279:case 8232:case 8233:return"ws"}return"ident"}function F(e){var t,n,r,a=e.trim();return("0"!==e.charAt(0)||!isNaN(e))&&(r=a,V.test(r)?(n=(t=a).charCodeAt(0))!==t.charCodeAt(t.length-1)||34!==n&&39!==n?t:t.slice(1,-1):"*"+a)}var z=function(){this._cache=Object.create(null)};z.prototype.parsePath=function(e){var t=this._cache[e];return t||(t=function(e){var t,n,r,a,i,o,s,l=[],c=-1,u=0,h=0,p=[];function f(){var t=e[c+1];if(5===u&&"'"===t||6===u&&'"'===t)return c++,r="\\"+t,p[0](),!0}for(p[1]=function(){void 0!==n&&(l.push(n),n=void 0)},p[0]=function(){void 0===n?n=r:n+=r},p[2]=function(){p[0](),h++},p[3]=function(){if(h>0)h--,u=4,p[0]();else{if(h=0,void 0===n)return!1;if(!1===(n=F(n)))return!1;p[1]()}};null!==u;)if(c++,"\\"!==(t=e[c])||!f()){if(a=j(t),8===(i=(s=P[u])[a]||s.else||8))return;if(u=i[0],(o=p[i[1]])&&(r=void 0===(r=i[2])?t:r,!1===o()))return;if(7===u)return l}}(e))&&(this._cache[e]=t),t||[]},z.prototype.getPathValue=function(e,t){if(!l(e))return null;var n=this.parsePath(t);if(0===n.length)return null;for(var r=n.length,a=e,i=0;i<r;){var o=a[n[i]];if(void 0===o)return null;a=o,i++}return a};var B,W=/<\/?[\w\s="/.':;#-\/]+>/,U=/(?:@(?:\.[a-z]+)?:(?:[\w\-_|.]+|\([\w\-_|.]+\)))/g,H=/^@(?:\.([a-z]+))?:/,q=/[()]/g,G={upper:function(e){return e.toLocaleUpperCase()},lower:function(e){return e.toLocaleLowerCase()},capitalize:function(e){return""+e.charAt(0).toLocaleUpperCase()+e.substr(1)}},K=new L,J=function(e){var t=this;void 0===e&&(e={}),!S&&"undefined"!=typeof window&&window.Vue&&A(window.Vue);var n=e.locale||"en-US",r=!1!==e.fallbackLocale&&(e.fallbackLocale||"en-US"),a=e.messages||{},i=e.dateTimeFormats||{},o=e.numberFormats||{};this._vm=null,this._formatter=e.formatter||K,this._modifiers=e.modifiers||{},this._missing=e.missing||null,this._root=e.root||null,this._sync=void 0===e.sync||!!e.sync,this._fallbackRoot=void 0===e.fallbackRoot||!!e.fallbackRoot,this._formatFallbackMessages=void 0!==e.formatFallbackMessages&&!!e.formatFallbackMessages,this._silentTranslationWarn=void 0!==e.silentTranslationWarn&&e.silentTranslationWarn,this._silentFallbackWarn=void 0!==e.silentFallbackWarn&&!!e.silentFallbackWarn,this._dateTimeFormatters={},this._numberFormatters={},this._path=new z,this._dataListeners=[],this._componentInstanceCreatedListener=e.componentInstanceCreatedListener||null,this._preserveDirectiveContent=void 0!==e.preserveDirectiveContent&&!!e.preserveDirectiveContent,this.pluralizationRules=e.pluralizationRules||{},this._warnHtmlInMessage=e.warnHtmlInMessage||"off",this._postTranslation=e.postTranslation||null,this.getChoiceIndex=function(e,n){var r=Object.getPrototypeOf(t);if(r&&r.getChoiceIndex)return r.getChoiceIndex.call(t,e,n);var a,i;return t.locale in t.pluralizationRules?t.pluralizationRules[t.locale].apply(t,[e,n]):(a=e,i=n,a=Math.abs(a),2===i?a?a>1?1:0:1:a?Math.min(a,2):0)},this._exist=function(e,n){return!(!e||!n)&&(!p(t._path.getPathValue(e,n))||!!e[n])},"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||Object.keys(a).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,a[e])})),this._initVM({locale:n,fallbackLocale:r,messages:a,dateTimeFormats:i,numberFormats:o})},Q={vm:{configurable:!0},messages:{configurable:!0},dateTimeFormats:{configurable:!0},numberFormats:{configurable:!0},availableLocales:{configurable:!0},locale:{configurable:!0},fallbackLocale:{configurable:!0},formatFallbackMessages:{configurable:!0},missing:{configurable:!0},formatter:{configurable:!0},silentTranslationWarn:{configurable:!0},silentFallbackWarn:{configurable:!0},preserveDirectiveContent:{configurable:!0},warnHtmlInMessage:{configurable:!0},postTranslation:{configurable:!0}};J.prototype._checkLocaleMessage=function(e,t,n){var r=function(e,t,n,a){if(h(n))Object.keys(n).forEach((function(i){var o=n[i];h(o)?(a.push(i),a.push("."),r(e,t,o,a),a.pop(),a.pop()):(a.push(i),r(e,t,o,a),a.pop())}));else if(Array.isArray(n))n.forEach((function(n,i){h(n)?(a.push("["+i+"]"),a.push("."),r(e,t,n,a),a.pop(),a.pop()):(a.push("["+i+"]"),r(e,t,n,a),a.pop())}));else if(c(n)){if(W.test(n)){var i="Detected HTML in message '"+n+"' of keypath '"+a.join("")+"' at '"+t+"'. Consider component interpolation with '<i18n>' to avoid XSS. See https://bit.ly/2ZqJzkp";"warn"===e?o(i):"error"===e&&function(e,t){"undefined"!=typeof console&&(console.error("[vue-i18n] "+e),t&&console.error(t.stack))}(i)}}};r(t,e,n,[])},J.prototype._initVM=function(e){var t=S.config.silent;S.config.silent=!0,this._vm=new S({data:e}),S.config.silent=t},J.prototype.destroyVM=function(){this._vm.$destroy()},J.prototype.subscribeDataChanging=function(e){this._dataListeners.push(e)},J.prototype.unsubscribeDataChanging=function(e){!function(e,t){if(e.length){var n=e.indexOf(t);if(n>-1)e.splice(n,1)}}(this._dataListeners,e)},J.prototype.watchI18nData=function(){var e=this;return this._vm.$watch("$data",(function(){for(var t=e._dataListeners.length;t--;)S.nextTick((function(){e._dataListeners[t]&&e._dataListeners[t].$forceUpdate()}))}),{deep:!0})},J.prototype.watchLocale=function(){if(!this._sync||!this._root)return null;var e=this._vm;return this._root.$i18n.vm.$watch("locale",(function(t){e.$set(e,"locale",t),e.$forceUpdate()}),{immediate:!0})},J.prototype.onComponentInstanceCreated=function(e){this._componentInstanceCreatedListener&&this._componentInstanceCreatedListener(e,this)},Q.vm.get=function(){return this._vm},Q.messages.get=function(){return d(this._getMessages())},Q.dateTimeFormats.get=function(){return d(this._getDateTimeFormats())},Q.numberFormats.get=function(){return d(this._getNumberFormats())},Q.availableLocales.get=function(){return Object.keys(this.messages).sort()},Q.locale.get=function(){return this._vm.locale},Q.locale.set=function(e){this._vm.$set(this._vm,"locale",e)},Q.fallbackLocale.get=function(){return this._vm.fallbackLocale},Q.fallbackLocale.set=function(e){this._localeChainCache={},this._vm.$set(this._vm,"fallbackLocale",e)},Q.formatFallbackMessages.get=function(){return this._formatFallbackMessages},Q.formatFallbackMessages.set=function(e){this._formatFallbackMessages=e},Q.missing.get=function(){return this._missing},Q.missing.set=function(e){this._missing=e},Q.formatter.get=function(){return this._formatter},Q.formatter.set=function(e){this._formatter=e},Q.silentTranslationWarn.get=function(){return this._silentTranslationWarn},Q.silentTranslationWarn.set=function(e){this._silentTranslationWarn=e},Q.silentFallbackWarn.get=function(){return this._silentFallbackWarn},Q.silentFallbackWarn.set=function(e){this._silentFallbackWarn=e},Q.preserveDirectiveContent.get=function(){return this._preserveDirectiveContent},Q.preserveDirectiveContent.set=function(e){this._preserveDirectiveContent=e},Q.warnHtmlInMessage.get=function(){return this._warnHtmlInMessage},Q.warnHtmlInMessage.set=function(e){var t=this,n=this._warnHtmlInMessage;if(this._warnHtmlInMessage=e,n!==e&&("warn"===e||"error"===e)){var r=this._getMessages();Object.keys(r).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,r[e])}))}},Q.postTranslation.get=function(){return this._postTranslation},Q.postTranslation.set=function(e){this._postTranslation=e},J.prototype._getMessages=function(){return this._vm.messages},J.prototype._getDateTimeFormats=function(){return this._vm.dateTimeFormats},J.prototype._getNumberFormats=function(){return this._vm.numberFormats},J.prototype._warnDefault=function(e,t,n,r,a,i){if(!p(n))return n;if(this._missing){var o=this._missing.apply(null,[e,t,r,a]);if(c(o))return o}else 0;if(this._formatFallbackMessages){var s=f.apply(void 0,a);return this._render(t,i,s.params,t)}return t},J.prototype._isFallbackRoot=function(e){return!e&&!p(this._root)&&this._fallbackRoot},J.prototype._isSilentFallbackWarn=function(e){return this._silentFallbackWarn instanceof RegExp?this._silentFallbackWarn.test(e):this._silentFallbackWarn},J.prototype._isSilentFallback=function(e,t){return this._isSilentFallbackWarn(t)&&(this._isFallbackRoot()||e!==this.fallbackLocale)},J.prototype._isSilentTranslationWarn=function(e){return this._silentTranslationWarn instanceof RegExp?this._silentTranslationWarn.test(e):this._silentTranslationWarn},J.prototype._interpolate=function(e,t,n,r,a,i,o){if(!t)return null;var s,l=this._path.getPathValue(t,n);if(Array.isArray(l)||h(l))return l;if(p(l)){if(!h(t))return null;if(!c(s=t[n]))return null}else{if(!c(l))return null;s=l}return(s.indexOf("@:")>=0||s.indexOf("@.")>=0)&&(s=this._link(e,t,s,r,"raw",i,o)),this._render(s,a,i,n)},J.prototype._link=function(e,t,n,r,a,i,o){var s=n,l=s.match(U);for(var c in l)if(l.hasOwnProperty(c)){var u=l[c],h=u.match(H),p=h[0],f=h[1],d=u.replace(p,"").replace(q,"");if(m(o,d))return s;o.push(d);var v=this._interpolate(e,t,d,r,"raw"===a?"string":a,"raw"===a?void 0:i,o);if(this._isFallbackRoot(v)){if(!this._root)throw Error("unexpected error");var g=this._root.$i18n;v=g._translate(g._getMessages(),g.locale,g.fallbackLocale,d,r,a,i)}v=this._warnDefault(e,d,v,r,Array.isArray(i)?i:[i],a),this._modifiers.hasOwnProperty(f)?v=this._modifiers[f](v):G.hasOwnProperty(f)&&(v=G[f](v)),o.pop(),s=v?s.replace(u,v):s}return s},J.prototype._render=function(e,t,n,r){var a=this._formatter.interpolate(e,n,r);return a||(a=K.interpolate(e,n,r)),"string"!==t||c(a)?a:a.join("")},J.prototype._appendItemToChain=function(e,t,n){var r=!1;return m(e,t)||(r=!0,t&&(r="!"!==t[t.length-1],t=t.replace(/!/g,""),e.push(t),n&&n[t]&&(r=n[t]))),r},J.prototype._appendLocaleToChain=function(e,t,n){var r,a=t.split("-");do{var i=a.join("-");r=this._appendItemToChain(e,i,n),a.splice(-1,1)}while(a.length&&!0===r);return r},J.prototype._appendBlockToChain=function(e,t,n){for(var r=!0,a=0;a<t.length&&"boolean"==typeof r;a++){var i=t[a];c(i)&&(r=this._appendLocaleToChain(e,i,n))}return r},J.prototype._getLocaleChain=function(e,t){if(""===e)return[];this._localeChainCache||(this._localeChainCache={});var n=this._localeChainCache[e];if(!n){t||(t=this.fallbackLocale),n=[];for(var r,a=[e];s(a);)a=this._appendBlockToChain(n,a,t);(a=c(r=s(t)?t:l(t)?t.default?t.default:null:t)?[r]:r)&&this._appendBlockToChain(n,a,null),this._localeChainCache[e]=n}return n},J.prototype._translate=function(e,t,n,r,a,i,o){for(var s,l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(!p(s=this._interpolate(u,e[u],r,a,i,o,[r])))return s}return null},J.prototype._t=function(e,t,n,r){for(var a,i=[],o=arguments.length-4;o-- >0;)i[o]=arguments[o+4];if(!e)return"";var s=f.apply(void 0,i),l=s.locale||t,c=this._translate(n,l,this.fallbackLocale,e,r,"string",s.params);if(this._isFallbackRoot(c)){if(!this._root)throw Error("unexpected error");return(a=this._root).$t.apply(a,[e].concat(i))}return c=this._warnDefault(l,e,c,r,i,"string"),this._postTranslation&&null!=c&&(c=this._postTranslation(c,e)),c},J.prototype.t=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this)._t.apply(t,[e,this.locale,this._getMessages(),null].concat(n))},J.prototype._i=function(e,t,n,r,a){var i=this._translate(n,t,this.fallbackLocale,e,r,"raw",a);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.i(e,t,a)}return this._warnDefault(t,e,i,r,[a],"raw")},J.prototype.i=function(e,t,n){return e?(c(t)||(t=this.locale),this._i(e,t,this._getMessages(),null,n)):""},J.prototype._tc=function(e,t,n,r,a){for(var i,o=[],s=arguments.length-5;s-- >0;)o[s]=arguments[s+5];if(!e)return"";void 0===a&&(a=1);var l={count:a,n:a},c=f.apply(void 0,o);return c.params=Object.assign(l,c.params),o=null===c.locale?[c.params]:[c.locale,c.params],this.fetchChoice((i=this)._t.apply(i,[e,t,n,r].concat(o)),a)},J.prototype.fetchChoice=function(e,t){if(!e&&!c(e))return null;var n=e.split("|");return n[t=this.getChoiceIndex(t,n.length)]?n[t].trim():e},J.prototype.tc=function(e,t){for(var n,r=[],a=arguments.length-2;a-- >0;)r[a]=arguments[a+2];return(n=this)._tc.apply(n,[e,this.locale,this._getMessages(),null,t].concat(r))},J.prototype._te=function(e,t,n){for(var r=[],a=arguments.length-3;a-- >0;)r[a]=arguments[a+3];var i=f.apply(void 0,r).locale||t;return this._exist(n[i],e)},J.prototype.te=function(e,t){return this._te(e,this.locale,this._getMessages(),t)},J.prototype.getLocaleMessage=function(e){return d(this._vm.messages[e]||{})},J.prototype.setLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,t)},J.prototype.mergeLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,_({},this._vm.messages[e]||{},t))},J.prototype.getDateTimeFormat=function(e){return d(this._vm.dateTimeFormats[e]||{})},J.prototype.setDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,t),this._clearDateTimeFormat(e,t)},J.prototype.mergeDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,_(this._vm.dateTimeFormats[e]||{},t)),this._clearDateTimeFormat(e,t)},J.prototype._clearDateTimeFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._dateTimeFormatters.hasOwnProperty(r)&&delete this._dateTimeFormatters[r]}},J.prototype._localizeDateTime=function(e,t,n,r,a){for(var i=t,o=r[i],s=this._getLocaleChain(t,n),l=0;l<s.length;l++){var c=s[l];if(i=c,!p(o=r[c])&&!p(o[a]))break}if(p(o)||p(o[a]))return null;var u=o[a],h=i+"__"+a,f=this._dateTimeFormatters[h];return f||(f=this._dateTimeFormatters[h]=new Intl.DateTimeFormat(i,u)),f.format(e)},J.prototype._d=function(e,t,n){if(!n)return new Intl.DateTimeFormat(t).format(e);var r=this._localizeDateTime(e,t,this.fallbackLocale,this._getDateTimeFormats(),n);if(this._isFallbackRoot(r)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.d(e,n,t)}return r||""},J.prototype.d=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._d(e,r,a)},J.prototype.getNumberFormat=function(e){return d(this._vm.numberFormats[e]||{})},J.prototype.setNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,t),this._clearNumberFormat(e,t)},J.prototype.mergeNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,_(this._vm.numberFormats[e]||{},t)),this._clearNumberFormat(e,t)},J.prototype._clearNumberFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._numberFormatters.hasOwnProperty(r)&&delete this._numberFormatters[r]}},J.prototype._getNumberFormatter=function(e,t,n,r,a,i){for(var o=t,s=r[o],l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(o=u,!p(s=r[u])&&!p(s[a]))break}if(p(s)||p(s[a]))return null;var h,f=s[a];if(i)h=new Intl.NumberFormat(o,Object.assign({},f,i));else{var d=o+"__"+a;(h=this._numberFormatters[d])||(h=this._numberFormatters[d]=new Intl.NumberFormat(o,f))}return h},J.prototype._n=function(e,t,n,r){if(!J.availabilities.numberFormat)return"";if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).format(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.format(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.n(e,Object.assign({},{key:n,locale:t},r))}return i||""},J.prototype.n=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null,o=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key),o=Object.keys(t[0]).reduce((function(e,n){var r;return m(i,n)?Object.assign({},e,((r={})[n]=t[0][n],r)):e}),null)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._n(e,r,a,o)},J.prototype._ntp=function(e,t,n,r){if(!J.availabilities.numberFormat)return[];if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).formatToParts(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.formatToParts(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n._ntp(e,t,n,r)}return i||[]},Object.defineProperties(J.prototype,Q),Object.defineProperty(J,"availabilities",{get:function(){if(!B){var e="undefined"!=typeof Intl;B={dateTimeFormat:e&&void 0!==Intl.DateTimeFormat,numberFormat:e&&void 0!==Intl.NumberFormat}}return B}}),J.install=A,J.version="8.18.2";var X=J,Z=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("el-container",{class:["ec-doc","ec-doc-"+e.shared.docType,"ec-doc-locale-"+e.shared.locale]},[n("el-aside",{staticStyle:{height:"100%"},attrs:{width:"300px"}},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("Search"),e._v(" "),n("DocNav")],1),e._v(" "),n("el-main",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1)],1)};Z._withStripped=!0;var Y=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-nav"},[e.isOption?n("h3",[e._v(e._s(e.title))]):e._e(),e._v(" "),n("div",{staticClass:"toolbox"},[e.isOption?n("span",{staticClass:"item",on:{click:e.collapseAll}},[n("i",{staticClass:"el-icon-s-fold"}),e._v(e._s(e.$t("nav.collapseAll")))]):e._e()]),e._v(" "),n("el-tree",{ref:"tree",attrs:{"node-key":"path","empty-text":"",props:e.props,lazy:"","default-expanded-keys":e.expandedKeys,indent:10,"expand-on-click-node":!1,load:e.loadTreeNode,data:e.treeData,"current-node-key":e.initialSelectedNode},on:{"current-change":e.onSelectNode},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.node,a=t.data;return"tutorial"!==e.shared.docType?n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(r.expanded&&a.labelExpanded||a.label))]),e._v(" "),null!=a.defaultValue?n("span",{staticClass:"default-value"},[e._v(e._s(a.defaultValue))]):r.isLeaf?n("span",{staticClass:"default-value"},[e._v("...")]):e._e(),e._v(" "),a.isRoot||r.expanded?e._e():n("span",[e._v(",")])]):n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(a.label))])])}}],null,!0)})],1)};Y._withStripped=!0;var ee,te,ne,re,ae=n(21),ie=n(23);function oe(e){return(oe="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var se,le,ce={},ue={},he=[];function pe(e){return new Promise((function(t,n){var r=Object(ie.getDocJSONPVarNname)(e),a="".concat(ee,"/").concat(e,"?").concat(ne),i=document.createElement("script");i.async=!0,i.onload=function(){window[r]?t(window[r]):n("Load failed. ".concat(r))},i.src=a,document.body.appendChild(i)}))}function fe(e){return"doc-content-"+e.replace(/[\. <>]/g,"-")}function de(){if(!re)throw new Error("Preload json with url first");return re}function me(e,t,n,r){return e,ee=t,te=n,ne=r||"1",re||(re=pe("".concat(te,"-outline.js")).then((function(e){return function(e){function t(e,t,n){return e?e+n+t:t}function n(e,r){e.type||(e.type=oe(e.default)),e.type instanceof Array||(e.type=[e.type]);for(var a=0;a<e.type.length;a++)"*"===e.type[a]&&(e.type[a]="any");if(e.arrayItemType?e.path=t(r.path,e.arrayItemType,"-"):e.path=t(r.path,e.prop,"."),e.children){e.path.indexOf(".")<0&&!e.children[0].arrayItemType&&(se[e.path]=e);for(var i=0;i<e.children.length;i++)n(e.children[i],e)}ue[e.path]=e}e,se={};for(var r=0;r<e.children.length;r++)n(e.children[r],{});return e.isRoot=!0,he=Object.keys(ue),e}(e)}))),re}function ve(e){if(!se)throw new Error("Outline data is not loaded.");var t=e.split(".")[0],n=se[t]&&e?te+"."+t:te;if(!ce[n]){var r=pe("".concat(n,".js"));ce[n]={fetcher:r},r.then((function(e){ce[n].indexer=function(e,t){var n,r=[];for(var a in e)r.push({path:t?t+"."+a:a,content:e[a].desc,text:(n=e[a].desc,n.replace(/<[^>]*>?/gm,""))});return{search:function(e){var t=[],n=e.split(/[ +,]/).filter((function(e){return!!e})).map((function(e){return new RegExp(e,"i")}));if(!n.length)return t;for(var a=0;a<r.length;a++){for(var i=!0,o=0;o<n.length;o++)if(!n[o].test(r[a].text)&&!n[o].test(r[a].path)){i=!1;break}i&&t.push(r[a])}return t}}}(e,t)}))}return ce[n]}function ge(e){return ve(e).fetcher}function _e(e){return ue[e]}function ye(e){if(!e)return Object.keys(se)[0];if(_e(e.replace("[i]","")))return e.replace("[i]","");var t,n=e.split(".").map((function(e){var t=_e(e),n=t&&t.children&&t&&t.children[0];return n&&n.arrayItemType?e+"-"+n.arrayItemType:e}));if(_e(n.join(".")))return n.join(".");for(var r=-1/0,a=0;a<he.length;a++){var i=he[a],o=Object(ae.stringSimilarity)(e,i);o>r&&(r=o,t=i)}return t}function be(e){return(be="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var xe=["auto","top","bottom","right"];function Ee(e){ke.computedOptionExampleLayout="auto"===e?window.innerWidth<1400?"bottom":"right":e,ke.optionExampleLayout=e,window.localStorage&&window.localStorage.setItem("_ec_option_example_layout",e)}var we,Ce,Se=(we={},!(Ce=window.localStorage&&window.localStorage.getItem("_ec_option_example_layout"))||"auto"===Ce||xe.indexOf(Ce)<0?(we.mode="auto",we.computedMode=window.innerWidth<1400?"bottom":"right"):we.mode=we.computedMode=Ce,we),ke={docType:"",currentPath:"",fuzzySearch:!1,searchQuery:"",isMobile:!1,locale:"zh",showOptionExample:!1,allOptionExamples:null,cleanMode:!1,currentExampleName:"",currentExampleOption:"",optionExampleLayout:Se.mode,computedOptionExampleLayout:Se.computedMode};function Oe(){if(ke.isMobile){var e=ke.currentPath.split("."),t=_e(ke.currentPath);return t&&(!t.children||!t.children.length)&&e.length>1&&e.pop(),e.join(".")}return ke.currentPath.split(".")[0]}function Me(){return"option"===ke.docType||"option-gl"===ke.docType}var Ne=["markPoint","markLine","markArea","tooltip","axisPointer"];function Te(e,t,n){function r(e,t,a,i){var o=t.shift();if(i=(i?i+".":"")+o,"data"!==a||"object"===be(e)&&!Array.isArray(e)||(e={value:e}),e=Object.assign({},e),!t.length)return void 0===n?(delete e[o],e):(e[o]=n,e);var s=o.split("-"),l=s[0],c=s[1];if(null==e[l]){var u=_e(i);e[l]=function(e){return"markPoint"===e?{data:[{type:"max"}]}:"markLine"===e?{data:[{type:"average"}]}:"markArea"===e?{data:[[{type:"min"},{type:"max"}]]}:void 0}(l)||(u&&u.isArray?[]:{})}var h=e[l];return Array.isArray(h)?"series"===l?e[l]=h.map((function(e,n){return c&&e.type!==c?e:r(e,t.slice(),l,i)})):(e[l]=h.slice(),e[l][0]=r(e[l][0]||{},t.slice(),l,i)):(c&&h.type!==c&&(e[l]=h),e[l]=r(h,t.slice(),l,i)),e}var a=t.split(".")[0];return"timeline"===a&&e.baseOption?Object.assign({},e,{baseOption:r(e.baseOption,t.split("."),"","")}):Ne.indexOf(a)>=0?function e(n,a){if(n[a])return r(n,t.split("."),"","");if(Array.isArray(n)){for(var i=[],o=0;o<n.length;o++)i.push(e(n[o],a));return i}if("object"===be(n)){var s={};for(var l in n)n.hasOwnProperty(l)&&(s[l]=e(n[l],a));return s}return n}(e,a):r(e,t.split("."),"","")}function Ie(){var e=decodeURIComponent(window.location.hash.slice(1));if(e.startsWith("/search/")){var t=e.substr("/search/".length);ke.fuzzySearch=!0,ke.searchQuery=t}else e&&(ke.currentPath=e,ke.fuzzySearch=!1)}function Re(e){window.location.hash="#"+encodeURIComponent(e)}var Ae=n(1),Le=n.n(Ae);function De(e,t){var n=[];return t.children&&t.children.forEach((function(e){var t,r;n.push(((r={path:(t=e).path}).path=t.path,t.arrayItemType?(r.label="{type: ".concat(t.arrayItemType,", ...}"),r.labelExpanded="{"):null!=t.default?(r.defaultValue=t.default,r.label=t.prop+": ",r.leaf=!0):t.isArray?(r.label=t.prop+": [{...}]",r.labelExpanded=t.prop+": [{"):t.isObject?(r.label=t.prop+": {...}",r.labelExpanded=t.prop+": {"):(r.label=t.prop,r.leaf=!0),r.$source=Object.freeze(t),r))})),n}var $e={data:function(){return{props:{isLeaf:"leaf"},title:"setOption({",treeData:[],expandedKeys:[],loading:!0,shared:ke,initialSelectedNode:ke.currentPath}},created:function(){this.updateTreeSelectionAndExpand()},computed:{isOption:function(){return Me()}},methods:{updateTreeSelectionAndExpand:function(){this.expandedKeys=[];for(var e,t=this.shared.currentPath;(e=t.lastIndexOf("."))>=0||(e=t.lastIndexOf("-"))>=0;)t=t.substr(0,e),this.expandedKeys.push(t)},loadTreeNode:function(e,t){var n=this;0===e.level?(this.loading=!1,de().then((function(r){t(De(e.data,r)),setTimeout((function(){n.scrollToCurrentTreeNode()}),200)}))):e.data.children&&e.data.children.length?t(e.data.children):e.data.$source?t(De(e.data,e.data.$source)):t([])},onSelectNode:function(e,t){this.shared.currentPath=e.path},scrollToCurrentTreeNode:function(){var e=this.$el.querySelector(".el-tree-node.is-current");if(e){var t=e.getBoundingClientRect(),n=this.$el.getBoundingClientRect();(t.top>n.bottom||t.bottom<n.top)&&Le()(e,{time:500,align:{top:.1}})}},manualSelectNode:function(e){var t=this;this.updateTreeSelectionAndExpand(),setTimeout((function(){t.$refs.tree.setCurrentKey(null),t.$refs.tree.setCurrentKey(e),setTimeout((function(){t.scrollToCurrentTreeNode()}),200)}),50)},collapseAll:function(){for(var e in this.$refs.tree.store.nodesMap)this.$refs.tree.store.nodesMap[e].expanded=!1}},watch:{"shared.currentPath":function(e){Re(e),this.manualSelectNode(e)}}};n(31);function Pe(e,t,n,r,a,i,o,s){var l,c="function"==typeof e?e.options:e;if(t&&(c.render=t,c.staticRenderFns=n,c._compiled=!0),r&&(c.functional=!0),i&&(c._scopeId="data-v-"+i),o?(l=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),a&&a.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},c._ssrRegister=l):a&&(l=s?function(){a.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:a),l)if(c.functional){c._injectStyles=l;var u=c.render;c.render=function(e,t){return l.call(t),u(e,t)}}else{var h=c.beforeCreate;c.beforeCreate=h?[].concat(h,l):[l]}return{exports:e,options:c}}var Ve=Pe($e,Y,[],!1,null,null,null);Ve.options.__file="src/components/DocNav.vue";var je=Ve.exports,Fe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-main"},[n("div",{ref:"docContentDom",class:["doc-content",e.shared.showOptionExample?"option-example-actived":"","option-example-"+e.shared.computedOptionExampleLayout+"-layout"]},[n("h2",{attrs:{id:e.pageId}},[e._v(e._s(e.pageTitle))]),e._v(" "),e.pageDesc?n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"page-description",domProps:{innerHTML:e._s(e.pageDesc)}}):e._e(),e._v(" "),e.pageDisplayOutline.children&&e.pageDisplayOutline.children&&1<=e.maxDepth?n("div",[n("h3",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),e._l(e.pageDisplayOutline.children,(function(t){return n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.pageDescMap,"max-depth":e.maxDepth,depth:1},on:{"scroll-to-self":e.scrollTo,"toggle-expanded":e.handleCardExpandToggle}})}))],2):e._e()]),e._v(" "),e.showLiveExample?[e.shared.showOptionExample?n("LiveExample",{ref:"liveExample"}):n("div",{staticClass:"open-option-example",on:{click:e.openOptionExample}},[n("i",{staticClass:"el-icon-data-line"}),e._v(" "+e._s(e.$t("example.titleShort"))+"\n        ")])]:e._e()],2)};Fe._withStripped=!0;var ze=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["doc-content-item-card","level-"+e.depth,e.isLeaf?"leaf":"",e.shared.currentPath===e.nodeData.path?"current":""],attrs:{id:e.itemId}},[e.expanded?n("div",{staticClass:"hierarchy-line"}):e._e(),e._v(" "),n("h4",[e.depth>1?n("span",{staticClass:"guider"}):e._e(),e._v(" "),e.supportsExpandable?n("el-button",{attrs:{plain:"",circle:"",size:"mini",icon:e.expanded?"el-icon-minus":"el-icon-plus"},on:{click:e.toggleExpanded}}):e._e(),e._v(" "),e.shared.isMobile?e._e():n("span",{staticClass:"path-parent"},e._l(e.parentPath,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text)+".")])})),0),e._v(" "),n("span",{staticClass:"path-base"},[n("a",{attrs:{href:"#"+e.baseName.link}},[e._v(e._s(e.baseName.text))])]),e._v(" "),e.nodeData.default&&"*"!==e.nodeData.default?n("span",{staticClass:"default-value"},[e._v(" = "+e._s(e.nodeData.default))]):e._e(),e._v(" "),e.uiControl&&e.shared.allOptionExamples&&!e.shared.isMobile?n("span",{class:["control-toggle",e.enableUIControl?"active":""],on:{click:e.toggleUIControl}},[n("i",[e._v("")]),e._v(" "+e._s(e.$t("example.tryDesc"))+"\n            ")]):e._e()],1),e._v(" "),n("div",{staticClass:"prop-types"},e._l(e.nodeData.type,(function(t){return n("span",{key:t,class:["prop-type","prop-type-"+t.toLowerCase()]},[e._v(e._s(t))])})),0),e._v(" "),e.enableUIControl?n("OptionControl",{attrs:{controlConfig:e.uiControl,optionPath:e.nodeData.path}}):e._e(),e._v(" "),n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"item-description",domProps:{innerHTML:e._s(e.desc)}}),e._v(" "),e.supportsExpandable?n("div",{staticClass:"children"},e._l(e.nodeData.children,(function(t){return e.expanded?n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.descMap,depth:e.depth+1,"max-depth":e.maxDepth},on:{"toggle-expanded":e.bubbleEventToggleExapndedEvent,"scroll-to-self":e.bubbleScrollToSelfEvent}}):e._e()})),1):e._e(),e._v(" "),e.expanded&&!e.shared.isMobile||e.isLeaf?e._e():n("PropertiesList",{attrs:{nodeData:e.nodeData,descMap:e.descMap}})],1)};ze._withStripped=!0;var Be=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"properties-list-panel"},[n("h5",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),n("div",{staticClass:"properties-list"},[e._v("\n        {\n        "),e._l(e.displayedProperties,(function(t,r){return n("span",{key:t.path},[e.shared.isMobile?n("span",[n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]):n("el-popover",{attrs:{title:e.getName(t.path),"close-delay":400,"open-delay":200,placement:"top",trigger:"hover"}},[n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"property-popup-desc",domProps:{innerHTML:e._s(e.getDesc(t.path))}}),e._v(" "),n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]),e._v(" "),r<e.displayedProperties.length-1?n("span",[e._v(", ")]):e._e()],1)})),e._v("\n        }\n    ")],2)])};Be._withStripped=!0;var We={props:["nodeData","descMap"],data:function(){return{shared:ke}},computed:{displayedProperties:function(){return this.nodeData.children}},methods:{getDesc:function(e){return this.descMap[e]&&this.descMap[e].desc},getName:function(e){return e.split(".").pop()}}},Ue=(n(32),Pe(We,Be,[],!1,null,null,null));Ue.options.__file="src/components/PropertiesList.vue";var He=Ue.exports,qe=function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"option-control"},[t(this.uiComponent,this._b({tag:"component",attrs:{value:this.defaultValue},on:{change:this.onValueChange}},"component",this.uiAttrs,!1))],1)};qe._withStripped=!0;var Ge=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-color"},[n("el-color-picker",{attrs:{"show-alpha":!0},on:{change:e.onValueChange,"active-change":e.onActiveChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}}),e._v(" "),n("span",{style:{color:e.innerValue||"#aaa"}},[e._v("\n    "+e._s(e.innerValue||e.$t("example.defaultColor"))+"\n")])],1)};Ge._withStripped=!0;var Ke={props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},onActiveChange:function(e){}}},Je=(n(33),Pe(Ke,Ge,[],!1,null,null,null));Je.options.__file="src/controls/ControlColor.vue";var Qe=Je.exports,Xe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-boolean"},[n("el-switch",{attrs:{"active-text":e.$t("example.booleanDesc")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};Xe._withStripped=!0;var Ze=Pe({props:["value"],data:function(){return{innerValue:"true"===this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},Xe,[],!1,null,null,null);Ze.options.__file="src/controls/ControlBoolean.vue";var Ye=Ze.exports,et=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-number"},[n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};et._withStripped=!0;var tt={props:["value","min","max","step"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},nt=(n(34),Pe(tt,et,[],!1,null,null,null));nt.options.__file="src/controls/ControlNumber.vue";var rt=nt.exports,at=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-vector"},[n("el-switch",{attrs:{"active-text":e.$t("example.vectorSetSeparate")},model:{value:e.innerSeparate,callback:function(t){e.innerSeparate=t},expression:"innerSeparate"}}),e._v(" "),e.innerSeparate?n("div",{staticClass:"control-vector-group"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValueArr[r],callback:function(t){e.$set(e.innerValueArr,r,t)},expression:"innerValueArr[index]"}})],1)})),0):n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.innerValueArr[0],callback:function(t){e.$set(e.innerValueArr,0,t)},expression:"innerValueArr[0]"}})],1)};at._withStripped=!0;var it={props:["value","separate","min","max","step","dims"],data:function(){return{innerSeparate:"true"===this.separate,innerValueArr:this.value.split(",").map((function(e){return+e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return+e.trim()}))}},methods:{onValueChange:function(){if(!this.innerSeparate)for(var e=1;e<this.innerValueArr.length;e++)this.innerValueArr[e]=this.innerValueArr[0];this.$emit("change",this.innerValueArr.slice())}}},ot=(n(35),Pe(it,at,[],!1,null,null,null));ot.options.__file="src/controls/ControlVector.vue";var st=ot.exports,lt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-enum"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,class:{"control-enum-special":null!=e.specialValues[t]},attrs:{value:t}},[e._v(e._s(t))])})),1)],1)};lt._withStripped=!0;var ct={true:!0,false:!1},ut={props:["value","options"],computed:{optionsArr:function(){return this.options.split(",").map((function(e){return e.trim()}))},specialValues:function(){return ct}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",ct.hasOwnProperty(this.innerValue)?ct[this.innerValue]:this.innerValue)}}},ht=(n(36),Pe(ut,lt,[],!1,null,null,null));ht.options.__file="src/controls/ControlEnum.vue";var pt=ht.exports,ft=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent"},[n("el-radio-group",{attrs:{size:"mini"},model:{value:e.mode,callback:function(t){e.mode=t},expression:"mode"}},[n("el-radio-button",{attrs:{label:"absolute"}},[e._v(e._s(e.$t("example.absoluteMode")))]),e._v(" "),n("el-radio-button",{attrs:{label:"percent"}},[e._v(e._s(e.$t("example.percentMode")))])],1),e._v(" "),"absolute"===e.mode?n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.absoluteValue,callback:function(t){e.absoluteValue=t},expression:"absoluteValue"}}):n("div",[n("el-slider",{attrs:{min:0,max:100,step:1,"format-tooltip":e.formatTooltip},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}}),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:0,max:100,step:1},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}})],1)],1)};ft._withStripped=!0;var dt={props:["value","min","max","step"],data:function(){var e=this.value.indexOf("%")<0;return{percentValue:e?50:+this.value.replace("%",""),absoluteValue:e?+this.value:0,mode:e?"absolute":"percent"}},watch:{value:function(e){"absolute"===this.mode?this.absoluteValue=+e:this.percentValue=+e.replace("%","")},mode:function(){this.onValueChange()}},methods:{onValueChange:function(){this.$emit("change","absolute"===this.mode?this.absoluteValue:this.percentValue+"%")},formatTooltip:function(e){return e+"%"}}},mt=(n(37),Pe(dt,ft,[],!1,null,null,null));mt.options.__file="src/controls/ControlPercent.vue";var vt=mt.exports,gt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent-vector"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("ControlPercent",{attrs:{value:e.innerValueArr[r],"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:function(t){return e.onValueChange(r,t)}}})],1)})),0)};gt._withStripped=!0;var _t={components:{ControlPercent:vt},props:["value","min","max","step","dims"],data:function(){return{innerValueArr:this.value.split(",").map((function(e){return e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return e.trim()}))}},methods:{onValueChange:function(e,t){this.innerValueArr[e]=t,this.$emit("change",this.innerValueArr.slice())}}},yt=(n(38),Pe(_t,gt,[],!1,null,null,null));yt.options.__file="src/controls/ControlPercentVector.vue";var bt=yt.exports,xt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-text"},[n("el-input",{attrs:{size:"mini",placeholder:e.$t("example.inputPlaceholder")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};xt._withStripped=!0;var Et=Pe({props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},xt,[],!1,null,null,null);Et.options.__file="src/controls/ControlText.vue";var wt=Et.exports,Ct=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-icon"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,attrs:{value:t}},[e._v(e._s(t))])})),1),e._v(" "),n("el-button",{attrs:{size:"mini",type:"primary"},on:{click:e.chooseFile}},[e._v(e._s(e.$t("example.upload")))])],1)};function St(e){return(St="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Ct._withStripped=!0,SVGElement.prototype.getTransformToElement=SVGElement.prototype.getTransformToElement||function(e){return e.getScreenCTM().inverse().multiply(this.getScreenCTM())};var kt=/,?([achlmqrstvxz]),?/gi,Ot=function(e){return e.join(",").replace(kt,"$1")};function Mt(e,t,n,r,a){if(e)if(void 0===r&&(r=!1),void 0===t&&(t=!1),void 0===n&&(n=!1),void 0===a&&(a=!1),e&&e.children&&e.children.length){for(var i=0,o=e.children.length;i<o;i++)Mt(e.children[i],t,n,r,a);e.removeAttribute("transform")}else if(e instanceof SVGCircleElement||e instanceof SVGRectElement||e instanceof SVGEllipseElement||e instanceof SVGLineElement||e instanceof SVGPolygonElement||e instanceof SVGPolylineElement||e instanceof SVGPathElement){var s,l=function(e,t){if(!e)return;for(var n=document.createElementNS(e.ownerSVGElement.namespaceURI,"path"),r=["requiredFeatures","requiredExtensions","systemLanguage","id","xml:base","xml:lang","xml:space","onfocusin","onfocusout","onactivate","onclick","onmousedown","onmouseup","onmouseover","onmousemove","onmouseout","onload","alignment-baseline","baseline-shift","clip","clip-path","clip-rule","color","color-interpolation","color-interpolation-filters","color-profile","color-rendering","cursor","direction","display","dominant-baseline","enable-background","fill","fill-opacity","fill-rule","filter","flood-color","flood-opacity","font-family","font-size","font-size-adjust","font-stretch","font-style","font-variant","font-weight","glyph-orientation-horizontal","glyph-orientation-vertical","image-rendering","kerning","letter-spacing","lighting-color","marker-end","marker-mid","marker-start","mask","opacity","overflow","pointer-events","shape-rendering","stop-color","stop-opacity","stroke","stroke-dasharray","stroke-dashoffset","stroke-linecap","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke-width","text-anchor","text-decoration","text-rendering","unicode-bidi","visibility","word-spacing","writing-mode","class","style","externalResourcesRequired","transform","d","pathLength"],a=0,i=r.length;a<i;a++){var o,s=r[a];(o=e.getAttribute(s))&&n.setAttribute(s,o)}var l="",c=function(e){return!("number"!=typeof e||e==1/0||e<0)},u=1.81,h=e.tagName;switch(h){case"ellipse":case"circle":var p=+e.getAttribute("rx"),f=+e.getAttribute("ry"),d=+e.getAttribute("cx"),m=+e.getAttribute("cy");"circle"==h&&(p=f=+e.getAttribute("r")),l+=Ot([["M",d-p,m],["C",d-p,m-f/u,d-p/u,m-f,d,m-f],["C",d+p/u,m-f,d+p,m-f/u,d+p,m],["C",d+p,m+f/u,d+p/u,m+f,d,m+f],["C",d-p/u,m+f,d-p,m+f/u,d-p,m],["Z"]]);break;case"path":l=e.getAttribute("d");break;case"line":var v=e.getAttribute("x1"),g=e.getAttribute("y1");x2=e.getAttribute("x2"),y2=e.getAttribute("y2"),l="M"+v+","+g+"L"+x2+","+y2;break;case"polyline":l="M"+e.getAttribute("points");break;case"polygon":l="M"+e.getAttribute("points")+"Z";break;case"rect":p=+e.getAttribute("rx"),f=+e.getAttribute("ry");var _=e.getBBox(),y=_.x,b=_.y,x=_.width,E=_.height;if(c(p)||c(f)?c(p)&&!c(f)?f=p:c(f)&&!c(p)?p=f:(p>x/2&&(p=x/2),f>E/2&&(f=E/2)):p=f=0,p||f)if(t)l+=Ot([["M",y+p,b],["H",y+x-p],["A",p,f,0,0,1,y+x,b+f],["V",b+E-f],["A",p,f,0,0,1,y+x-p,b+E],["H",y+p],["A",p,f,0,0,1,y,b+E-f],["V",b+f],["A",p,f,0,0,1,y+p,b]]);else{f||(f=p),l+=Ot([["M",y,b+f],["C",y,b+f/(u=2.19),y+p/u,b,y+p,b],["L",y+x-p,b],["C",y+x-p/u,b,y+x,b+f/u,y+x,b+f],["L",y+x,b+E-f],["C",y+x,b+E-f/u,y+x-p/u,b+E,y+x-p,b+E],["L",y+p,b+E],["C",y+p/u,b+E,y,b+E-f/u,y,b+E-f],["L",y,b+f],["Z"]])}else l+=Ot([["M",y,b],["L",y+x,b],["L",y+x,b+E],["L",y,b+E],["L",y,b],["Z"]])}l&&n.setAttribute("d",l);return e.parentNode.replaceChild(n,e),n}(e,r);if(!l||""==l.getAttribute(u))return"M 0 0";a||0===a?a>15?a=15:a<0&&(a=0):a=!1;var c=l,u=c.getAttribute("d").trim();if(t)h=s=Yt(u);else{var h=s=Gt(u);s=Kt(s)}var p,f,d=c.ownerSVGElement,m=c.getTransformToElement(d),v=(i=0,s.length),g="",_="",y=0,b=0,x=[],E=d.createSVGPoint(),w={},C=0,S=0;for(w.x=null,w.y=null;i<v;i++){if(g=s[i][0].toUpperCase(),_=h[i][0],x[i]=[],x[i][0]=s[i][0],"A"==g)y=s[i][6],b=s[i][7],E.x=s[i][6],E.y=s[i][7],x[i]=Nt(s[i][1],s[i][2],s[i][3],s[i][4],s[i][5],E,m),x[i][1]=x[i][1],x[i][2]=x[i][2],x[i][3]=x[i][3],x[i][6]=x[i][6],x[i][7]=x[i][7];else if("Z"!=g)for(p=1;p<s[i].length;p+=2)"V"==g?b=s[i][p]:"H"==g?y=s[i][p]:(y=s[i][p],b=s[i][p+1]),E.x=y,E.y=b,f=E.matrixTransform(m),"V"==g||"H"==g?(x[i][0]="L",x[i][p]=f.x,x[i][p+1]=f.y):(x[i][p]=f.x,x[i][p+1]=f.y);("Z"!=g&&null===w.x||"M"==g)&&(w.x=y,w.y=b),"Z"==g&&(y=w.x,b=w.y)}var k=0,O=0;for(w.x="",i=0;i<x.length;i++){if("A"==(_=h[i][0])||"M"==_||"L"==_||"C"==_||"S"==_||"Q"==_||"T"==_||"H"==_||"V"==_){var M=N=x[i].length;if("A"==_)x[i][6]=T(x[i][6]),x[i][7]=T(x[i][7]);else for(M--;--M;)x[i][M]=T(x[i][M]);C=x[i][N-2],S=x[i][N-1]}else if("a"==_)k=x[i][6],O=x[i][7],x[i][0]=_,x[i][6]=T(x[i][6]-C),x[i][7]=T(x[i][7]-S),C=k,S=O;else if("m"==_||"l"==_||"c"==_||"s"==_||"q"==_||"t"==_||"h"==_||"v"==_){var N=x[i].length;for(k=x[i][N-2],O=x[i][N-1],p=1;p<N;p+=2)x[i][0]="h"==_||"v"==_?"l":_,x[i][p]=T(x[i][p]-C),x[i][p+1]=T(x[i][p+1]-S);C=k,S=O}("z"!=_.toLowerCase()&&""==w.x||"m"==_.toLowerCase())&&(w.x=C,w.y=S),"z"==_.toLowerCase()&&(C=w.x,S=w.y)}n&&(x=Kt(x)),l.setAttribute("d",Ot(x)),l.removeAttribute("transform")}function T(e){return!1!==a?Math.round(e*Math.pow(10,a))/Math.pow(10,a):e}}function Nt(e,t,n,r,a,i,o,s){function l(e){return Math.abs(e)<1e-16}var c,u,h,p,f,d,m,v,g,_,y,b=[];if(c=e,u=t,h=n*=Math.PI/180,p=parseFloat(Math.sin(h)),f=parseFloat(Math.cos(h)),b[0]=o.a*+c*f+o.c*c*p,b[1]=o.b*+c*f+o.d*c*p,b[2]=o.a*-u*p+o.c*u*f,b[3]=o.b*-u*p+o.d*u*f,g=(d=b[0]*b[0]+b[2]*b[2])-(v=b[1]*b[1]+b[3]*b[3]),l(m=2*(b[0]*b[1]+b[2]*b[3])))n=0,_=d,y=v;else if(l(g))_=d+.5*m,y=d-.5*m,n=Math.PI/4;else{var x=1+m*m/(g*g);_=.5*(d+v+(x=x<0?0:Math.sqrt(x))*g),y=.5*(d+v-x*g),n=.5*Math.atan2(m,g)}return _=_<0?0:Math.sqrt(_),y=y<0?0:Math.sqrt(y),g<=0?(t=_,e=y):(t=y,e=_),o.a*o.d-o.b*o.c<0&&(a=a?0:1),i=i.matrixTransform(o),["A",e,t,n=180*n/Math.PI,r,a,i.x,i.y]}var Tt={},It="hasOwnProperty",Rt=String,At={NaN:1,Infinity:1,"-Infinity":1},Lt=Rt.prototype.toLowerCase,Dt=Rt.prototype.toUpperCase,$t=Object.prototype.toString,Pt="concat",Vt=Math,jt=Vt.max,Ft=(Vt.min,Vt.abs,Vt.pow,Vt.PI),zt=(Vt.round,parseFloat),Bt=(parseInt,kt=/,?([achlmqrstvxz]),?/gi,/([achlmrqstvz])[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*)+)/gi),Wt=/(-?\d*\.?\d*(?:e[\-+]?\d+)?)[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*/gi;Tt.is=function(e,t){return"finite"==(t=Lt.call(t))?!At[It](+e):"array"==t?e instanceof Array:"null"==t&&null===e||t==St(e)&&null!==e||"object"==t&&e===Object(e)||"array"==t&&Array.isArray&&Array.isArray(e)||$t.call(e).slice(8,-1).toLowerCase()==t},Tt._path2string=function(){return this.join(",").replace(kt,"$1")};var Ut=function(e){var t=function e(t){if(Object(t)!==t)return t;var n=new t.constructor;for(var r in t)t[It](r)&&(n[r]=e(t[r]));return n}(e);return t.toString=Tt._path2string,t},Ht=function e(t){var n=e.ps=e.ps||{};return n[t]?n[t].sleep=100:n[t]={sleep:100},setTimeout((function(){for(var e in n)n[It](e)&&e!=t&&(n[e].sleep--,!n[e].sleep&&delete n[e])})),n[t]};function qt(e,t){for(var n=[],r=0,a=e.length;a-2*!t>r;r+=2){var i=[{x:+e[r-2],y:+e[r-1]},{x:+e[r],y:+e[r+1]},{x:+e[r+2],y:+e[r+3]},{x:+e[r+4],y:+e[r+5]}];t?r?a-4==r?i[3]={x:+e[0],y:+e[1]}:a-2==r&&(i[2]={x:+e[0],y:+e[1]},i[3]={x:+e[2],y:+e[3]}):i[0]={x:+e[a-2],y:+e[a-1]}:a-4==r?i[3]=i[2]:r||(i[0]={x:+e[r],y:+e[r+1]}),n.push(["C",(-i[0].x+6*i[1].x+i[2].x)/6,(-i[0].y+6*i[1].y+i[2].y)/6,(i[1].x+6*i[2].x-i[3].x)/6,(i[1].y+6*i[2].y-i[3].y)/6,i[2].x,i[2].y])}return n}var Gt=function(e){if(!e)return null;var t=Ht(e);if(t.arr)return Ut(t.arr);var n={a:7,c:6,h:1,l:2,m:2,r:4,q:4,s:4,t:2,v:1,z:0},r=[];return Tt.is(e,"array")&&Tt.is(e[0],"array")&&(r=Ut(e)),r.length||Rt(e).replace(Bt,(function(e,t,a){var i=[],o=t.toLowerCase();if(a.replace(Wt,(function(e,t){t&&i.push(+t)})),"m"==o&&i.length>2&&(r.push([t][Pt](i.splice(0,2))),o="l",t="m"==t?"l":"L"),"r"==o)r.push([t][Pt](i));else for(;i.length>=n[o]&&(r.push([t][Pt](i.splice(0,n[o]))),n[o]););})),r.toString=Tt._path2string,t.arr=Ut(r),r};var Kt=Jt((function(e){if(Tt.is(e,"array")&&Tt.is(e&&e[0],"array")||(e=Gt(e)),!e||!e.length)return[["M",0,0]];var t=[],n=0,r=0,a=0,i=0,o=0;"M"==e[0][0]&&(a=n=+e[0][1],i=r=+e[0][2],o++,t[0]=["M",n,r]);for(var s,l,c=3==e.length&&"M"==e[0][0]&&"R"==e[1][0].toUpperCase()&&"Z"==e[2][0].toUpperCase(),u=o,h=e.length;u<h;u++){if(t.push(s=[]),(l=e[u])[0]!=Dt.call(l[0]))switch(s[0]=Dt.call(l[0]),s[0]){case"A":s[1]=l[1],s[2]=l[2],s[3]=l[3],s[4]=l[4],s[5]=l[5],s[6]=+(l[6]+n),s[7]=+(l[7]+r);break;case"V":s[1]=+l[1]+r;break;case"H":s[1]=+l[1]+n;break;case"R":for(var p=[n,r][Pt](l.slice(1)),f=2,d=p.length;f<d;f++)p[f]=+p[f]+n,p[++f]=+p[f]+r;t.pop(),t=t[Pt](qt(p,c));break;case"M":a=+l[1]+n,i=+l[2]+r;default:for(f=1,d=l.length;f<d;f++)s[f]=+l[f]+(f%2?n:r)}else if("R"==l[0])p=[n,r][Pt](l.slice(1)),t.pop(),t=t[Pt](qt(p,c)),s=["R"][Pt](l.slice(-2));else for(var m=0,v=l.length;m<v;m++)s[m]=l[m];switch(s[0]){case"Z":n=a,r=i;break;case"H":n=s[1];break;case"V":r=s[1];break;case"M":a=s[s.length-2],i=s[s.length-1];default:n=s[s.length-2],r=s[s.length-1]}}return t.toString=Tt._path2string,t}));function Jt(e,t,n){return function r(){var a=Array.prototype.slice.call(arguments,0),i=a.join("␀"),o=r.cache=r.cache||{},s=r.count=r.count||[];if(o.hasOwnProperty(i)){for(var l=0,c=s.length;l<c;l++)s[l]===i&&s.push(s.splice(l,1)[0]);return n?n(o[i]):o[i]}return s.length>=1e3&&delete o[s.shift()],s.push(i),o[i]=e.apply(t,a),n?n(o[i]):o[i]}}var Qt=function(e,t,n,r){return[e,t,n,r,n,r]},Xt=function(e,t,n,r,a,i){return[1/3*e+2/3*n,1/3*t+2/3*r,1/3*a+2/3*n,1/3*i+2/3*r,a,i]},Zt=Jt((function(e,t,n,r,a,i,o,s,l,c){var u,h=120*Ft/180,p=Ft/180*(+a||0),f=[],d=Jt((function(e,t,n){return{x:e*Math.cos(n)-t*Math.sin(n),y:e*Math.sin(n)+t*Math.cos(n)}}));if(c)w=c[0],C=c[1],x=c[2],E=c[3];else{e=(u=d(e,t,-p)).x,t=u.y,s=(u=d(s,l,-p)).x,l=u.y;Math.cos(Ft/180*a),Math.sin(Ft/180*a);var m=(e-s)/2,v=(t-l)/2,g=m*m/(n*n)+v*v/(r*r);g>1&&(n*=g=Math.sqrt(g),r*=g);var _=n*n,y=r*r,b=(i==o?-1:1)*Math.sqrt(Math.abs((_*y-_*v*v-y*m*m)/(_*v*v+y*m*m))),x=b*n*v/r+(e+s)/2,E=b*-r*m/n+(t+l)/2,w=Math.asin(((t-E)/r).toFixed(9)),C=Math.asin(((l-E)/r).toFixed(9));(w=e<x?Ft-w:w)<0&&(w=2*Ft+w),(C=s<x?Ft-C:C)<0&&(C=2*Ft+C),o&&w>C&&(w-=2*Ft),!o&&C>w&&(C-=2*Ft)}var S=C-w;if(Math.abs(S)>h){var k=C,O=s,M=l;C=w+h*(o&&C>w?1:-1),s=x+n*Math.cos(C),l=E+r*Math.sin(C),f=Zt(s,l,n,r,a,0,o,O,M,[C,k,x,E])}S=C-w;var N=Math.cos(w),T=Math.sin(w),I=Math.cos(C),R=Math.sin(C),A=Math.tan(S/4),L=4/3*n*A,D=4/3*r*A,$=[e,t],P=[e+L*T,t-D*N],V=[s+L*R,l-D*I],j=[s,l];if(P[0]=2*$[0]-P[0],P[1]=2*$[1]-P[1],c)return[P,V,j].concat(f);for(var F=[],z=0,B=(f=[P,V,j].concat(f).join().split(",")).length;z<B;z++)F[z]=z%2?d(f[z-1],f[z],p).y:d(f[z],f[z+1],p).x;return F})),Yt=Jt((function(e,t){var n=!t&&Ht(e);if(!t&&n.curve)return Ut(n.curve);for(var r=Kt(e),a=t&&Kt(t),i={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},o={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},s=function(e,t,n){var r,a;if(!e)return["C",t.x,t.y,t.x,t.y,t.x,t.y];switch(!(e[0]in{T:1,Q:1})&&(t.qx=t.qy=null),e[0]){case"M":t.X=e[1],t.Y=e[2];break;case"A":e=["C"][Pt](Zt.apply(0,[t.x,t.y][Pt](e.slice(1))));break;case"S":"C"==n||"S"==n?(r=2*t.x-t.bx,a=2*t.y-t.by):(r=t.x,a=t.y),e=["C",r,a][Pt](e.slice(1));break;case"T":"Q"==n||"T"==n?(t.qx=2*t.x-t.qx,t.qy=2*t.y-t.qy):(t.qx=t.x,t.qy=t.y),e=["C"][Pt](Xt(t.x,t.y,t.qx,t.qy,e[1],e[2]));break;case"Q":t.qx=e[1],t.qy=e[2],e=["C"][Pt](Xt(t.x,t.y,e[1],e[2],e[3],e[4]));break;case"L":e=["C"][Pt](Qt(t.x,t.y,e[1],e[2]));break;case"H":e=["C"][Pt](Qt(t.x,t.y,e[1],t.y));break;case"V":e=["C"][Pt](Qt(t.x,t.y,t.x,e[1]));break;case"Z":e=["C"][Pt](Qt(t.x,t.y,t.X,t.Y))}return e},l=function(e,t){if(e[t].length>7){e[t].shift();for(var n=e[t];n.length;)u[t]="A",a&&(h[t]="A"),e.splice(t++,0,["C"][Pt](n.splice(0,6)));e.splice(t,1),m=jt(r.length,a&&a.length||0)}},c=function(e,t,n,i,o){e&&t&&"M"==e[o][0]&&"M"!=t[o][0]&&(t.splice(o,0,["M",i.x,i.y]),n.bx=0,n.by=0,n.x=e[o][1],n.y=e[o][2],m=jt(r.length,a&&a.length||0))},u=[],h=[],p="",f="",d=0,m=jt(r.length,a&&a.length||0);d<m;d++){r[d]&&(p=r[d][0]),"C"!=p&&(u[d]=p,d&&(f=u[d-1])),r[d]=s(r[d],i,f),"A"!=u[d]&&"C"==p&&(u[d]="C"),l(r,d),a&&(a[d]&&(p=a[d][0]),"C"!=p&&(h[d]=p,d&&(f=h[d-1])),a[d]=s(a[d],o,f),"A"!=h[d]&&"C"==p&&(h[d]="C"),l(a,d)),c(r,a,i,o,d),c(a,r,o,i,d);var v=r[d],g=a&&a[d],_=v.length,y=a&&g.length;i.x=v[_-2],i.y=v[_-1],i.bx=zt(v[_-4])||i.x,i.by=zt(v[_-3])||i.y,o.bx=a&&(zt(g[y-4])||o.x),o.by=a&&(zt(g[y-3])||o.y),o.x=a&&g[y-2],o.y=a&&g[y-1]}return a||(n.curve=Ut(r)),a?[r,a]:r}),null,Ut);var en=Pe({props:["value"],computed:{optionsArr:function(){return["circle","rect","roundRect","triangle","diamond","pin","arrow","none"]}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},chooseFile:function(){var e=this,t=document.createElement("input");t.type="file",t.accept=".jpg, .jpeg, .png, .svg",t.addEventListener("change",(function(t){var n=t.target.files[0];if(n)if(n.name.endsWith(".svg")){var r=new FileReader;r.addEventListener("load",(function(){var t=function(e){var t=(new DOMParser).parseFromString(e,"text/xml");for(9===t.nodeType&&(t=t.firstChild);"svg"!==t.nodeName.toLowerCase()||1!==t.nodeType;)t=t.nextSibling;return t}(r.result);try{Mt(t)}catch(e){console.error("Unexpected error happens when handling the SVG."),console.error(e.toString())}for(var n=t.querySelectorAll("path"),a=[],i=0;i<n.length;i++)a.push(n[i].getAttribute("d"));e.$emit("change","path://"+a.join(" "))})),r.readAsText(n)}else{var a=new FileReader;a.addEventListener("load",(function(){e.$emit("change","image://"+a.result)})),a.readAsDataURL(n)}})),t.click()}}},Ct,[],!1,null,null,null);en.options.__file="src/controls/ControlIcon.vue";var tn={boolean:Ye,color:Qe,number:rt,vector:st,enum:pt,angle:rt,percent:vt,percentvector:bt,text:wt,icon:en.exports},nn={boolean:function(){return!1},color:function(){return null},number:function(){return 0},angle:function(){return 0},percent:function(){return"50"},enum:function(e){return e.options.split(",")[0].trim()},vector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return 0})).join(",")},percentvector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return"50%"})).join(",")}};var rn={name:"OptionControl",props:["controlConfig","optionPath"],data:function(){return{shared:ke}},computed:{uiComponent:function(){return tn[this.controlConfig.type]},uiAttrs:function(){return function(e){var t={};for(var n in e)e.hasOwnProperty(n)&&"type"!==n&&"default"!==n&&(t[n]=e[n]);return t}(this.controlConfig)},defaultValue:function(){var e=this.controlConfig;return null!=e.default?e.default:nn[e.type]&&nn[e.type](e)}},methods:{onValueChange:function(e){this.shared.cleanMode=this.controlConfig.clean,this.shared.currentExampleOption&&(this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.optionPath,e)))}}},an=(n(39),Pe(rn,qe,[],!1,null,null,null));an.options.__file="src/components/OptionControl.vue";var on={name:"DocContentItemCard",props:["nodeData","descMap","maxDepth","depth"],components:{PropertiesList:He,OptionControl:an.exports},data:function(){return{manualExpanded:null,enableUIControl:!1,shared:ke}},watch:{enableUIControl:function(e){e?(this.shared.showOptionExample||this.$emit("scroll-to-self",this.nodeData.path,300,100),this.shared.showOptionExample=!0):this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.nodeData.path,void 0))},"shared.currentExampleName":function(e,t){e&&t&&(this.enableUIControl=!1)}},computed:{itemId:function(){return fe(this.nodeData.path)},expanded:function(){return!this.isLeaf&&(null!=this.manualExpanded?this.manualExpanded:this.depth<2||ke.currentPath.indexOf(this.nodeData.path)>=0)},isLeaf:function(){return!(this.nodeData.children&&this.nodeData.children.length)},supportsExpandable:function(){return this.depth+1<=this.maxDepth&&!this.isLeaf},desc:function(){var e=this.descMap[this.nodeData.path];return e&&e.desc},uiControl:function(){var e=this.descMap[this.nodeData.path];return e&&e.uiControl},parentPath:function(){for(var e=this.nodeData.path.split("."),t=[],n="",r=0;r<e.length-1;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r],link:n});return t},baseName:function(){return{text:this.nodeData.path.split(".").pop(),link:this.nodeData.path}}},methods:{bubbleEventToggleExapndedEvent:function(){this.$emit("toggle-expanded")},toggleExpanded:function(){this.manualExpanded=!this.expanded,this.$emit("toggle-expanded")},toggleUIControl:function(){this.enableUIControl=!this.enableUIControl},bubbleScrollToSelfEvent:function(e,t,n){this.$emit("scroll-to-self",e,t,n)}}},sn=(n(40),Pe(on,ze,[],!1,null,null,null));sn.options.__file="src/components/DocContentItemCard.vue";var ln=sn.exports,cn=n(24),un=n.n(cn),hn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.shared.computedOptionExampleLayout+"-layout",attrs:{id:"example-panel"}},[n("h2",[e._v(e._s(e.$t("example.title")))]),e._v(" "),n("p",{staticClass:"intro"},[e._v(e._s(e.shared.allOptionExamples?e.$t("example.intro"):e.$t("example.noExample")))]),e._v(" "),e.shared.currentExampleOption?n("div",{staticClass:"preview-and-code"},[n("div",{staticClass:"preview-main"}),e._v(" "),e._m(0),e._v(" "),e.hasError?n("el-alert",{attrs:{title:e.$t("example.setOptionError"),type:"error"}}):e._e()],1):e._e(),e._v(" "),n("div",{staticClass:"toolbar"},[e.shared.allOptionExamples?n("el-select",{staticClass:"example-list",attrs:{size:"mini","popper-append-to-body":!1},model:{value:e.shared.currentExampleName,callback:function(t){e.$set(e.shared,"currentExampleName",t)},expression:"shared.currentExampleName"}},e._l(e.shared.allOptionExamples,(function(t){return n("el-option",{key:t.name,attrs:{value:t.name,label:"en"===e.shared.locale?t["title-en"]:t.title}})})),1):e._e(),e._v(" "),e.shared.currentExampleOption?n("el-button",{attrs:{type:"primary",icon:"el-icon-refresh",size:"mini",title:e.$t("example.refresh")},on:{click:e.refreshForce}}):e._e(),e._v(" "),n("el-button",{directives:[{name:"popover",rawName:"v-popover:changeLayoutPopover",arg:"changeLayoutPopover"}],staticStyle:{"margin-left":"0"},attrs:{type:"primary",icon:"el-icon-s-operation",size:"mini",title:e.$t("example.changeLayout")}}),e._v(" "),n("el-button",{attrs:{size:"mini",circle:"",icon:"el-icon-close"},on:{click:e.closeExamplePanel}})],1),e._v(" "),n("el-popover",{ref:"changeLayoutPopover",attrs:{placement:"bottom",trigger:"click"},model:{value:e.showChangeLayoutPopover,callback:function(t){e.showChangeLayoutPopover=t},expression:"showChangeLayoutPopover"}},[n("div",{staticClass:"example-change-layout"},[n("div",{staticClass:"layout-title"},[n("i",{staticClass:"el-icon-s-operation"}),e._v(e._s(e.$t("example.changeLayout")))]),e._v(" "),n("div",{staticClass:"layout-mode"},[n("el-radio-group",{attrs:{size:"mini"},on:{change:e.changeLayout},model:{value:e.shared.optionExampleLayout,callback:function(t){e.$set(e.shared,"optionExampleLayout",t)},expression:"shared.optionExampleLayout"}},e._l(e.optionExampleLayouts,(function(t){return n("el-radio-button",{key:t,attrs:{label:t}},[e._v(e._s(e.$t("example.layout."+t)))])})),1)],1)])])],1)};hn._withStripped=!0;var pn=n(25),fn=n.n(pn),dn=(n(41),n(42),n(26)),mn=n.n(dn),vn=n(19),gn=n.n(vn);function _n(e,t){return e===t}function yn(e,t,n,r){e.push(function(e,t,n){var r={cmd:e,idx:t};return"="===e&&(r.idx1=n),r}(t,n,r))}var bn=Math.abs;function xn(e,t,n,r,a,i,o,s){var l,c,u,h=n>r,p=a>i,f=bn(r-n),d=bn(i-a);for(c=0;c<=f;c++)for(u=0;u<=d;u++)if(0===c)s[u]=u;else if(0===u)l=s[u],s[u]=c;else{var m=l+(o(e[h?n-c:c-1+n],t[p?a-u:u-1+a])?0:2),v=s[u]+1,g=s[u-1]+1;l=s[u],s[u]=m<v?m:v,g<s[u]&&(s[u]=g)}return s}var En,wn=function(e,t,n){var r,a;n=n||_n;var i=e.length,o=t.length,s=Math.min(i,o),l=[];for(r=0;r<s&&n(e[r],t[r]);r++)yn(l,"=",r,r);for(a=0;a<s&&n(e[i-a-1],t[o-a-1]);a++);if(i-a>=r||o-a>=r){var c=function e(t,n,r,a,i,o,s,l,c){var u,h,p=[],f=a-r,d=o-i;if(f)if(d)if(1===f){var m=t[r],v=!1;for(h=0;h<d;h++)s(m,n[h+i])&&!v?(v=!0,yn(p,"=",r,h+i)):yn(p,"+",h+i);v||yn(p,"-",r)}else if(1===d){var g=n[i];v=!1;for(u=0;u<f;u++)s(g,t[u+r])&&!v?(v=!0,yn(p,"=",u+r,i)):yn(p,"-",u+r);v||yn(p,"+",i)}else{var _=(f/2|0)+r;xn(t,n,r,_,i,o,s,l),xn(t,n,a,_+1,o,i,s,c);var y,b=1/0,x=0;for(h=0;h<=d;h++)(y=l[h]+c[d-h])<b&&(b=y,x=h);p=e(t,n,r,_,i,x+=i,s,l,c);var E=e(t,n,_,a,x,o,s,l,c);for(u=0;u<E.length;u++)p.push(E[u])}else for(u=0;u<f;u++)yn(p,"-",u+r);else for(h=0;h<d;h++)yn(p,"+",h+i);return p}(e,t,r,i-a,r,o-a,n,[],[]);for(r=0;r<c.length;r++)l.push(c[r]);for(r=0;r<a;r++)yn(l,"=",i-a+r,o-a+r)}return l};function Cn(e,t){var n=this;if(this.shared.currentExampleName!==this.lastUpdateExampleName)return this.lastUpdateExampleName=this.shared.currentExampleName,void this.refreshForce();var r=this.$el.querySelector(".preview-main");if(r){if(this.hasError=!1,"undefined"==typeof echarts)(En||(En=new Promise((function(e){var t=document.createElement("script");t.src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js",t.async=!0,t.onload=function(){e(),En=null},document.body.appendChild(t)})))).then((function(){n.echartsInstance||(n.chartInstance=echarts.init(r)),n.shared.cleanMode&&n.chartInstance.clear(),n.chartInstance.setOption(e,!0)}));else{this.echartsInstance||(this.chartInstance=echarts.init(r));try{this.shared.cleanMode&&this.chartInstance.clear(),this.chartInstance.setOption(e,!0)}catch(e){console.error(e),this.hasError=!0}}if(this.cmInstance){var a=this.cmInstance.getValue(),i=this.formattedOptionCodeStr;this.oldHighlightedLines&&this.oldHighlightedLines.forEach((function(e){n.cmInstance.removeLineClass(e,"wrap","option-changed")})),t?(this.cmInstance.setValue(i),this.oldHighlightedLines=[]):this.oldHighlightedLines=function(e,t,n){for(var r=e.split(/\n/),a=t.split(/\n/),i=wn(r,a),o=[],s=i.length,l=s-1;l>=0;l--){var c=i[l];"-"===c.cmd&&n.replaceRange("",{line:c.idx,ch:0},{line:c.idx+1,ch:0})}for(var u=0;u<s;u++){var h=i[u];"+"===h.cmd&&(n.replaceRange(a[h.idx]+"\n",{line:h.idx,ch:0}),o.push(h.idx))}return o.forEach((function(e){n.addLineClass(e,"wrap","option-changed")})),s&&setTimeout((function(){n.scrollIntoView({line:o[0],ch:0},n.getWrapperElement().clientHeight-50)}),20),o}(a,i,this.cmInstance)}else this.cmInstance=fn()(this.$el.querySelector(".codemirror-main"),{value:this.formattedOptionCodeStr,mode:"javascript",theme:"dracula",readOnly:!0});this.lastUpdateExampleName=this.shared.currentExampleName}}var Sn={data:function(){return{shared:ke,hasError:!1,lastUpdateExampleName:"",oldHighlightedLines:[],showChangeLayoutPopover:!1,optionExampleLayouts:xe}},mounted:function(){this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize(),this.shared.currentExampleOption&&this.updateOptionThrottled(this.shared.currentExampleOption),this.shared.allOptionExamples?this.shared.currentExampleName=this.shared.allOptionExamples[0].name:this.shared.currentExampleName=""},destroyed:function(){this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),window.removeEventListener("resize",this.resize)},watch:{"shared.currentExampleOption":function(e){e&&this.updateOptionThrottled(e)},"shared.allOptionExamples":function(e){this.shared.currentExampleName=e?e[0].name:""},"shared.currentExampleName":function(e){this.changeExample(e)}},methods:{updateOption:Cn,updateOptionThrottled:gn()(Cn,300,{leading:!1}),resize:function(){var e=this.$el;e.querySelector(".preview-main");"right"!==this.shared.computedOptionExampleLayout?(e.style.height=.5*window.innerHeight-60+"px",e.style.width="auto"):(e.style.width=.45*e.parentNode.clientWidth+"px",e.style.height="auto"),this.chartInstance&&this.chartInstance.resize()},refreshForce:function(){this.shared.currentExampleOption&&(this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),this.updateOption(this.shared.currentExampleOption,!0))},closeExamplePanel:function(){this.shared.showOptionExample=!1},changeExample:function(e){var t=this.shared.allOptionExamples&&this.shared.allOptionExamples.find((function(t){return t.name===e}));if(!t)return this.shared.currentExampleOption=null,!1;var n=t.code;try{var r=new Function(n+"\n return option");this.shared.currentExampleOption=Object.freeze(r())}catch(e){console.error(e),console.log(n)}},changeLayout:function(e){var t=this;this.showChangeLayoutPopover=!1,Ee(e),this.$nextTick((function(){t.resize()}))}},computed:{optionCodeStr:function(){var e=JSON.stringify(this.shared.currentExampleOption,(function(e,t){return"function"==typeof t?"__functionstart__"+t.toString().replace(/\n/g,"__newline__")+"__functionend__":t}));return"option = ".concat(e)},formattedOptionCodeStr:function(){return mn.a.js(this.optionCodeStr.replace(/"(\w+)"\s*:/g,"$1:").replace(/"__functionstart__/g,"").replace(/__functionend__"/g,"").replace(/__newline__/g,"\n"),{indent_size:2})}}},kn=(n(43),Pe(Sn,hn,[function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"example-code"},[t("div",{staticClass:"codemirror-main"})])}],!1,null,null,null));kn.options.__file="src/components/LiveExample.vue";var On=kn.exports,Mn={components:{DocContentItemCard:ln,LiveExample:On},data:function(){return{loading:!1,pagePath:"",shared:ke,maxDepth:1/0,rootPageDescMap:{},pageOutline:{},pageDescMap:{}}},computed:{pageTitle:function(){return this.pagePath},pageId:function(){return fe(this.pagePath)},pageDesc:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.desc},pageExamples:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.exampleBaseOptions||[]},pageDisplayOutline:function(){return this.shared.isMobile?_e(Oe()):this.pageOutline},showLiveExample:function(){return!this.shared.isMobile&&Me()},needScrollOffset:function(){return this.shared.showOptionExample&&!this.shared.isMobile&&"top"===this.shared.computedOptionExampleLayout}},created:function(){var e=this;ge("").then((function(t){e.rootPageDescMap=Object.freeze(t)})),this._lazyload=new un.a({elements_selector:"iframe",load_delay:300}),this.updateCurrentPath(this.shared.currentPath,!0),this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize()},destroyed:function(){window.removeEventListener("resize",this.resize)},methods:{resize:function(){var e=this;"auto"===this.shared.optionExampleLayout&&Ee("auto"),a.a.nextTick((function(){e.updateDocContentMargin()}))},updateLazyload:function(){var e=this;a.a.nextTick((function(){e._lazyload.update()}))},handleCardExpandToggle:function(){this.updateLazyload()},scrollTo:function(e,t,n){var r=this;setTimeout((function(){var n=ke.isMobile?100:20;r.needScrollOffset&&(n+=r.$refs.liveExample.$el.offsetHeight),Le()(document.getElementById(fe(e)),{time:t||400,align:{top:0,topOffset:n}})}),n||0)},updateCurrentPath:function(e,t){var n=this;if(e)if(_e(e)){var r,a,i=Oe();if(i!==this.pagePath)this.loading=!0,this.pagePath=i,(r=e,a=r.split(".")[0],de().then((function(){return se[a]||de()}))).then((function(r){return r.isRoot?n.maxDepth=0:n.shared.isMobile?n.maxDepth=1:n.maxDepth=1/0,ge(e).then((function(a){n.pageOutline=Object.freeze(Object.assign({},r));var i={},o=e.split(".")[0];for(var s in a)i[o+"."+s]=a[s];n.pageDescMap=Object.freeze(i),n.loading=!1,n.scrollTo(e,600,t?300:50),n.updateLazyload()}))})).catch((function(e){n.pageOutline={},n.loading=!1}));else this.scrollTo(e)}else Re(ye(e));else Re(ye())},openOptionExample:function(){this.shared.showOptionExample=!0},updateDocContentMargin:function(e){if((this.$refs.liveExample||e)&&(this.$refs.docContentDom.style.margin="",!e)){var t=this.shared.computedOptionExampleLayout;if("right"!==t){var n="margin"+t[0].toUpperCase()+t.slice(1),r=this.$refs.liveExample.$el.clientHeight;this.$refs.docContentDom.style[n]=r+"px"}}}},watch:{"shared.currentPath":function(e){var t=this;this.updateCurrentPath(e),a.a.nextTick((function(){t.updateDocContentMargin()}))},pageExamples:function(e){e&&e.length?this.shared.allOptionExamples=Object.freeze(e):this.shared.allOptionExamples=null},"shared.computedOptionExampleLayout":function(){var e=this;a.a.nextTick((function(){e.updateDocContentMargin()}))},"shared.showOptionExample":function(e){var t=this;a.a.nextTick((function(){t.updateDocContentMargin(!e)}))}}},Nn=(n(44),Pe(Mn,Fe,[],!1,null,null,null));Nn.options.__file="src/components/DocContent.vue";var Tn=Nn.exports,In=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search"},[n("el-autocomplete",{staticClass:"search-input",attrs:{"popper-class":"search-input-popper",size:"small","fetch-suggestions":e.searchOptions,debounce:200,placeholder:e.$t("search.placeholder")},on:{select:e.selectPath},nativeOn:{keyup:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.fuzzySearch(t)}},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.item;return[n("div",{staticClass:"doc-path-suggestion-item"},[e._v(e._s(r.path))])]}}]),model:{value:e.queryString,callback:function(t){e.queryString=t},expression:"queryString"}},[e._v(" "),n("el-button",{attrs:{slot:"append",icon:"el-icon-search",type:"primary"},on:{click:e.fuzzySearch},slot:"append"})],1)],1)};In._withStripped=!0;var Rn={data:function(){return{queryString:ke.searchQuery,shared:ke}},computed:{},methods:{searchOptions:function(e,t){e?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:50;return de().then((function(){for(var n=[],r=0;r<he.length;r++){if(n.length>=t)return n;var a=he[r];a.indexOf(e)>=0&&n.push(_e(a))}if(n.length<t){le||(le=new Uint8Array(he.length));for(var i=0,o=0;o<he.length;o++)le[o]=255*Object(ae.stringSimilarity)(he[o],e),le[o]>50&&i++;for(var s={},l=0;n.length<t&&i>0;){for(var c=0,u=void 0,h=0;h<le.length;h++)le[h]>c&&!s[h]&&(u=h,c=le[h]);if(c>50&&(s[u]=!0,n.push(_e(he[u])),i--),++l>200)break}}return n}))}(e,100).then((function(e){t(e)})):t([])},selectPath:function(e){this.shared.currentPath=e.path},fuzzySearch:function(){this.shared.searchQuery=this.queryString,Re("/search/"+this.shared.searchQuery)}}},An=(n(45),Pe(Rn,In,[],!1,null,null,null));An.options.__file="src/components/Search.vue";var Ln=An.exports,Dn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search-result"},[n("h3",[e._v(e._s(e.$t("search.resultTitle")))]),e._v(" "),n("el-input",{attrs:{"prefix-icon":"el-icon-search"},model:{value:e.shared.searchQuery,callback:function(t){e.$set(e.shared,"searchQuery",t)},expression:"shared.searchQuery"}}),e._v(" "),n("div",{staticClass:"result-summary"},[e._v("\n        "+e._s(e.$t("search.foundCountBrief").replace("${searchResultCount}",e.searchResultCount))+",\n        "),e.searchToken?n("span",{staticClass:"searching"},[e._v("\n            搜索中"),n("i",{staticClass:"el-icon-loading"})]):n("span",[e._v("\n            "+e._s(e.$t("search.displayCountBrief").replace("${displayResultCount}",e.displayResultCount))+"\n        ")])]),e._v(" "),e._l(e.searchResult,(function(t){return n("SearchResultItemCard",{key:t.path,attrs:{"item-data":t,"search-query":e.shared.searchQuery}})}))],2)};Dn._withStripped=!0;var $n=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:{"doc-search-result-item-card":!0,"needs-show-more":e.needsShowMoreDesc}},[n("h4",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}]},[n("a",{staticClass:"path",attrs:{href:"#"+e.itemData.path}},[e._v(e._s(e.itemData.path))])]),e._v(" "),e.itemData.similarPaths.length>0?n("div",{staticClass:"other-result"},e._l(e.itemData.similarPaths,(function(t){return n("div",{key:t},[n("a",{attrs:{href:"#"+t}},[e._v(e._s(t))])])})),0):e._e(),e._v(" "),n("div",{staticClass:"item-description"},[n("div",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}],domProps:{innerHTML:e._s(e.itemData.content)}})]),e._v(" "),n("div",{staticClass:"show-more-button"},[n("el-button",{attrs:{icon:"el-icon-more",size:"mini"},on:{click:e.showMore}},[e._v(e._s(e.$t("search.showMore")))])],1)])};$n._withStripped=!0;var Pn={props:["itemData","searchQuery"],data:function(){return{needsShowMoreDesc:!0}},methods:{showMore:function(){this.needsShowMoreDesc=!1}},mounted:function(){var e=this;a.a.nextTick((function(){var t=e.$el.querySelector(".item-description");e.needsShowMoreDesc=t.scrollHeight!==t.clientHeight}))}},Vn=(n(46),Pe(Pn,$n,[],!1,null,null,null));function jn(e){var t=this;console.log("Searching, ",e),this.searchResult=[],this.searchResultCount=0,this.displayResultCount=0,this.static.searchResult.cache={},this.searchToken=Date.now()+"";var n,r,a=this.searchToken;(n=e,r=function(e){if(a===t.searchToken){if(!t.noLimit&&t.displayResultCount<=t.limitedResultCount){for(var n=0;n<e.length;n++){var r=e[n].text,i=t.static.searchResult.cache[r];if(i)i.similarPaths.push(e[n].path);else{var o=Object.freeze({path:e[n].path,content:e[n].content,similarPaths:[]});t.searchResult.push(o),t.static.searchResult.cache[r]=o}}t.displayResultCount+=e.length}t.searchResultCount+=e.length}},de().then((function(){return new Promise((function(e){var t=0;function a(){--t||e()}function i(e){var i=ve(e);i.indexer?r(i.indexer.search(n)):(t++,i.fetcher.then((function(){r(i.indexer.search(n)),a()})).catch((function(e){a()})))}for(var o in i(""),se)i(o);t||e()}))}))).then((function(){t.searchToken=""})).catch((function(){t.searchToken=""}))}Vn.options.__file="src/components/SearchResultItemCard.vue";var Fn={components:{SearchResultItemCard:Vn.exports},data:function(){return{searchResult:[],searchResultCount:0,displayResultCount:0,noLimit:!1,limitedResultCount:200,searchToken:"",static:Object.freeze({searchResult:{cache:null}}),shared:ke}},created:function(){this.updateSearchResultsImmediate(this.shared.searchQuery)},methods:{updateSearchResultsImmediate:jn,updateSearchResults:gn()(jn,500,{leading:!1})},watch:{"shared.searchQuery":function(e){this.updateSearchResults(e),Re("/search/"+this.shared.searchQuery)}}},zn=(n(47),Pe(Fn,Dn,[],!1,null,null,null));zn.options.__file="src/components/SearchResult.vue";var Bn=zn.exports,Wn=function(){var e=this.$createElement;return(this._self._c||e)("div")};Wn._withStripped=!0;var Un=Pe({},Wn,[],!1,null,null,null);Un.options.__file="src/components/Home.vue";var Hn=Un.exports,qn={props:["docType"],data:function(){return{shared:ke}},computed:{pagePath:function(){return Oe()}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,LiveExample:On,Home:Hn}},Gn=(n(48),Pe(qn,Z,[],!1,null,null,null));Gn.options.__file="src/App.vue";var Kn=Gn.exports,Jn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["ec-doc-mobile","ec-doc-"+e.shared.docType]},[n("div",{staticClass:"top-bar"},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("div",{staticClass:"doc-mobile-toolbar"},[n("el-button",{staticClass:"open-nav",attrs:{icon:"el-icon-menu",size:"mini"},on:{click:e.showNav}}),e._v(" "),n("Search")],1)]),e._v(" "),n("el-drawer",{attrs:{direction:"ltr",size:"80%",visible:e.navShown,"show-close":!1},on:{"update:visible":function(t){e.navShown=t}}},[n("DocNav")],1),e._v(" "),n("transition",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1),e._v(" "),e.pagePathParts.length>1?n("div",{staticClass:"doc-breadcrumb"},e._l(e.pagePathParts,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text))])})),0):e._e()],1)};Jn._withStripped=!0;var Qn={props:["docType"],data:function(){return{navShown:!1,shared:ke}},computed:{pagePath:function(){return Oe()},pagePathParts:function(){for(var e=this.pagePath.split("."),t=[],n="",r=0;r<e.length;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r]+(r===e.length-1?"":"."),link:n});return t}},methods:{showNav:function(){this.navShown=!0}},watch:{"shared.currentPath":function(e){this.navShown=!1}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,Home:Hn}},Xn=(n(49),Pe(Qn,Jn,[],!1,null,null,null));Xn.options.__file="src/AppMobile.vue";var Zn=Xn.exports,Yn=n(20),er=n.n(Yn),tr=n(27),nr=n.n(tr),rr=n(28),ar=n.n(rr);n(50);function ir(e){e.querySelectorAll("pre code").forEach((function(e){e.classList.contains("hljs")||er.a.highlightBlock(e)}))}er.a.registerLanguage("javascript",nr.a),er.a.registerLanguage("xml",ar.a),a.a.directive("highlight",{inserted:function(e){ir(e)},update:function(e){ir(e)}});var or=n(29),sr=n.n(or),lr=n(30),cr=n.n(lr);function ur(e,t){function n(){e.__markInstance.mark(t,{diacritics:!0,separateWordSearch:!0})}e.__markInstance?e.__markInstance.unmark({done:function(){n()}}):(e.__markInstance=new sr.a(e),n())}function hr(){window.innerWidth<600?ke.isMobile=!0:ke.isMobile=!1}a.a.directive("mark",{inserted:function(e,t){e.__doMarkDebounced=cr()(ur,500,{trailing:!0,leading:!1}),e.__doMarkDebounced(e,t.value)},update:function(e,t){e.__doMarkDebounced(e,t.value)}});var pr={en:{nav:{option:"Option",API:"API",tutorial:"Tutorial",optionGL:"GL",collapseAll:"Collapse All"},search:{placeholder:"Search document",resultTitle:"Search Result",showMore:"Show more",foundCountBrief:"Found ${searchResultCount} items",displayCountBrief:"${displayResultCount} displayed"},content:{properties:"Properties"},example:{title:"Preview",titleShort:"Preview",intro:"Try different values of the option and preview!",noExample:"No example available for current component.",tryDesc:"Try It",defaultColor:"Default Color",booleanDesc:"Enable",vectorSetSeparate:"SEPARATE",absoluteMode:"ABSOLUTE",percentMode:"PERCENT",inputPlaceholder:"Input to change the text content",builtin:"Builtin",upload:"Upload SVG or PNG",setOptionError:"Something Unexpected Happerns. Click refresh to try again!",refresh:"Refresh",close:"Close",changeLayout:"Change Layout",layout:{auto:"Auto",right:"Right",top:"Top",bottom:"Bottom"}}},zh:{nav:{option:"配置项",API:"API",tutorial:"教程",optionGL:"GL配置",collapseAll:"收起所有"},search:{placeholder:"搜索文档,回车查看更多结果",resultTitle:"文档搜索结果",showMore:"显示更多",foundCountBrief:"找到 ${searchResultCount} 条配置项",displayCountBrief:"显示 ${displayResultCount} 条"},content:{properties:"所有属性"},example:{title:"配置项效果预览",titleShort:"预览",intro:"调节控件可预览配置项不同取值的效果",noExample:"当前组件暂无可用示例",tryDesc:"试一试",defaultColor:"默认颜色",booleanDesc:"开启",vectorSetSeparate:"分别设置",absoluteMode:"绝对值",percentMode:"百分比",inputPlaceholder:"输入改变文本",builtin:"内置",upload:"上传 SVG 或 PNG",setOptionError:"发生了一些意料之外的错误,点击刷新再试试!",refresh:"刷新",close:"关闭",changeLayout:"切换布局",layout:{auto:"自动",right:"右侧",top:"顶部",bottom:"底部"}}}};function fr(e,t){window.addEventListener("resize",hr),hr();var n=t.cdnRoot||t.baseUrl;me(t.baseUrl,n,t.docType,t.version).then((function(){if(window.addEventListener("hashchange",(function(e){Ie()})),Ie(),ke.docType=t.docType,ke.locale=t.locale,"string"==typeof e&&(e=document.querySelector(e)),!e)throw new Error("Can't find el.");var n=document.createElement("div");e.appendChild(n);var r=new X({locale:t.locale,fallbackLocale:"en",messages:pr});new a.a({i18n:r,el:n,render:function(e){return console.log("iMobile: ",ke.isMobile),ke.isMobile?e(Zn):e(Kn)}})}))}}])}));
\ No newline at end of file
diff --git a/en/js/spreadsheet/spreadsheet.js b/en/js/spreadsheet/spreadsheet.js
index a83c139..e5dc9e3 100644
--- a/en/js/spreadsheet/spreadsheet.js
+++ b/en/js/spreadsheet/spreadsheet.js
@@ -91,7 +91,7 @@
 return n?a.length:a?t.error(e):V(e,l).slice(0)},T=t.compile=function(e,t){var n,o=[],i=[],r=z[e+" "];if(!r){for(t||(t=S(e)),n=t.length;n--;)r=m(t[n]),r[I]?o.push(r):i.push(r);r=z(e,v(i,o)),r.selector=e}return r},E=t.select=function(e,t,n,o){var i,r,s,a,u,d="function"==typeof e&&e,h=!o&&S(e=d.selector||e);if(n=n||[],1===h.length){if(r=h[0]=h[0].slice(0),r.length>2&&"ID"===(s=r[0]).type&&y.getById&&9===t.nodeType&&A&&b.relative[r[1].type]){if(!(t=(b.find.ID(s.matches[0].replace(ye,be),t)||[])[0]))return n;d&&(t=t.parentNode),e=e.slice(r.shift().value.length)}for(i=he.needsContext.test(e)?0:r.length;i--&&(s=r[i],!b.relative[a=s.type]);)if((u=b.find[a])&&(o=u(s.matches[0].replace(ye,be),ve.test(r[0].type)&&l(t.parentNode)||t))){if(r.splice(i,1),!(e=o.length&&c(r)))return X.apply(n,o),n;break}}return(d||T(e,h))(o,t,!A,n,ve.test(e)&&l(t.parentNode)||t),n},y.sortStable=I.split("").sort(Y).join("")===I,y.detectDuplicates=!!O,k(),y.sortDetached=i(function(e){return 1&e.compareDocumentPosition(x.createElement("div"))}),i(function(e){return e.innerHTML="<a href='#'></a>","#"===e.firstChild.getAttribute("href")})||r("type|href|height|width",function(e,t,n){return n?void 0:e.getAttribute(t,"type"===t.toLowerCase()?1:2)}),y.attributes&&i(function(e){return e.innerHTML="<input/>",e.firstChild.setAttribute("value",""),""===e.firstChild.getAttribute("value")})||r("value",function(e,t,n){return n||"input"!==e.nodeName.toLowerCase()?void 0:e.defaultValue}),i(function(e){return null==e.getAttribute("disabled")})||r(Q,function(e,t,n){var o;return n?void 0:!0===e[t]?t.toLowerCase():(o=e.getAttributeNode(t))&&o.specified?o.value:null}),t}(e);ie.find=ue,ie.expr=ue.selectors,ie.expr[":"]=ie.expr.pseudos,ie.unique=ue.uniqueSort,ie.text=ue.getText,ie.isXMLDoc=ue.isXML,ie.contains=ue.contains;var ce=ie.expr.match.needsContext,de=/^<(\w+)\s*\/?>(?:<\/\1>|)$/,he=/^.[^:#\[\.,]*$/;ie.filter=function(e,t,n){var o=t[0];return n&&(e=":not("+e+")"),1===t.length&&1===o.nodeType?ie.find.matchesSelector(o,e)?[o]:[]:ie.find.matches(e,ie.grep(t,function(e){return 1===e.nodeType}))},ie.fn.extend({find:function(e){var t,n=[],o=this,i=o.length;if("string"!=typeof e)return this.pushStack(ie(e).filter(function(){for(t=0;i>t;t++)if(ie.contains(o[t],this))return!0}));for(t=0;i>t;t++)ie.find(e,o[t],n);return n=this.pushStack(i>1?ie.unique(n):n),n.selector=this.selector?this.selector+" "+e:e,n},filter:function(e){return this.pushStack(o(this,e||[],!1))},not:function(e){return this.pushStack(o(this,e||[],!0))},is:function(e){return!!o(this,"string"==typeof e&&ce.test(e)?ie(e):e||[],!1).length}});var fe,pe=e.document,ge=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/;(ie.fn.init=function(e,t){var n,o;if(!e)return this;if("string"==typeof e){if(!(n="<"===e.charAt(0)&&">"===e.charAt(e.length-1)&&e.length>=3?[null,e,null]:ge.exec(e))||!n[1]&&t)return!t||t.jquery?(t||fe).find(e):this.constructor(t).find(e);if(n[1]){if(t=t instanceof ie?t[0]:t,ie.merge(this,ie.parseHTML(n[1],t&&t.nodeType?t.ownerDocument||t:pe,!0)),de.test(n[1])&&ie.isPlainObject(t))for(n in t)ie.isFunction(this[n])?this[n](t[n]):this.attr(n,t[n]);return this}if((o=pe.getElementById(n[2]))&&o.parentNode){if(o.id!==n[2])return fe.find(e);this.length=1,this[0]=o}return this.context=pe,this.selector=e,this}return e.nodeType?(this.context=this[0]=e,this.length=1,this):ie.isFunction(e)?void 0!==fe.ready?fe.ready(e):e(ie):(void 0!==e.selector&&(this.selector=e.selector,this.context=e.context),ie.makeArray(e,this))}).prototype=ie.fn,fe=ie(pe);var me=/^(?:parents|prev(?:Until|All))/,ve={children:!0,contents:!0,next:!0,prev:!0};ie.extend({dir:function(e,t,n){for(var o=[],i=e[t];i&&9!==i.nodeType&&(void 0===n||1!==i.nodeType||!ie(i).is(n));)1===i.nodeType&&o.push(i),i=i[t];return o},sibling:function(e,t){for(var n=[];e;e=e.nextSibling)1===e.nodeType&&e!==t&&n.push(e);return n}}),ie.fn.extend({has:function(e){var t,n=ie(e,this),o=n.length;return this.filter(function(){for(t=0;o>t;t++)if(ie.contains(this,n[t]))return!0})},closest:function(e,t){for(var n,o=0,i=this.length,r=[],s=ce.test(e)||"string"!=typeof e?ie(e,t||this.context):0;i>o;o++)for(n=this[o];n&&n!==t;n=n.parentNode)if(n.nodeType<11&&(s?s.index(n)>-1:1===n.nodeType&&ie.find.matchesSelector(n,e))){r.push(n);break}return this.pushStack(r.length>1?ie.unique(r):r)},index:function(e){return e?"string"==typeof e?ie.inArray(this[0],ie(e)):ie.inArray(e.jquery?e[0]:e,this):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(e,t){return this.pushStack(ie.unique(ie.merge(this.get(),ie(e,t))))},addBack:function(e){return this.add(null==e?this.prevObject:this.prevObject.filter(e))}}),ie.each({parent:function(e){var t=e.parentNode;return t&&11!==t.nodeType?t:null},parents:function(e){return ie.dir(e,"parentNode")},parentsUntil:function(e,t,n){return ie.dir(e,"parentNode",n)},next:function(e){return i(e,"nextSibling")},prev:function(e){return i(e,"previousSibling")},nextAll:function(e){return ie.dir(e,"nextSibling")},prevAll:function(e){return ie.dir(e,"previousSibling")},nextUntil:function(e,t,n){return ie.dir(e,"nextSibling",n)},prevUntil:function(e,t,n){return ie.dir(e,"previousSibling",n)},siblings:function(e){return ie.sibling((e.parentNode||{}).firstChild,e)},children:function(e){return ie.sibling(e.firstChild)},contents:function(e){return ie.nodeName(e,"iframe")?e.contentDocument||e.contentWindow.document:ie.merge([],e.childNodes)}},function(e,t){ie.fn[e]=function(n,o){var i=ie.map(this,t,n);return"Until"!==e.slice(-5)&&(o=n),o&&"string"==typeof o&&(i=ie.filter(o,i)),this.length>1&&(ve[e]||(i=ie.unique(i)),me.test(e)&&(i=i.reverse())),this.pushStack(i)}});var we=/\S+/g,ye={};ie.Callbacks=function(e){e="string"==typeof e?ye[e]||r(e):ie.extend({},e);var t,n,o,i,s,a,l=[],u=!e.once&&[],c=function(r){for(n=e.memory&&r,o=!0,s=a||0,a=0,i=l.length,t=!0;l&&i>s;s++)if(!1===l[s].apply(r[0],r[1])&&e.stopOnFalse){n=!1;break}t=!1,l&&(u?u.length&&c(u.shift()):n?l=[]:d.disable())},d={add:function(){if(l){var o=l.length;!function t(n){ie.each(n,function(n,o){var i=ie.type(o);"function"===i?e.unique&&d.has(o)||l.push(o):o&&o.length&&"string"!==i&&t(o)})}(arguments),t?i=l.length:n&&(a=o,c(n))}return this},remove:function(){return l&&ie.each(arguments,function(e,n){for(var o;(o=ie.inArray(n,l,o))>-1;)l.splice(o,1),t&&(i>=o&&i--,s>=o&&s--)}),this},has:function(e){return e?ie.inArray(e,l)>-1:!(!l||!l.length)},empty:function(){return l=[],i=0,this},disable:function(){return l=u=n=void 0,this},disabled:function(){return!l},lock:function(){return u=void 0,n||d.disable(),this},locked:function(){return!u},fireWith:function(e,n){return!l||o&&!u||(n=n||[],n=[e,n.slice?n.slice():n],t?u.push(n):c(n)),this},fire:function(){return d.fireWith(this,arguments),this},fired:function(){return!!o}};return d},ie.extend({Deferred:function(e){var t=[["resolve","done",ie.Callbacks("once memory"),"resolved"],["reject","fail",ie.Callbacks("once memory"),"rejected"],["notify","progress",ie.Callbacks("memory")]],n="pending",o={state:function(){return n},always:function(){return i.done(arguments).fail(arguments),this},then:function(){var e=arguments;return ie.Deferred(function(n){ie.each(t,function(t,r){var s=ie.isFunction(e[t])&&e[t];i[r[1]](function(){var e=s&&s.apply(this,arguments);e&&ie.isFunction(e.promise)?e.promise().done(n.resolve).fail(n.reject).progress(n.notify):n[r[0]+"With"](this===o?n.promise():this,s?[e]:arguments)})}),e=null}).promise()},promise:function(e){return null!=e?ie.extend(e,o):o}},i={};return o.pipe=o.then,ie.each(t,function(e,r){var s=r[2],a=r[3];o[r[1]]=s.add,a&&s.add(function(){n=a},t[1^e][2].disable,t[2][2].lock),i[r[0]]=function(){return i[r[0]+"With"](this===i?o:this,arguments),this},i[r[0]+"With"]=s.fireWith}),o.promise(i),e&&e.call(i,i),i},when:function(e){var t,n,o,i=0,r=K.call(arguments),s=r.length,a=1!==s||e&&ie.isFunction(e.promise)?s:0,l=1===a?e:ie.Deferred(),u=function(e,n,o){return function(i){n[e]=this,o[e]=arguments.length>1?K.call(arguments):i,o===t?l.notifyWith(n,o):--a||l.resolveWith(n,o)}};if(s>1)for(t=new Array(s),n=new Array(s),o=new Array(s);s>i;i++)r[i]&&ie.isFunction(r[i].promise)?r[i].promise().done(u(i,o,r)).fail(l.reject).progress(u(i,n,t)):--a;return a||l.resolveWith(o,r),l.promise()}});var be;ie.fn.ready=function(e){return ie.ready.promise().done(e),this},ie.extend({isReady:!1,readyWait:1,holdReady:function(e){e?ie.readyWait++:ie.ready(!0)},ready:function(e){if(!0===e?!--ie.readyWait:!ie.isReady){if(!pe.body)return setTimeout(ie.ready);ie.isReady=!0,!0!==e&&--ie.readyWait>0||(be.resolveWith(pe,[ie]),ie.fn.triggerHandler&&(ie(pe).triggerHandler("ready"),ie(pe).off("ready")))}}}),ie.ready.promise=function(t){if(!be)if(be=ie.Deferred(),"complete"===pe.readyState)setTimeout(ie.ready);else if(pe.addEventListener)pe.addEventListener("DOMContentLoaded",a,!1),e.addEventListener("load",a,!1);else{pe.attachEvent("onreadystatechange",a),e.attachEvent("onload",a);var n=!1;try{n=null==e.frameElement&&pe.documentElement}catch(e){}n&&n.doScroll&&function e(){if(!ie.isReady){try{n.doScroll("left")}catch(t){return setTimeout(e,50)}s(),ie.ready()}}()}return be.promise(t)};var Ce,_e="undefined";for(Ce in ie(ne))break;ne.ownLast="0"!==Ce,ne.inlineBlockNeedsLayout=!1,ie(function(){var e,t,n,o;(n=pe.getElementsByTagName("body")[0])&&n.style&&(t=pe.createElement("div"),o=pe.createElement("div"),o.style.cssText="position:absolute;border:0;width:0;height:0;top:0;left:-9999px",n.appendChild(o).appendChild(t),typeof t.style.zoom!==_e&&(t.style.cssText="display:inline;margin:0;border:0;padding:1px;width:1px;zoom:1",ne.inlineBlockNeedsLayout=e=3===t.offsetWidth,e&&(n.style.zoom=1)),n.removeChild(o))}),function(){var e=pe.createElement("div");if(null==ne.deleteExpando){ne.deleteExpando=!0;try{delete e.test}catch(e){ne.deleteExpando=!1}}e=null}(),ie.acceptData=function(e){var t=ie.noData[(e.nodeName+" ").toLowerCase()],n=+e.nodeType||1;return(1===n||9===n)&&(!t||!0!==t&&e.getAttribute("classid")===t)};var Se=/^(?:\{[\w\W]*\}|\[[\w\W]*\])$/,Te=/([A-Z])/g;ie.extend({cache:{},noData:{"applet ":!0,"embed ":!0,"object ":"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"},hasData:function(e){return!!(e=e.nodeType?ie.cache[e[ie.expando]]:e[ie.expando])&&!u(e)},data:function(e,t,n){return c(e,t,n)},removeData:function(e,t){return d(e,t)},_data:function(e,t,n){return c(e,t,n,!0)},_removeData:function(e,t){return d(e,t,!0)}}),ie.fn.extend({data:function(e,t){var n,o,i,r=this[0],s=r&&r.attributes;if(void 0===e){if(this.length&&(i=ie.data(r),1===r.nodeType&&!ie._data(r,"parsedAttrs"))){for(n=s.length;n--;)s[n]&&(o=s[n].name,0===o.indexOf("data-")&&(o=ie.camelCase(o.slice(5)),l(r,o,i[o])));ie._data(r,"parsedAttrs",!0)}return i}return"object"==typeof e?this.each(function(){ie.data(this,e)}):arguments.length>1?this.each(function(){ie.data(this,e,t)}):r?l(r,e,ie.data(r,e)):void 0},removeData:function(e){return this.each(function(){ie.removeData(this,e)})}}),ie.extend({queue:function(e,t,n){var o;return e?(t=(t||"fx")+"queue",o=ie._data(e,t),n&&(!o||ie.isArray(n)?o=ie._data(e,t,ie.makeArray(n)):o.push(n)),o||[]):void 0},dequeue:function(e,t){t=t||"fx";var n=ie.queue(e,t),o=n.length,i=n.shift(),r=ie._queueHooks(e,t),s=function(){ie.dequeue(e,t)};"inprogress"===i&&(i=n.shift(),o--),i&&("fx"===t&&n.unshift("inprogress"),delete r.stop,i.call(e,s,r)),!o&&r&&r.empty.fire()},_queueHooks:function(e,t){var n=t+"queueHooks";return ie._data(e,n)||ie._data(e,n,{empty:ie.Callbacks("once memory").add(function(){ie._removeData(e,t+"queue"),ie._removeData(e,n)})})}}),ie.fn.extend({queue:function(e,t){var n=2;return"string"!=typeof e&&(t=e,e="fx",n--),arguments.length<n?ie.queue(this[0],e):void 0===t?this:this.each(function(){var n=ie.queue(this,e,t);ie._queueHooks(this,e),"fx"===e&&"inprogress"!==n[0]&&ie.dequeue(this,e)})},dequeue:function(e){return this.each(function(){ie.dequeue(this,e)})},clearQueue:function(e){return this.queue(e||"fx",[])},promise:function(e,t){var n,o=1,i=ie.Deferred(),r=this,s=this.length,a=function(){--o||i.resolveWith(r,[r])};for("string"!=typeof e&&(t=e,e=void 0),e=e||"fx";s--;)(n=ie._data(r[s],e+"queueHooks"))&&n.empty&&(o++,n.empty.add(a));return a(),i.promise(t)}});var Ee=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,Re=["Top","Right","Bottom","Left"],Me=function(e,t){return e=t||e,"none"===ie.css(e,"display")||!ie.contains(e.ownerDocument,e)},Oe=ie.access=function(e,t,n,o,i,r,s){var a=0,l=e.length,u=null==n;if("object"===ie.type(n)){i=!0;for(a in n)ie.access(e,t,a,n[a],!0,r,s)}else if(void 0!==o&&(i=!0,ie.isFunction(o)||(s=!0),u&&(s?(t.call(e,o),t=null):(u=t,t=function(e,t,n){return u.call(ie(e),n)})),t))for(;l>a;a++)t(e[a],n,s?o:o.call(e[a],a,t(e[a],n)));return i?e:u?t.call(e):l?t(e[0],n):r},ke=/^(?:checkbox|radio)$/i;!function(){var e=pe.createElement("input"),t=pe.createElement("div"),n=pe.createDocumentFragment();if(t.innerHTML="  <link/><table></table><a href='/a'>a</a><input type='checkbox'/>",ne.leadingWhitespace=3===t.firstChild.nodeType,ne.tbody=!t.getElementsByTagName("tbody").length,ne.htmlSerialize=!!t.getElementsByTagName("link").length,ne.html5Clone="<:nav></:nav>"!==pe.createElement("nav").cloneNode(!0).outerHTML,e.type="checkbox",e.checked=!0,n.appendChild(e),ne.appendChecked=e.checked,t.innerHTML="<textarea>x</textarea>",ne.noCloneChecked=!!t.cloneNode(!0).lastChild.defaultValue,n.appendChild(t),t.innerHTML="<input type='radio' checked='checked' name='t'/>",ne.checkClone=t.cloneNode(!0).cloneNode(!0).lastChild.checked,ne.noCloneEvent=!0,t.attachEvent&&(t.attachEvent("onclick",function(){ne.noCloneEvent=!1}),t.cloneNode(!0).click()),null==ne.deleteExpando){ne.deleteExpando=!0;try{delete t.test}catch(e){ne.deleteExpando=!1}}}(),function(){var t,n,o=pe.createElement("div");for(t in{submit:!0,change:!0,focusin:!0})n="on"+t,(ne[t+"Bubbles"]=n in e)||(o.setAttribute(n,"t"),ne[t+"Bubbles"]=!1===o.attributes[n].expando);o=null}();var xe=/^(?:input|select|textarea)$/i,De=/^key/,Ae=/^(?:mouse|pointer|contextmenu)|click/,Pe=/^(?:focusinfocus|focusoutblur)$/,He=/^([^.]*)(?:\.(.+)|)$/;ie.event={global:{},add:function(e,t,n,o,i){var r,s,a,l,u,c,d,h,f,p,g,m=ie._data(e);if(m){for(n.handler&&(l=n,n=l.handler,i=l.selector),n.guid||(n.guid=ie.guid++),(s=m.events)||(s=m.events={}),(c=m.handle)||(c=m.handle=function(e){return typeof ie===_e||e&&ie.event.triggered===e.type?void 0:ie.event.dispatch.apply(c.elem,arguments)},c.elem=e),t=(t||"").match(we)||[""],a=t.length;a--;)r=He.exec(t[a])||[],f=g=r[1],p=(r[2]||"").split(".").sort(),f&&(u=ie.event.special[f]||{},f=(i?u.delegateType:u.bindType)||f,u=ie.event.special[f]||{},d=ie.extend({type:f,origType:g,data:o,handler:n,guid:n.guid,selector:i,needsContext:i&&ie.expr.match.needsContext.test(i),namespace:p.join(".")},l),(h=s[f])||(h=s[f]=[],h.delegateCount=0,u.setup&&!1!==u.setup.call(e,o,p,c)||(e.addEventListener?e.addEventListener(f,c,!1):e.attachEvent&&e.attachEvent("on"+f,c))),u.add&&(u.add.call(e,d),d.handler.guid||(d.handler.guid=n.guid)),i?h.splice(h.delegateCount++,0,d):h.push(d),ie.event.global[f]=!0);e=null}},remove:function(e,t,n,o,i){var r,s,a,l,u,c,d,h,f,p,g,m=ie.hasData(e)&&ie._data(e);if(m&&(c=m.events)){for(t=(t||"").match(we)||[""],u=t.length;u--;)if(a=He.exec(t[u])||[],f=g=a[1],p=(a[2]||"").split(".").sort(),f){for(d=ie.event.special[f]||{},f=(o?d.delegateType:d.bindType)||f,h=c[f]||[],a=a[2]&&new RegExp("(^|\\.)"+p.join("\\.(?:.*\\.|)")+"(\\.|$)"),l=r=h.length;r--;)s=h[r],!i&&g!==s.origType||n&&n.guid!==s.guid||a&&!a.test(s.namespace)||o&&o!==s.selector&&("**"!==o||!s.selector)||(h.splice(r,1),s.selector&&h.delegateCount--,d.remove&&d.remove.call(e,s));l&&!h.length&&(d.teardown&&!1!==d.teardown.call(e,p,m.handle)||ie.removeEvent(e,f,m.handle),delete c[f])}else for(f in c)ie.event.remove(e,f+t[u],n,o,!0);ie.isEmptyObject(c)&&(delete m.handle,ie._removeData(e,"events"))}},trigger:function(t,n,o,i){var r,s,a,l,u,c,d,h=[o||pe],f=te.call(t,"type")?t.type:t,p=te.call(t,"namespace")?t.namespace.split("."):[];if(a=c=o=o||pe,3!==o.nodeType&&8!==o.nodeType&&!Pe.test(f+ie.event.triggered)&&(f.indexOf(".")>=0&&(p=f.split("."),f=p.shift(),p.sort()),s=f.indexOf(":")<0&&"on"+f,t=t[ie.expando]?t:new ie.Event(f,"object"==typeof t&&t),t.isTrigger=i?2:3,t.namespace=p.join("."),t.namespace_re=t.namespace?new RegExp("(^|\\.)"+p.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,t.result=void 0,t.target||(t.target=o),n=null==n?[t]:ie.makeArray(n,[t]),u=ie.event.special[f]||{},i||!u.trigger||!1!==u.trigger.apply(o,n))){if(!i&&!u.noBubble&&!ie.isWindow(o)){for(l=u.delegateType||f,Pe.test(l+f)||(a=a.parentNode);a;a=a.parentNode)h.push(a),c=a;c===(o.ownerDocument||pe)&&h.push(c.defaultView||c.parentWindow||e)}for(d=0;(a=h[d++])&&!t.isPropagationStopped();)t.type=d>1?l:u.bindType||f,r=(ie._data(a,"events")||{})[t.type]&&ie._data(a,"handle"),r&&r.apply(a,n),(r=s&&a[s])&&r.apply&&ie.acceptData(a)&&(t.result=r.apply(a,n),!1===t.result&&t.preventDefault());if(t.type=f,!i&&!t.isDefaultPrevented()&&(!u._default||!1===u._default.apply(h.pop(),n))&&ie.acceptData(o)&&s&&o[f]&&!ie.isWindow(o)){c=o[s],c&&(o[s]=null),ie.event.triggered=f;try{o[f]()}catch(e){}ie.event.triggered=void 0,c&&(o[s]=c)}return t.result}},dispatch:function(e){e=ie.event.fix(e);var t,n,o,i,r,s=[],a=K.call(arguments),l=(ie._data(this,"events")||{})[e.type]||[],u=ie.event.special[e.type]||{};if(a[0]=e,e.delegateTarget=this,!u.preDispatch||!1!==u.preDispatch.call(this,e)){for(s=ie.event.handlers.call(this,e,l),t=0;(i=s[t++])&&!e.isPropagationStopped();)for(e.currentTarget=i.elem,r=0;(o=i.handlers[r++])&&!e.isImmediatePropagationStopped();)(!e.namespace_re||e.namespace_re.test(o.namespace))&&(e.handleObj=o,e.data=o.data,void 0!==(n=((ie.event.special[o.origType]||{}).handle||o.handler).apply(i.elem,a))&&!1===(e.result=n)&&(e.preventDefault(),e.stopPropagation()));return u.postDispatch&&u.postDispatch.call(this,e),e.result}},handlers:function(e,t){var n,o,i,r,s=[],a=t.delegateCount,l=e.target;if(a&&l.nodeType&&(!e.button||"click"!==e.type))for(;l!=this;l=l.parentNode||this)if(1===l.nodeType&&(!0!==l.disabled||"click"!==e.type)){for(i=[],r=0;a>r;r++)o=t[r],n=o.selector+" ",void 0===i[n]&&(i[n]=o.needsContext?ie(n,this).index(l)>=0:ie.find(n,this,null,[l]).length),i[n]&&i.push(o);i.length&&s.push({elem:l,handlers:i})}return a<t.length&&s.push({elem:this,handlers:t.slice(a)}),s},fix:function(e){if(e[ie.expando])return e;var t,n,o,i=e.type,r=e,s=this.fixHooks[i];for(s||(this.fixHooks[i]=s=Ae.test(i)?this.mouseHooks:De.test(i)?this.keyHooks:{}),o=s.props?this.props.concat(s.props):this.props,e=new ie.Event(r),t=o.length;t--;)n=o[t],e[n]=r[n];return e.target||(e.target=r.srcElement||pe),3===e.target.nodeType&&(e.target=e.target.parentNode),e.metaKey=!!e.metaKey,s.filter?s.filter(e,r):e},props:"altKey bubbles cancelable ctrlKey currentTarget eventPhase metaKey relatedTarget shiftKey target timeStamp view which".split(" "),fixHooks:{},keyHooks:{props:"char charCode key keyCode".split(" "),filter:function(e,t){return null==e.which&&(e.which=null!=t.charCode?t.charCode:t.keyCode),e}},mouseHooks:{props:"button buttons clientX clientY fromElement offsetX offsetY pageX pageY screenX screenY toElement".split(" "),filter:function(e,t){var n,o,i,r=t.button,s=t.fromElement;return null==e.pageX&&null!=t.clientX&&(o=e.target.ownerDocument||pe,i=o.documentElement,n=o.body,e.pageX=t.clientX+(i&&i.scrollLeft||n&&n.scrollLeft||0)-(i&&i.clientLeft||n&&n.clientLeft||0),e.pageY=t.clientY+(i&&i.scrollTop||n&&n.scrollTop||0)-(i&&i.clientTop||n&&n.clientTop||0)),!e.relatedTarget&&s&&(e.relatedTarget=s===e.target?t.toElement:s),e.which||void 0===r||(e.which=1&r?1:2&r?3:4&r?2:0),e}},special:{load:{noBubble:!0},focus:{trigger:function(){if(this!==p()&&this.focus)try{return this.focus(),!1}catch(e){}},delegateType:"focusin"},blur:{trigger:function(){return this===p()&&this.blur?(this.blur(),!1):void 0},delegateType:"focusout"},click:{trigger:function(){return ie.nodeName(this,"input")&&"checkbox"===this.type&&this.click?(this.click(),!1):void 0},_default:function(e){return ie.nodeName(e.target,"a")}},beforeunload:{postDispatch:function(e){void 0!==e.result&&e.originalEvent&&(e.originalEvent.returnValue=e.result)}}},simulate:function(e,t,n,o){var i=ie.extend(new ie.Event,n,{type:e,isSimulated:!0,originalEvent:{}});o?ie.event.trigger(i,null,t):ie.event.dispatch.call(t,i),i.isDefaultPrevented()&&n.preventDefault()}},ie.removeEvent=pe.removeEventListener?function(e,t,n){e.removeEventListener&&e.removeEventListener(t,n,!1)}:function(e,t,n){var o="on"+t;e.detachEvent&&(typeof e[o]===_e&&(e[o]=null),e.detachEvent(o,n))},ie.Event=function(e,t){return this instanceof ie.Event?(e&&e.type?(this.originalEvent=e,this.type=e.type,this.isDefaultPrevented=e.defaultPrevented||void 0===e.defaultPrevented&&!1===e.returnValue?h:f):this.type=e,t&&ie.extend(this,t),this.timeStamp=e&&e.timeStamp||ie.now(),void(this[ie.expando]=!0)):new ie.Event(e,t)},ie.Event.prototype={isDefaultPrevented:f,isPropagationStopped:f,isImmediatePropagationStopped:f,preventDefault:function(){var e=this.originalEvent;this.isDefaultPrevented=h,e&&(e.preventDefault?e.preventDefault():e.returnValue=!1)},stopPropagation:function(){var e=this.originalEvent;this.isPropagationStopped=h,e&&(e.stopPropagation&&e.stopPropagation(),e.cancelBubble=!0)},stopImmediatePropagation:function(){var e=this.originalEvent;this.isImmediatePropagationStopped=h,e&&e.stopImmediatePropagation&&e.stopImmediatePropagation(),this.stopPropagation()}},ie.each({mouseenter:"mouseover",mouseleave:"mouseout",pointerenter:"pointerover",pointerleave:"pointerout"},function(e,t){ie.event.special[e]={delegateType:t,bindType:t,handle:function(e){var n,o=this,i=e.relatedTarget,r=e.handleObj;return(!i||i!==o&&!ie.contains(o,i))&&(e.type=r.origType,n=r.handler.apply(this,arguments),e.type=t),n}}}),ne.submitBubbles||(ie.event.special.submit={setup:function(){return!ie.nodeName(this,"form")&&void ie.event.add(this,"click._submit keypress._submit",function(e){var t=e.target,n=ie.nodeName(t,"input")||ie.nodeName(t,"button")?t.form:void 0;n&&!ie._data(n,"submitBubbles")&&(ie.event.add(n,"submit._submit",function(e){e._submit_bubble=!0}),ie._data(n,"submitBubbles",!0))})},postDispatch:function(e){e._submit_bubble&&(delete e._submit_bubble,this.parentNode&&!e.isTrigger&&ie.event.simulate("submit",this.parentNode,e,!0))},teardown:function(){return!ie.nodeName(this,"form")&&void ie.event.remove(this,"._submit")}}),ne.changeBubbles||(ie.event.special.change={setup:function(){return xe.test(this.nodeName)?(("checkbox"===this.type||"radio"===this.type)&&(ie.event.add(this,"propertychange._change",function(e){"checked"===e.originalEvent.propertyName&&(this._just_changed=!0)}),ie.event.add(this,"click._change",function(e){this._just_changed&&!e.isTrigger&&(this._just_changed=!1),ie.event.simulate("change",this,e,!0)})),!1):void ie.event.add(this,"beforeactivate._change",function(e){var t=e.target;xe.test(t.nodeName)&&!ie._data(t,"changeBubbles")&&(ie.event.add(t,"change._change",function(e){!this.parentNode||e.isSimulated||e.isTrigger||ie.event.simulate("change",this.parentNode,e,!0)}),ie._data(t,"changeBubbles",!0))})},handle:function(e){var t=e.target;return this!==t||e.isSimulated||e.isTrigger||"radio"!==t.type&&"checkbox"!==t.type?e.handleObj.handler.apply(this,arguments):void 0},teardown:function(){return ie.event.remove(this,"._change"),!xe.test(this.nodeName)}}),ne.focusinBubbles||ie.each({focus:"focusin",blur:"focusout"},function(e,t){var n=function(e){ie.event.simulate(t,e.target,ie.event.fix(e),!0)};ie.event.special[t]={setup:function(){var o=this.ownerDocument||this,i=ie._data(o,t);i||o.addEventListener(e,n,!0),ie._data(o,t,(i||0)+1)},teardown:function(){var o=this.ownerDocument||this,i=ie._data(o,t)-1;i?ie._data(o,t,i):(o.removeEventListener(e,n,!0),ie._removeData(o,t))}}}),ie.fn.extend({on:function(e,t,n,o,i){var r,s;if("object"==typeof e){"string"!=typeof t&&(n=n||t,t=void 0);for(r in e)this.on(r,t,n,e[r],i);return this}if(null==n&&null==o?(o=t,n=t=void 0):null==o&&("string"==typeof t?(o=n,n=void 0):(o=n,n=t,t=void 0)),!1===o)o=f;else if(!o)return this;return 1===i&&(s=o,o=function(e){return ie().off(e),s.apply(this,arguments)},o.guid=s.guid||(s.guid=ie.guid++)),this.each(function(){ie.event.add(this,e,o,n,t)})},one:function(e,t,n,o){return this.on(e,t,n,o,1)},off:function(e,t,n){var o,i;if(e&&e.preventDefault&&e.handleObj)return o=e.handleObj,ie(e.delegateTarget).off(o.namespace?o.origType+"."+o.namespace:o.origType,o.selector,o.handler),this;if("object"==typeof e){for(i in e)this.off(i,t,e[i]);return this}return(!1===t||"function"==typeof t)&&(n=t,t=void 0),!1===n&&(n=f),this.each(function(){ie.event.remove(this,e,n,t)})},trigger:function(e,t){return this.each(function(){ie.event.trigger(e,t,this)})},triggerHandler:function(e,t){var n=this[0];return n?ie.event.trigger(e,t,n,!0):void 0}});var Ne="abbr|article|aside|audio|bdi|canvas|data|datalist|details|figcaption|figure|footer|header|hgroup|mark|meter|nav|output|progress|section|summary|time|video",Le=/ jQuery\d+="(?:null|\d+)"/g,Ie=new RegExp("<(?:"+Ne+")[\\s/>]","i"),We=/^\s+/,je=/<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/gi,Be=/<([\w:]+)/,Fe=/<tbody/i,Ve=/<|&#?\w+;/,ze=/<(?:script|style|link)/i,Ye=/checked\s*(?:[^=]|=\s*.checked.)/i,Ue=/^$|\/(?:java|ecma)script/i,Ge=/^true\/(.*)/,$e=/^\s*<!(?:\[CDATA\[|--)|(?:\]\]|--)>\s*$/g,qe={option:[1,"<select multiple='multiple'>","</select>"],legend:[1,"<fieldset>","</fieldset>"],area:[1,"<map>","</map>"],param:[1,"<object>","</object>"],thead:[1,"<table>","</table>"],tr:[2,"<table><tbody>","</tbody></table>"],col:[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"],td:[3,"<table><tbody><tr>","</tr></tbody></table>"],_default:ne.htmlSerialize?[0,"",""]:[1,"X<div>","</div>"]},Ke=g(pe),Xe=Ke.appendChild(pe.createElement("div"));qe.optgroup=qe.option,qe.tbody=qe.tfoot=qe.colgroup=qe.caption=qe.thead,qe.th=qe.td,ie.extend({clone:function(e,t,n){var o,i,r,s,a,l=ie.contains(e.ownerDocument,e);if(ne.html5Clone||ie.isXMLDoc(e)||!Ie.test("<"+e.nodeName+">")?r=e.cloneNode(!0):(Xe.innerHTML=e.outerHTML,Xe.removeChild(r=Xe.firstChild)),!(ne.noCloneEvent&&ne.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||ie.isXMLDoc(e)))for(o=m(r),a=m(e),s=0;null!=(i=a[s]);++s)o[s]&&S(i,o[s]);if(t)if(n)for(a=a||m(e),o=o||m(r),s=0;null!=(i=a[s]);s++)_(i,o[s]);else _(e,r);return o=m(r,"script"),o.length>0&&C(o,!l&&m(e,"script")),o=a=i=null,r},buildFragment:function(e,t,n,o){for(var i,r,s,a,l,u,c,d=e.length,h=g(t),f=[],p=0;d>p;p++)if((r=e[p])||0===r)if("object"===ie.type(r))ie.merge(f,r.nodeType?[r]:r);else if(Ve.test(r)){for(a=a||h.appendChild(t.createElement("div")),l=(Be.exec(r)||["",""])[1].toLowerCase(),c=qe[l]||qe._default,a.innerHTML=c[1]+r.replace(je,"<$1></$2>")+c[2],i=c[0];i--;)a=a.lastChild;if(!ne.leadingWhitespace&&We.test(r)&&f.push(t.createTextNode(We.exec(r)[0])),!ne.tbody)for(r="table"!==l||Fe.test(r)?"<table>"!==c[1]||Fe.test(r)?0:a:a.firstChild,i=r&&r.childNodes.length;i--;)ie.nodeName(u=r.childNodes[i],"tbody")&&!u.childNodes.length&&r.removeChild(u);for(ie.merge(f,a.childNodes),a.textContent="";a.firstChild;)a.removeChild(a.firstChild);a=h.lastChild}else f.push(t.createTextNode(r));for(a&&h.removeChild(a),ne.appendChecked||ie.grep(m(f,"input"),v),p=0;r=f[p++];)if((!o||-1===ie.inArray(r,o))&&(s=ie.contains(r.ownerDocument,r),a=m(h.appendChild(r),"script"),s&&C(a),n))for(i=0;r=a[i++];)Ue.test(r.type||"")&&n.push(r);return a=null,h},cleanData:function(e,t){for(var n,o,i,r,s=0,a=ie.expando,l=ie.cache,u=ne.deleteExpando,c=ie.event.special;null!=(n=e[s]);s++)if((t||ie.acceptData(n))&&(i=n[a],r=i&&l[i])){if(r.events)for(o in r.events)c[o]?ie.event.remove(n,o):ie.removeEvent(n,o,r.handle);l[i]&&(delete l[i],u?delete n[a]:typeof n.removeAttribute!==_e?n.removeAttribute(a):n[a]=null,q.push(i))}}}),ie.fn.extend({text:function(e){return Oe(this,function(e){return void 0===e?ie.text(this):this.empty().append((this[0]&&this[0].ownerDocument||pe).createTextNode(e))},null,e,arguments.length)},append:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){w(this,e).appendChild(e)}})},prepend:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var t=w(this,e);t.insertBefore(e,t.firstChild)}})},before:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this)})},after:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this.nextSibling)})},remove:function(e,t){for(var n,o=e?ie.filter(e,this):this,i=0;null!=(n=o[i]);i++)t||1!==n.nodeType||ie.cleanData(m(n)),n.parentNode&&(t&&ie.contains(n.ownerDocument,n)&&C(m(n,"script")),n.parentNode.removeChild(n));return this},empty:function(){for(var e,t=0;null!=(e=this[t]);t++){for(1===e.nodeType&&ie.cleanData(m(e,!1));e.firstChild;)e.removeChild(e.firstChild);e.options&&ie.nodeName(e,"select")&&(e.options.length=0)}return this},clone:function(e,t){return e=null!=e&&e,t=null==t?e:t,this.map(function(){return ie.clone(this,e,t)})},html:function(e){return Oe(this,function(e){var t=this[0]||{},n=0,o=this.length;if(void 0===e)return 1===t.nodeType?t.innerHTML.replace(Le,""):void 0;if(!("string"!=typeof e||ze.test(e)||!ne.htmlSerialize&&Ie.test(e)||!ne.leadingWhitespace&&We.test(e)||qe[(Be.exec(e)||["",""])[1].toLowerCase()])){e=e.replace(je,"<$1></$2>");try{for(;o>n;n++)t=this[n]||{},1===t.nodeType&&(ie.cleanData(m(t,!1)),t.innerHTML=e);t=0}catch(e){}}t&&this.empty().append(e)},null,e,arguments.length)},replaceWith:function(){var e=arguments[0];return this.domManip(arguments,function(t){e=this.parentNode,ie.cleanData(m(this)),e&&e.replaceChild(t,this)}),e&&(e.length||e.nodeType)?this:this.remove()},detach:function(e){return this.remove(e,!0)},domManip:function(e,t){e=X.apply([],e);var n,o,i,r,s,a,l=0,u=this.length,c=this,d=u-1,h=e[0],f=ie.isFunction(h);if(f||u>1&&"string"==typeof h&&!ne.checkClone&&Ye.test(h))return this.each(function(n){var o=c.eq(n);f&&(e[0]=h.call(this,n,o.html())),o.domManip(e,t)});if(u&&(a=ie.buildFragment(e,this[0].ownerDocument,!1,this),n=a.firstChild,1===a.childNodes.length&&(a=n),n)){for(r=ie.map(m(a,"script"),y),i=r.length;u>l;l++)o=a,l!==d&&(o=ie.clone(o,!0,!0),i&&ie.merge(r,m(o,"script"))),t.call(this[l],o,l);if(i)for(s=r[r.length-1].ownerDocument,ie.map(r,b),l=0;i>l;l++)o=r[l],Ue.test(o.type||"")&&!ie._data(o,"globalEval")&&ie.contains(s,o)&&(o.src?ie._evalUrl&&ie._evalUrl(o.src):ie.globalEval((o.text||o.textContent||o.innerHTML||"").replace($e,"")));a=n=null}return this}}),ie.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(e,t){ie.fn[e]=function(e){for(var n,o=0,i=[],r=ie(e),s=r.length-1;s>=o;o++)n=o===s?this:this.clone(!0),ie(r[o])[t](n),J.apply(i,n.get());return this.pushStack(i)}});var Je,Ze={};!function(){var e;ne.shrinkWrapBlocks=function(){if(null!=e)return e;e=!1;var t,n,o;return n=pe.getElementsByTagName("body")[0],n&&n.style?(t=pe.createElement("div"),o=pe.createElement("div"),o.style.cssText="position:absolute;border:0;width:0;height:0;top:0;left:-9999px",n.appendChild(o).appendChild(t),typeof t.style.zoom!==_e&&(t.style.cssText="-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;display:block;margin:0;border:0;padding:1px;width:1px;zoom:1",t.appendChild(pe.createElement("div")).style.width="5px",e=3!==t.offsetWidth),n.removeChild(o),e):void 0}}();var Qe,et,tt=/^margin/,nt=new RegExp("^("+Ee+")(?!px)[a-z%]+$","i"),ot=/^(top|right|bottom|left)$/;e.getComputedStyle?(Qe=function(t){return t.ownerDocument.defaultView.opener?t.ownerDocument.defaultView.getComputedStyle(t,null):e.getComputedStyle(t,null)},et=function(e,t,n){var o,i,r,s,a=e.style;return n=n||Qe(e),s=n?n.getPropertyValue(t)||n[t]:void 0,n&&(""!==s||ie.contains(e.ownerDocument,e)||(s=ie.style(e,t)),nt.test(s)&&tt.test(t)&&(o=a.width,i=a.minWidth,r=a.maxWidth,a.minWidth=a.maxWidth=a.width=s,s=n.width,a.width=o,a.minWidth=i,
 a.maxWidth=r)),void 0===s?s:s+""}):pe.documentElement.currentStyle&&(Qe=function(e){return e.currentStyle},et=function(e,t,n){var o,i,r,s,a=e.style;return n=n||Qe(e),s=n?n[t]:void 0,null==s&&a&&a[t]&&(s=a[t]),nt.test(s)&&!ot.test(t)&&(o=a.left,i=e.runtimeStyle,r=i&&i.left,r&&(i.left=e.currentStyle.left),a.left="fontSize"===t?"1em":s,s=a.pixelLeft+"px",a.left=o,r&&(i.left=r)),void 0===s?s:s+""||"auto"}),!function(){function t(){var t,n,o,i;(n=pe.getElementsByTagName("body")[0])&&n.style&&(t=pe.createElement("div"),o=pe.createElement("div"),o.style.cssText="position:absolute;border:0;width:0;height:0;top:0;left:-9999px",n.appendChild(o).appendChild(t),t.style.cssText="-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:block;margin-top:1%;top:1%;border:1px;padding:1px;width:4px;position:absolute",r=s=!1,l=!0,e.getComputedStyle&&(r="1%"!==(e.getComputedStyle(t,null)||{}).top,s="4px"===(e.getComputedStyle(t,null)||{width:"4px"}).width,i=t.appendChild(pe.createElement("div")),i.style.cssText=t.style.cssText="-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;display:block;margin:0;border:0;padding:0",i.style.marginRight=i.style.width="0",t.style.width="1px",l=!parseFloat((e.getComputedStyle(i,null)||{}).marginRight),t.removeChild(i)),t.innerHTML="<table><tr><td></td><td>t</td></tr></table>",i=t.getElementsByTagName("td"),i[0].style.cssText="margin:0;border:0;padding:0;display:none",a=0===i[0].offsetHeight,a&&(i[0].style.display="",i[1].style.display="none",a=0===i[0].offsetHeight),n.removeChild(o))}var n,o,i,r,s,a,l;n=pe.createElement("div"),n.innerHTML="  <link/><table></table><a href='/a'>a</a><input type='checkbox'/>",i=n.getElementsByTagName("a")[0],(o=i&&i.style)&&(o.cssText="float:left;opacity:.5",ne.opacity="0.5"===o.opacity,ne.cssFloat=!!o.cssFloat,n.style.backgroundClip="content-box",n.cloneNode(!0).style.backgroundClip="",ne.clearCloneStyle="content-box"===n.style.backgroundClip,ne.boxSizing=""===o.boxSizing||""===o.MozBoxSizing||""===o.WebkitBoxSizing,ie.extend(ne,{reliableHiddenOffsets:function(){return null==a&&t(),a},boxSizingReliable:function(){return null==s&&t(),s},pixelPosition:function(){return null==r&&t(),r},reliableMarginRight:function(){return null==l&&t(),l}}))}(),ie.swap=function(e,t,n,o){var i,r,s={};for(r in t)s[r]=e.style[r],e.style[r]=t[r];i=n.apply(e,o||[]);for(r in t)e.style[r]=s[r];return i};var it=/alpha\([^)]*\)/i,rt=/opacity\s*=\s*([^)]*)/,st=/^(none|table(?!-c[ea]).+)/,at=new RegExp("^("+Ee+")(.*)$","i"),lt=new RegExp("^([+-])=("+Ee+")","i"),ut={position:"absolute",visibility:"hidden",display:"block"},ct={letterSpacing:"0",fontWeight:"400"},dt=["Webkit","O","Moz","ms"];ie.extend({cssHooks:{opacity:{get:function(e,t){if(t){var n=et(e,"opacity");return""===n?"1":n}}}},cssNumber:{columnCount:!0,fillOpacity:!0,flexGrow:!0,flexShrink:!0,fontWeight:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,widows:!0,zIndex:!0,zoom:!0},cssProps:{float:ne.cssFloat?"cssFloat":"styleFloat"},style:function(e,t,n,o){if(e&&3!==e.nodeType&&8!==e.nodeType&&e.style){var i,r,s,a=ie.camelCase(t),l=e.style;if(t=ie.cssProps[a]||(ie.cssProps[a]=M(l,a)),s=ie.cssHooks[t]||ie.cssHooks[a],void 0===n)return s&&"get"in s&&void 0!==(i=s.get(e,!1,o))?i:l[t];if(r=typeof n,"string"===r&&(i=lt.exec(n))&&(n=(i[1]+1)*i[2]+parseFloat(ie.css(e,t)),r="number"),null!=n&&n===n&&("number"!==r||ie.cssNumber[a]||(n+="px"),ne.clearCloneStyle||""!==n||0!==t.indexOf("background")||(l[t]="inherit"),!(s&&"set"in s&&void 0===(n=s.set(e,n,o)))))try{l[t]=n}catch(e){}}},css:function(e,t,n,o){var i,r,s,a=ie.camelCase(t);return t=ie.cssProps[a]||(ie.cssProps[a]=M(e.style,a)),s=ie.cssHooks[t]||ie.cssHooks[a],s&&"get"in s&&(r=s.get(e,!0,n)),void 0===r&&(r=et(e,t,o)),"normal"===r&&t in ct&&(r=ct[t]),""===n||n?(i=parseFloat(r),!0===n||ie.isNumeric(i)?i||0:r):r}}),ie.each(["height","width"],function(e,t){ie.cssHooks[t]={get:function(e,n,o){return n?st.test(ie.css(e,"display"))&&0===e.offsetWidth?ie.swap(e,ut,function(){return D(e,t,o)}):D(e,t,o):void 0},set:function(e,n,o){var i=o&&Qe(e);return k(e,n,o?x(e,t,o,ne.boxSizing&&"border-box"===ie.css(e,"boxSizing",!1,i),i):0)}}}),ne.opacity||(ie.cssHooks.opacity={get:function(e,t){return rt.test((t&&e.currentStyle?e.currentStyle.filter:e.style.filter)||"")?.01*parseFloat(RegExp.$1)+"":t?"1":""},set:function(e,t){var n=e.style,o=e.currentStyle,i=ie.isNumeric(t)?"alpha(opacity="+100*t+")":"",r=o&&o.filter||n.filter||"";n.zoom=1,(t>=1||""===t)&&""===ie.trim(r.replace(it,""))&&n.removeAttribute&&(n.removeAttribute("filter"),""===t||o&&!o.filter)||(n.filter=it.test(r)?r.replace(it,i):r+" "+i)}}),ie.cssHooks.marginRight=R(ne.reliableMarginRight,function(e,t){return t?ie.swap(e,{display:"inline-block"},et,[e,"marginRight"]):void 0}),ie.each({margin:"",padding:"",border:"Width"},function(e,t){ie.cssHooks[e+t]={expand:function(n){for(var o=0,i={},r="string"==typeof n?n.split(" "):[n];4>o;o++)i[e+Re[o]+t]=r[o]||r[o-2]||r[0];return i}},tt.test(e)||(ie.cssHooks[e+t].set=k)}),ie.fn.extend({css:function(e,t){return Oe(this,function(e,t,n){var o,i,r={},s=0;if(ie.isArray(t)){for(o=Qe(e),i=t.length;i>s;s++)r[t[s]]=ie.css(e,t[s],!1,o);return r}return void 0!==n?ie.style(e,t,n):ie.css(e,t)},e,t,arguments.length>1)},show:function(){return O(this,!0)},hide:function(){return O(this)},toggle:function(e){return"boolean"==typeof e?e?this.show():this.hide():this.each(function(){Me(this)?ie(this).show():ie(this).hide()})}}),ie.Tween=A,A.prototype={constructor:A,init:function(e,t,n,o,i,r){this.elem=e,this.prop=n,this.easing=i||"swing",this.options=t,this.start=this.now=this.cur(),this.end=o,this.unit=r||(ie.cssNumber[n]?"":"px")},cur:function(){var e=A.propHooks[this.prop];return e&&e.get?e.get(this):A.propHooks._default.get(this)},run:function(e){var t,n=A.propHooks[this.prop];return this.options.duration?this.pos=t=ie.easing[this.easing](e,this.options.duration*e,0,1,this.options.duration):this.pos=t=e,this.now=(this.end-this.start)*t+this.start,this.options.step&&this.options.step.call(this.elem,this.now,this),n&&n.set?n.set(this):A.propHooks._default.set(this),this}},A.prototype.init.prototype=A.prototype,A.propHooks={_default:{get:function(e){var t;return null==e.elem[e.prop]||e.elem.style&&null!=e.elem.style[e.prop]?(t=ie.css(e.elem,e.prop,""),t&&"auto"!==t?t:0):e.elem[e.prop]},set:function(e){ie.fx.step[e.prop]?ie.fx.step[e.prop](e):e.elem.style&&(null!=e.elem.style[ie.cssProps[e.prop]]||ie.cssHooks[e.prop])?ie.style(e.elem,e.prop,e.now+e.unit):e.elem[e.prop]=e.now}}},A.propHooks.scrollTop=A.propHooks.scrollLeft={set:function(e){e.elem.nodeType&&e.elem.parentNode&&(e.elem[e.prop]=e.now)}},ie.easing={linear:function(e){return e},swing:function(e){return.5-Math.cos(e*Math.PI)/2}},ie.fx=A.prototype.init,ie.fx.step={};var ht,ft,pt=/^(?:toggle|show|hide)$/,gt=new RegExp("^(?:([+-])=|)("+Ee+")([a-z%]*)$","i"),mt=/queueHooks$/,vt=[L],wt={"*":[function(e,t){var n=this.createTween(e,t),o=n.cur(),i=gt.exec(t),r=i&&i[3]||(ie.cssNumber[e]?"":"px"),s=(ie.cssNumber[e]||"px"!==r&&+o)&&gt.exec(ie.css(n.elem,e)),a=1,l=20;if(s&&s[3]!==r){r=r||s[3],i=i||[],s=+o||1;do{a=a||".5",s/=a,ie.style(n.elem,e,s+r)}while(a!==(a=n.cur()/o)&&1!==a&&--l)}return i&&(s=n.start=+s||+o||0,n.unit=r,n.end=i[1]?s+(i[1]+1)*i[2]:+i[2]),n}]};ie.Animation=ie.extend(W,{tweener:function(e,t){ie.isFunction(e)?(t=e,e=["*"]):e=e.split(" ");for(var n,o=0,i=e.length;i>o;o++)n=e[o],wt[n]=wt[n]||[],wt[n].unshift(t)},prefilter:function(e,t){t?vt.unshift(e):vt.push(e)}}),ie.speed=function(e,t,n){var o=e&&"object"==typeof e?ie.extend({},e):{complete:n||!n&&t||ie.isFunction(e)&&e,duration:e,easing:n&&t||t&&!ie.isFunction(t)&&t};return o.duration=ie.fx.off?0:"number"==typeof o.duration?o.duration:o.duration in ie.fx.speeds?ie.fx.speeds[o.duration]:ie.fx.speeds._default,(null==o.queue||!0===o.queue)&&(o.queue="fx"),o.old=o.complete,o.complete=function(){ie.isFunction(o.old)&&o.old.call(this),o.queue&&ie.dequeue(this,o.queue)},o},ie.fn.extend({fadeTo:function(e,t,n,o){return this.filter(Me).css("opacity",0).show().end().animate({opacity:t},e,n,o)},animate:function(e,t,n,o){var i=ie.isEmptyObject(e),r=ie.speed(t,n,o),s=function(){var t=W(this,ie.extend({},e),r);(i||ie._data(this,"finish"))&&t.stop(!0)};return s.finish=s,i||!1===r.queue?this.each(s):this.queue(r.queue,s)},stop:function(e,t,n){var o=function(e){var t=e.stop;delete e.stop,t(n)};return"string"!=typeof e&&(n=t,t=e,e=void 0),t&&!1!==e&&this.queue(e||"fx",[]),this.each(function(){var t=!0,i=null!=e&&e+"queueHooks",r=ie.timers,s=ie._data(this);if(i)s[i]&&s[i].stop&&o(s[i]);else for(i in s)s[i]&&s[i].stop&&mt.test(i)&&o(s[i]);for(i=r.length;i--;)r[i].elem!==this||null!=e&&r[i].queue!==e||(r[i].anim.stop(n),t=!1,r.splice(i,1));(t||!n)&&ie.dequeue(this,e)})},finish:function(e){return!1!==e&&(e=e||"fx"),this.each(function(){var t,n=ie._data(this),o=n[e+"queue"],i=n[e+"queueHooks"],r=ie.timers,s=o?o.length:0;for(n.finish=!0,ie.queue(this,e,[]),i&&i.stop&&i.stop.call(this,!0),t=r.length;t--;)r[t].elem===this&&r[t].queue===e&&(r[t].anim.stop(!0),r.splice(t,1));for(t=0;s>t;t++)o[t]&&o[t].finish&&o[t].finish.call(this);delete n.finish})}}),ie.each(["toggle","show","hide"],function(e,t){var n=ie.fn[t];ie.fn[t]=function(e,o,i){return null==e||"boolean"==typeof e?n.apply(this,arguments):this.animate(H(t,!0),e,o,i)}}),ie.each({slideDown:H("show"),slideUp:H("hide"),slideToggle:H("toggle"),fadeIn:{opacity:"show"},fadeOut:{opacity:"hide"},fadeToggle:{opacity:"toggle"}},function(e,t){ie.fn[e]=function(e,n,o){return this.animate(t,e,n,o)}}),ie.timers=[],ie.fx.tick=function(){var e,t=ie.timers,n=0;for(ht=ie.now();n<t.length;n++)(e=t[n])()||t[n]!==e||t.splice(n--,1);t.length||ie.fx.stop(),ht=void 0},ie.fx.timer=function(e){ie.timers.push(e),e()?ie.fx.start():ie.timers.pop()},ie.fx.interval=13,ie.fx.start=function(){ft||(ft=setInterval(ie.fx.tick,ie.fx.interval))},ie.fx.stop=function(){clearInterval(ft),ft=null},ie.fx.speeds={slow:600,fast:200,_default:400},ie.fn.delay=function(e,t){return e=ie.fx?ie.fx.speeds[e]||e:e,t=t||"fx",this.queue(t,function(t,n){var o=setTimeout(t,e);n.stop=function(){clearTimeout(o)}})},function(){var e,t,n,o,i;t=pe.createElement("div"),t.setAttribute("className","t"),t.innerHTML="  <link/><table></table><a href='/a'>a</a><input type='checkbox'/>",o=t.getElementsByTagName("a")[0],n=pe.createElement("select"),i=n.appendChild(pe.createElement("option")),e=t.getElementsByTagName("input")[0],o.style.cssText="top:1px",ne.getSetAttribute="t"!==t.className,ne.style=/top/.test(o.getAttribute("style")),ne.hrefNormalized="/a"===o.getAttribute("href"),ne.checkOn=!!e.value,ne.optSelected=i.selected,ne.enctype=!!pe.createElement("form").enctype,n.disabled=!0,ne.optDisabled=!i.disabled,e=pe.createElement("input"),e.setAttribute("value",""),ne.input=""===e.getAttribute("value"),e.value="t",e.setAttribute("type","radio"),ne.radioValue="t"===e.value}();var yt=/\r/g;ie.fn.extend({val:function(e){var t,n,o,i=this[0];return arguments.length?(o=ie.isFunction(e),this.each(function(n){var i;1===this.nodeType&&(i=o?e.call(this,n,ie(this).val()):e,null==i?i="":"number"==typeof i?i+="":ie.isArray(i)&&(i=ie.map(i,function(e){return null==e?"":e+""})),(t=ie.valHooks[this.type]||ie.valHooks[this.nodeName.toLowerCase()])&&"set"in t&&void 0!==t.set(this,i,"value")||(this.value=i))})):i?(t=ie.valHooks[i.type]||ie.valHooks[i.nodeName.toLowerCase()],t&&"get"in t&&void 0!==(n=t.get(i,"value"))?n:(n=i.value,"string"==typeof n?n.replace(yt,""):null==n?"":n)):void 0}}),ie.extend({valHooks:{option:{get:function(e){var t=ie.find.attr(e,"value");return null!=t?t:ie.trim(ie.text(e))}},select:{get:function(e){for(var t,n,o=e.options,i=e.selectedIndex,r="select-one"===e.type||0>i,s=r?null:[],a=r?i+1:o.length,l=0>i?a:r?i:0;a>l;l++)if(n=o[l],!(!n.selected&&l!==i||(ne.optDisabled?n.disabled:null!==n.getAttribute("disabled"))||n.parentNode.disabled&&ie.nodeName(n.parentNode,"optgroup"))){if(t=ie(n).val(),r)return t;s.push(t)}return s},set:function(e,t){for(var n,o,i=e.options,r=ie.makeArray(t),s=i.length;s--;)if(o=i[s],ie.inArray(ie.valHooks.option.get(o),r)>=0)try{o.selected=n=!0}catch(e){o.scrollHeight}else o.selected=!1;return n||(e.selectedIndex=-1),i}}}}),ie.each(["radio","checkbox"],function(){ie.valHooks[this]={set:function(e,t){return ie.isArray(t)?e.checked=ie.inArray(ie(e).val(),t)>=0:void 0}},ne.checkOn||(ie.valHooks[this].get=function(e){return null===e.getAttribute("value")?"on":e.value})});var bt,Ct,_t=ie.expr.attrHandle,St=/^(?:checked|selected)$/i,Tt=ne.getSetAttribute,Et=ne.input;ie.fn.extend({attr:function(e,t){return Oe(this,ie.attr,e,t,arguments.length>1)},removeAttr:function(e){return this.each(function(){ie.removeAttr(this,e)})}}),ie.extend({attr:function(e,t,n){var o,i,r=e.nodeType;if(e&&3!==r&&8!==r&&2!==r)return typeof e.getAttribute===_e?ie.prop(e,t,n):(1===r&&ie.isXMLDoc(e)||(t=t.toLowerCase(),o=ie.attrHooks[t]||(ie.expr.match.bool.test(t)?Ct:bt)),void 0===n?o&&"get"in o&&null!==(i=o.get(e,t))?i:(i=ie.find.attr(e,t),null==i?void 0:i):null!==n?o&&"set"in o&&void 0!==(i=o.set(e,n,t))?i:(e.setAttribute(t,n+""),n):void ie.removeAttr(e,t))},removeAttr:function(e,t){var n,o,i=0,r=t&&t.match(we);if(r&&1===e.nodeType)for(;n=r[i++];)o=ie.propFix[n]||n,ie.expr.match.bool.test(n)?Et&&Tt||!St.test(n)?e[o]=!1:e[ie.camelCase("default-"+n)]=e[o]=!1:ie.attr(e,n,""),e.removeAttribute(Tt?n:o)},attrHooks:{type:{set:function(e,t){if(!ne.radioValue&&"radio"===t&&ie.nodeName(e,"input")){var n=e.value;return e.setAttribute("type",t),n&&(e.value=n),t}}}}}),Ct={set:function(e,t,n){return!1===t?ie.removeAttr(e,n):Et&&Tt||!St.test(n)?e.setAttribute(!Tt&&ie.propFix[n]||n,n):e[ie.camelCase("default-"+n)]=e[n]=!0,n}},ie.each(ie.expr.match.bool.source.match(/\w+/g),function(e,t){var n=_t[t]||ie.find.attr;_t[t]=Et&&Tt||!St.test(t)?function(e,t,o){var i,r;return o||(r=_t[t],_t[t]=i,i=null!=n(e,t,o)?t.toLowerCase():null,_t[t]=r),i}:function(e,t,n){return n?void 0:e[ie.camelCase("default-"+t)]?t.toLowerCase():null}}),Et&&Tt||(ie.attrHooks.value={set:function(e,t,n){return ie.nodeName(e,"input")?void(e.defaultValue=t):bt&&bt.set(e,t,n)}}),Tt||(bt={set:function(e,t,n){var o=e.getAttributeNode(n);return o||e.setAttributeNode(o=e.ownerDocument.createAttribute(n)),o.value=t+="","value"===n||t===e.getAttribute(n)?t:void 0}},_t.id=_t.name=_t.coords=function(e,t,n){var o;return n?void 0:(o=e.getAttributeNode(t))&&""!==o.value?o.value:null},ie.valHooks.button={get:function(e,t){var n=e.getAttributeNode(t);return n&&n.specified?n.value:void 0},set:bt.set},ie.attrHooks.contenteditable={set:function(e,t,n){bt.set(e,""!==t&&t,n)}},ie.each(["width","height"],function(e,t){ie.attrHooks[t]={set:function(e,n){return""===n?(e.setAttribute(t,"auto"),n):void 0}}})),ne.style||(ie.attrHooks.style={get:function(e){return e.style.cssText||void 0},set:function(e,t){return e.style.cssText=t+""}});var Rt=/^(?:input|select|textarea|button|object)$/i,Mt=/^(?:a|area)$/i;ie.fn.extend({prop:function(e,t){return Oe(this,ie.prop,e,t,arguments.length>1)},removeProp:function(e){return e=ie.propFix[e]||e,this.each(function(){try{this[e]=void 0,delete this[e]}catch(e){}})}}),ie.extend({propFix:{for:"htmlFor",class:"className"},prop:function(e,t,n){var o,i,r,s=e.nodeType;if(e&&3!==s&&8!==s&&2!==s)return r=1!==s||!ie.isXMLDoc(e),r&&(t=ie.propFix[t]||t,i=ie.propHooks[t]),void 0!==n?i&&"set"in i&&void 0!==(o=i.set(e,n,t))?o:e[t]=n:i&&"get"in i&&null!==(o=i.get(e,t))?o:e[t]},propHooks:{tabIndex:{get:function(e){var t=ie.find.attr(e,"tabindex");return t?parseInt(t,10):Rt.test(e.nodeName)||Mt.test(e.nodeName)&&e.href?0:-1}}}}),ne.hrefNormalized||ie.each(["href","src"],function(e,t){ie.propHooks[t]={get:function(e){return e.getAttribute(t,4)}}}),ne.optSelected||(ie.propHooks.selected={get:function(e){var t=e.parentNode;return t&&(t.selectedIndex,t.parentNode&&t.parentNode.selectedIndex),null}}),ie.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){ie.propFix[this.toLowerCase()]=this}),ne.enctype||(ie.propFix.enctype="encoding");var Ot=/[\t\r\n\f]/g;ie.fn.extend({addClass:function(e){var t,n,o,i,r,s,a=0,l=this.length,u="string"==typeof e&&e;if(ie.isFunction(e))return this.each(function(t){ie(this).addClass(e.call(this,t,this.className))});if(u)for(t=(e||"").match(we)||[];l>a;a++)if(n=this[a],o=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(Ot," "):" ")){for(r=0;i=t[r++];)o.indexOf(" "+i+" ")<0&&(o+=i+" ");s=ie.trim(o),n.className!==s&&(n.className=s)}return this},removeClass:function(e){var t,n,o,i,r,s,a=0,l=this.length,u=0===arguments.length||"string"==typeof e&&e;if(ie.isFunction(e))return this.each(function(t){ie(this).removeClass(e.call(this,t,this.className))});if(u)for(t=(e||"").match(we)||[];l>a;a++)if(n=this[a],o=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(Ot," "):"")){for(r=0;i=t[r++];)for(;o.indexOf(" "+i+" ")>=0;)o=o.replace(" "+i+" "," ");s=e?ie.trim(o):"",n.className!==s&&(n.className=s)}return this},toggleClass:function(e,t){var n=typeof e;return"boolean"==typeof t&&"string"===n?t?this.addClass(e):this.removeClass(e):this.each(ie.isFunction(e)?function(n){ie(this).toggleClass(e.call(this,n,this.className,t),t)}:function(){if("string"===n)for(var t,o=0,i=ie(this),r=e.match(we)||[];t=r[o++];)i.hasClass(t)?i.removeClass(t):i.addClass(t);else(n===_e||"boolean"===n)&&(this.className&&ie._data(this,"__className__",this.className),this.className=this.className||!1===e?"":ie._data(this,"__className__")||"")})},hasClass:function(e){for(var t=" "+e+" ",n=0,o=this.length;o>n;n++)if(1===this[n].nodeType&&(" "+this[n].className+" ").replace(Ot," ").indexOf(t)>=0)return!0;return!1}}),ie.each("blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error contextmenu".split(" "),function(e,t){ie.fn[t]=function(e,n){return arguments.length>0?this.on(t,null,e,n):this.trigger(t)}}),ie.fn.extend({hover:function(e,t){return this.mouseenter(e).mouseleave(t||e)},bind:function(e,t,n){return this.on(e,null,t,n)},unbind:function(e,t){return this.off(e,null,t)},delegate:function(e,t,n,o){return this.on(t,e,n,o)},undelegate:function(e,t,n){return 1===arguments.length?this.off(e,"**"):this.off(t,e||"**",n)}});var kt=ie.now(),xt=/\?/,Dt=/(,)|(\[|{)|(}|])|"(?:[^"\\\r\n]|\\["\\\/bfnrt]|\\u[\da-fA-F]{4})*"\s*:?|true|false|null|-?(?!0\d)\d+(?:\.\d+|)(?:[eE][+-]?\d+|)/g;ie.parseJSON=function(t){if(e.JSON&&e.JSON.parse)return e.JSON.parse(t+"");var n,o=null,i=ie.trim(t+"");return i&&!ie.trim(i.replace(Dt,function(e,t,i,r){return n&&t&&(o=0),0===o?e:(n=i||t,o+=!r-!i,"")}))?Function("return "+i)():ie.error("Invalid JSON: "+t)},ie.parseXML=function(t){var n,o;if(!t||"string"!=typeof t)return null;try{e.DOMParser?(o=new DOMParser,n=o.parseFromString(t,"text/xml")):(n=new ActiveXObject("Microsoft.XMLDOM"),n.async="false",n.loadXML(t))}catch(e){n=void 0}return n&&n.documentElement&&!n.getElementsByTagName("parsererror").length||ie.error("Invalid XML: "+t),n};var At,Pt,Ht=/#.*$/,Nt=/([?&])_=[^&]*/,Lt=/^(.*?):[ \t]*([^\r\n]*)\r?$/gm,It=/^(?:about|app|app-storage|.+-extension|file|res|widget):$/,Wt=/^(?:GET|HEAD)$/,jt=/^\/\//,Bt=/^([\w.+-]+:)(?:\/\/(?:[^\/?#]*@|)([^\/?#:]*)(?::(\d+)|)|)/,Ft={},Vt={},zt="*/".concat("*");try{Pt=location.href}catch(e){Pt=pe.createElement("a"),Pt.href="",Pt=Pt.href}At=Bt.exec(Pt.toLowerCase())||[],ie.extend({active:0,lastModified:{},etag:{},ajaxSettings:{url:Pt,type:"GET",isLocal:It.test(At[1]),global:!0,processData:!0,async:!0,contentType:"application/x-www-form-urlencoded; charset=UTF-8",accepts:{"*":zt,text:"text/plain",html:"text/html",xml:"application/xml, text/xml",json:"application/json, text/javascript"},contents:{xml:/xml/,html:/html/,json:/json/},responseFields:{xml:"responseXML",text:"responseText",json:"responseJSON"},converters:{"* text":String,"text html":!0,"text json":ie.parseJSON,"text xml":ie.parseXML},flatOptions:{url:!0,context:!0}},ajaxSetup:function(e,t){return t?F(F(e,ie.ajaxSettings),t):F(ie.ajaxSettings,e)},ajaxPrefilter:j(Ft),ajaxTransport:j(Vt),ajax:function(e,t){function n(e,t,n,o){var i,c,v,w,b,_=t;2!==y&&(y=2,a&&clearTimeout(a),u=void 0,s=o||"",C.readyState=e>0?4:0,i=e>=200&&300>e||304===e,n&&(w=V(d,C,n)),w=z(d,w,C,i),i?(d.ifModified&&(b=C.getResponseHeader("Last-Modified"),b&&(ie.lastModified[r]=b),(b=C.getResponseHeader("etag"))&&(ie.etag[r]=b)),204===e||"HEAD"===d.type?_="nocontent":304===e?_="notmodified":(_=w.state,c=w.data,v=w.error,i=!v)):(v=_,(e||!_)&&(_="error",0>e&&(e=0))),C.status=e,C.statusText=(t||_)+"",i?p.resolveWith(h,[c,_,C]):p.rejectWith(h,[C,_,v]),C.statusCode(m),m=void 0,l&&f.trigger(i?"ajaxSuccess":"ajaxError",[C,d,i?c:v]),g.fireWith(h,[C,_]),l&&(f.trigger("ajaxComplete",[C,d]),--ie.active||ie.event.trigger("ajaxStop")))}"object"==typeof e&&(t=e,e=void 0),t=t||{};var o,i,r,s,a,l,u,c,d=ie.ajaxSetup({},t),h=d.context||d,f=d.context&&(h.nodeType||h.jquery)?ie(h):ie.event,p=ie.Deferred(),g=ie.Callbacks("once memory"),m=d.statusCode||{},v={},w={},y=0,b="canceled",C={readyState:0,getResponseHeader:function(e){var t;if(2===y){if(!c)for(c={};t=Lt.exec(s);)c[t[1].toLowerCase()]=t[2];t=c[e.toLowerCase()]}return null==t?null:t},getAllResponseHeaders:function(){return 2===y?s:null},setRequestHeader:function(e,t){var n=e.toLowerCase();return y||(e=w[n]=w[n]||e,v[e]=t),this},overrideMimeType:function(e){return y||(d.mimeType=e),this},statusCode:function(e){var t;if(e)if(2>y)for(t in e)m[t]=[m[t],e[t]];else C.always(e[C.status]);return this},abort:function(e){var t=e||b;return u&&u.abort(t),n(0,t),this}};if(p.promise(C).complete=g.add,C.success=C.done,C.error=C.fail,d.url=((e||d.url||Pt)+"").replace(Ht,"").replace(jt,At[1]+"//"),d.type=t.method||t.type||d.method||d.type,d.dataTypes=ie.trim(d.dataType||"*").toLowerCase().match(we)||[""],null==d.crossDomain&&(o=Bt.exec(d.url.toLowerCase()),d.crossDomain=!(!o||o[1]===At[1]&&o[2]===At[2]&&(o[3]||("http:"===o[1]?"80":"443"))===(At[3]||("http:"===At[1]?"80":"443")))),d.data&&d.processData&&"string"!=typeof d.data&&(d.data=ie.param(d.data,d.traditional)),B(Ft,d,t,C),2===y)return C;l=ie.event&&d.global,l&&0==ie.active++&&ie.event.trigger("ajaxStart"),d.type=d.type.toUpperCase(),d.hasContent=!Wt.test(d.type),r=d.url,d.hasContent||(d.data&&(r=d.url+=(xt.test(r)?"&":"?")+d.data,delete d.data),!1===d.cache&&(d.url=Nt.test(r)?r.replace(Nt,"$1_="+kt++):r+(xt.test(r)?"&":"?")+"_="+kt++)),d.ifModified&&(ie.lastModified[r]&&C.setRequestHeader("If-Modified-Since",ie.lastModified[r]),ie.etag[r]&&C.setRequestHeader("If-None-Match",ie.etag[r])),(d.data&&d.hasContent&&!1!==d.contentType||t.contentType)&&C.setRequestHeader("Content-Type",d.contentType),C.setRequestHeader("Accept",d.dataTypes[0]&&d.accepts[d.dataTypes[0]]?d.accepts[d.dataTypes[0]]+("*"!==d.dataTypes[0]?", "+zt+"; q=0.01":""):d.accepts["*"]);for(i in d.headers)C.setRequestHeader(i,d.headers[i]);if(d.beforeSend&&(!1===d.beforeSend.call(h,C,d)||2===y))return C.abort();b="abort";for(i in{success:1,error:1,complete:1})C[i](d[i]);if(u=B(Vt,d,t,C)){C.readyState=1,l&&f.trigger("ajaxSend",[C,d]),d.async&&d.timeout>0&&(a=setTimeout(function(){C.abort("timeout")},d.timeout));try{y=1,u.send(v,n)}catch(e){if(!(2>y))throw e;n(-1,e)}}else n(-1,"No Transport");return C},getJSON:function(e,t,n){return ie.get(e,t,n,"json")},getScript:function(e,t){return ie.get(e,void 0,t,"script")}}),ie.each(["get","post"],function(e,t){ie[t]=function(e,n,o,i){return ie.isFunction(n)&&(i=i||o,o=n,n=void 0),ie.ajax({url:e,type:t,dataType:i,data:n,success:o})}}),ie._evalUrl=function(e){return ie.ajax({url:e,type:"GET",dataType:"script",async:!1,global:!1,throws:!0})},ie.fn.extend({wrapAll:function(e){if(ie.isFunction(e))return this.each(function(t){ie(this).wrapAll(e.call(this,t))});if(this[0]){var t=ie(e,this[0].ownerDocument).eq(0).clone(!0);this[0].parentNode&&t.insertBefore(this[0]),t.map(function(){for(var e=this;e.firstChild&&1===e.firstChild.nodeType;)e=e.firstChild;return e}).append(this)}return this},wrapInner:function(e){return this.each(ie.isFunction(e)?function(t){ie(this).wrapInner(e.call(this,t))}:function(){var t=ie(this),n=t.contents();n.length?n.wrapAll(e):t.append(e)})},wrap:function(e){var t=ie.isFunction(e);return this.each(function(n){ie(this).wrapAll(t?e.call(this,n):e)})},unwrap:function(){return this.parent().each(function(){ie.nodeName(this,"body")||ie(this).replaceWith(this.childNodes)}).end()}}),ie.expr.filters.hidden=function(e){return e.offsetWidth<=0&&e.offsetHeight<=0||!ne.reliableHiddenOffsets()&&"none"===(e.style&&e.style.display||ie.css(e,"display"))},ie.expr.filters.visible=function(e){return!ie.expr.filters.hidden(e)};var Yt=/%20/g,Ut=/\[\]$/,Gt=/\r?\n/g,$t=/^(?:submit|button|image|reset|file)$/i,qt=/^(?:input|select|textarea|keygen)/i;ie.param=function(e,t){var n,o=[],i=function(e,t){t=ie.isFunction(t)?t():null==t?"":t,o[o.length]=encodeURIComponent(e)+"="+encodeURIComponent(t)};if(void 0===t&&(t=ie.ajaxSettings&&ie.ajaxSettings.traditional),ie.isArray(e)||e.jquery&&!ie.isPlainObject(e))ie.each(e,function(){i(this.name,this.value)});else for(n in e)Y(n,e[n],t,i);return o.join("&").replace(Yt,"+")},ie.fn.extend({serialize:function(){return ie.param(this.serializeArray())},serializeArray:function(){return this.map(function(){var e=ie.prop(this,"elements");return e?ie.makeArray(e):this}).filter(function(){var e=this.type;return this.name&&!ie(this).is(":disabled")&&qt.test(this.nodeName)&&!$t.test(e)&&(this.checked||!ke.test(e))}).map(function(e,t){var n=ie(this).val();return null==n?null:ie.isArray(n)?ie.map(n,function(e){return{name:t.name,value:e.replace(Gt,"\r\n")}}):{name:t.name,value:n.replace(Gt,"\r\n")}}).get()}}),ie.ajaxSettings.xhr=void 0!==e.ActiveXObject?function(){return!this.isLocal&&/^(get|post|head|put|delete|options)$/i.test(this.type)&&U()||G()}:U;var Kt=0,Xt={},Jt=ie.ajaxSettings.xhr();e.attachEvent&&e.attachEvent("onunload",function(){for(var e in Xt)Xt[e](void 0,!0)}),ne.cors=!!Jt&&"withCredentials"in Jt,(Jt=ne.ajax=!!Jt)&&ie.ajaxTransport(function(e){if(!e.crossDomain||ne.cors){var t;return{send:function(n,o){var i,r=e.xhr(),s=++Kt;if(r.open(e.type,e.url,e.async,e.username,e.password),e.xhrFields)for(i in e.xhrFields)r[i]=e.xhrFields[i];e.mimeType&&r.overrideMimeType&&r.overrideMimeType(e.mimeType),e.crossDomain||n["X-Requested-With"]||(n["X-Requested-With"]="XMLHttpRequest");for(i in n)void 0!==n[i]&&r.setRequestHeader(i,n[i]+"");r.send(e.hasContent&&e.data||null),t=function(n,i){var a,l,u;if(t&&(i||4===r.readyState))if(delete Xt[s],t=void 0,r.onreadystatechange=ie.noop,i)4!==r.readyState&&r.abort();else{u={},a=r.status,"string"==typeof r.responseText&&(u.text=r.responseText);try{l=r.statusText}catch(e){l=""}a||!e.isLocal||e.crossDomain?1223===a&&(a=204):a=u.text?200:404}u&&o(a,l,u,r.getAllResponseHeaders())},e.async?4===r.readyState?setTimeout(t):r.onreadystatechange=Xt[s]=t:t()},abort:function(){t&&t(void 0,!0)}}}}),ie.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/(?:java|ecma)script/},converters:{"text script":function(e){return ie.globalEval(e),e}}}),ie.ajaxPrefilter("script",function(e){void 0===e.cache&&(e.cache=!1),e.crossDomain&&(e.type="GET",e.global=!1)}),ie.ajaxTransport("script",function(e){if(e.crossDomain){var t,n=pe.head||ie("head")[0]||pe.documentElement;return{send:function(o,i){t=pe.createElement("script"),t.async=!0,e.scriptCharset&&(t.charset=e.scriptCharset),t.src=e.url,t.onload=t.onreadystatechange=function(e,n){(n||!t.readyState||/loaded|complete/.test(t.readyState))&&(t.onload=t.onreadystatechange=null,t.parentNode&&t.parentNode.removeChild(t),t=null,n||i(200,"success"))},n.insertBefore(t,n.firstChild)},abort:function(){t&&t.onload(void 0,!0)}}}});var Zt=[],Qt=/(=)\?(?=&|$)|\?\?/;ie.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Zt.pop()||ie.expando+"_"+kt++;return this[e]=!0,e}}),ie.ajaxPrefilter("json jsonp",function(t,n,o){var i,r,s,a=!1!==t.jsonp&&(Qt.test(t.url)?"url":"string"==typeof t.data&&!(t.contentType||"").indexOf("application/x-www-form-urlencoded")&&Qt.test(t.data)&&"data");return a||"jsonp"===t.dataTypes[0]?(i=t.jsonpCallback=ie.isFunction(t.jsonpCallback)?t.jsonpCallback():t.jsonpCallback,a?t[a]=t[a].replace(Qt,"$1"+i):!1!==t.jsonp&&(t.url+=(xt.test(t.url)?"&":"?")+t.jsonp+"="+i),t.converters["script json"]=function(){return s||ie.error(i+" was not called"),s[0]},t.dataTypes[0]="json",r=e[i],e[i]=function(){s=arguments},o.always(function(){e[i]=r,t[i]&&(t.jsonpCallback=n.jsonpCallback,Zt.push(i)),s&&ie.isFunction(r)&&r(s[0]),s=r=void 0}),"script"):void 0}),ie.parseHTML=function(e,t,n){if(!e||"string"!=typeof e)return null;"boolean"==typeof t&&(n=t,t=!1),t=t||pe;var o=de.exec(e),i=!n&&[];return o?[t.createElement(o[1])]:(o=ie.buildFragment([e],t,i),i&&i.length&&ie(i).remove(),ie.merge([],o.childNodes))};var en=ie.fn.load;ie.fn.load=function(e,t,n){if("string"!=typeof e&&en)return en.apply(this,arguments);var o,i,r,s=this,a=e.indexOf(" ");return a>=0&&(o=ie.trim(e.slice(a,e.length)),e=e.slice(0,a)),ie.isFunction(t)?(n=t,t=void 0):t&&"object"==typeof t&&(r="POST"),s.length>0&&ie.ajax({url:e,type:r,dataType:"html",data:t}).done(function(e){i=arguments,s.html(o?ie("<div>").append(ie.parseHTML(e)).find(o):e)}).complete(n&&function(e,t){s.each(n,i||[e.responseText,t,e])}),this},ie.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){ie.fn[t]=function(e){return this.on(t,e)}}),ie.expr.filters.animated=function(e){return ie.grep(ie.timers,function(t){return e===t.elem}).length};var tn=e.document.documentElement;ie.offset={setOffset:function(e,t,n){var o,i,r,s,a,l,u,c=ie.css(e,"position"),d=ie(e),h={};"static"===c&&(e.style.position="relative"),a=d.offset(),r=ie.css(e,"top"),l=ie.css(e,"left"),u=("absolute"===c||"fixed"===c)&&ie.inArray("auto",[r,l])>-1,u?(o=d.position(),s=o.top,i=o.left):(s=parseFloat(r)||0,i=parseFloat(l)||0),ie.isFunction(t)&&(t=t.call(e,n,a)),null!=t.top&&(h.top=t.top-a.top+s),null!=t.left&&(h.left=t.left-a.left+i),"using"in t?t.using.call(e,h):d.css(h)}},ie.fn.extend({offset:function(e){if(arguments.length)return void 0===e?this:this.each(function(t){ie.offset.setOffset(this,e,t)});var t,n,o={top:0,left:0},i=this[0],r=i&&i.ownerDocument;return r?(t=r.documentElement,ie.contains(t,i)?(typeof i.getBoundingClientRect!==_e&&(o=i.getBoundingClientRect()),n=$(r),{top:o.top+(n.pageYOffset||t.scrollTop)-(t.clientTop||0),left:o.left+(n.pageXOffset||t.scrollLeft)-(t.clientLeft||0)}):o):void 0},position:function(){if(this[0]){var e,t,n={top:0,left:0},o=this[0];return"fixed"===ie.css(o,"position")?t=o.getBoundingClientRect():(e=this.offsetParent(),t=this.offset(),ie.nodeName(e[0],"html")||(n=e.offset()),n.top+=ie.css(e[0],"borderTopWidth",!0),n.left+=ie.css(e[0],"borderLeftWidth",!0)),{top:t.top-n.top-ie.css(o,"marginTop",!0),left:t.left-n.left-ie.css(o,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){for(var e=this.offsetParent||tn;e&&!ie.nodeName(e,"html")&&"static"===ie.css(e,"position");)e=e.offsetParent;return e||tn})}}),ie.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(e,t){var n=/Y/.test(t);ie.fn[e]=function(o){return Oe(this,function(e,o,i){var r=$(e);return void 0===i?r?t in r?r[t]:r.document.documentElement[o]:e[o]:void(r?r.scrollTo(n?ie(r).scrollLeft():i,n?i:ie(r).scrollTop()):e[o]=i)},e,o,arguments.length,null)}}),ie.each(["top","left"],function(e,t){ie.cssHooks[t]=R(ne.pixelPosition,function(e,n){return n?(n=et(e,t),nt.test(n)?ie(e).position()[t]+"px":n):void 0})}),ie.each({Height:"height",Width:"width"},function(e,t){ie.each({padding:"inner"+e,content:t,"":"outer"+e},function(n,o){ie.fn[o]=function(o,i){var r=arguments.length&&(n||"boolean"!=typeof o),s=n||(!0===o||!0===i?"margin":"border");return Oe(this,function(t,n,o){var i
 ;return ie.isWindow(t)?t.document.documentElement["client"+e]:9===t.nodeType?(i=t.documentElement,Math.max(t.body["scroll"+e],i["scroll"+e],t.body["offset"+e],i["offset"+e],i["client"+e])):void 0===o?ie.css(t,n,s):ie.style(t,n,o,s)},t,r?o:void 0,r,null)}})}),ie.fn.size=function(){return this.length},ie.fn.andSelf=ie.fn.addBack,"function"==typeof define&&define.amd&&define("jquery",[],function(){return ie});var nn=e.jQuery,on=e.$;return ie.noConflict=function(t){return e.$===ie&&(e.$=on),t&&e.jQuery===ie&&(e.jQuery=nn),ie},typeof t===_e&&(e.jQuery=e.$=ie),ie}),define("dt/lib/Set",["require","jquery"],function(e){function t(e){return Object(e)===e}var n=e("jquery"),o=function(e){this._valueSet={},this["__isDTLibSet"]=!0,this.reset(e)};return o.getSet=function(e){return o.isSet(e)?e:new o(e)},o.isSet=function(e){return t(e)&&!!e["__isDTLibSet"]},o.prototype={constructor:o,add:function(e){return n.extend(this._valueSet,this._normalize(e)),this},union:function(e){return this.add(e)},reset:function(e){return this._valueSet=this._normalize(e),this},contains:function(e){var t=this._normalize(e);for(var n in t)if(t.hasOwnProperty(n)&&!this._valueSet.hasOwnProperty(n))return!1;return!0},intersects:function(e){var t=this._normalize(e),n=[];for(var i in t)t.hasOwnProperty(i)&&this._valueSet.hasOwnProperty(i)&&n.push(i);return new o(n)},subtracts:function(e){var t=this._normalize(e),n=[];for(var i in this._valueSet)this._valueSet.hasOwnProperty(i)&&!t.hasOwnProperty(i)&&n.push(i);return new o(n)},isEmpty:function(){return 0===this.count()},count:function(){var e=0;for(var t in this._valueSet)this._valueSet.hasOwnProperty(t)&&e++;return e},list:function(){var e=this._valueSet,t=[];for(var n in e)e.hasOwnProperty(n)&&t.push(n);return t},clone:function(){return new o(this)},filter:function(e){var t=this._valueSet,n=[];for(var i in t)t.hasOwnProperty(i)&&e(i)&&n.push(i);return new o(n)},map:function(e){var t=this._valueSet,n=[];for(var i in t)t.hasOwnProperty(i)&&n.push(e(i));return new o(n)},classify:function(e,n){var i=this._valueSet,r={};for(var s in i)if(i.hasOwnProperty(s)){var a=e(s);if(!t(a)){var l={};l[a]=s,a=l}for(var u in a)if(a.hasOwnProperty(u)){var c=r[u]||(r[u]=new o);c.add(a[u])}}for(var d=0,h=(n||[]).length;d<h;d++)r[n[d]]||(r[n[d]]=new o);return r},_normalize:function(e){var t={},i=n.type(e);if(!e)return t;if(o.isSet(e))e=e.list();else if("string"===i){e=e.split(",");for(var r=0,s=e.length;r<s;r++)e[r]=n.trim(e[r])}else if("array"!==i)throw new Error;for(var r=0,s=e.length;r<s;r++)t[e[r]]=1;return t}},o}),define("dt/lib/base",["require","jquery"],function(e){function t(e){var t={},o=n.type(e);if("array"===o)for(var i=0,r=e.length;i<r;i++)t[e[i]]=e[i];else if("object"===o)for(var i in e)e.hasOwnProperty(i)&&(t[e[i]]=i);return t}var n=e("jquery"),o=Array.prototype.slice,i=Array.prototype.indexOf,r=/^[\s\t\xa0\u3000]*$/,s={},a=0,l=s.uncurry=function(e){return function(){return Function.call.apply(e,arguments)}};s.arraySlice=l(o),s.curry=function(e){var t=o.call(arguments,1);return function(){return e.apply(this,t.concat(o.call(arguments)))}},s.ieVersion=/msie (\d+\.\d+)/i.test(navigator.userAgent)?document.documentMode||+RegExp.$1:void 0;var u=/([&<>"'])/g,c={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"};s.encodeHTML=function(e){return null==e?"":(e+"").replace(u,function(e,t){return c[t]})},s.decodeHTML=function(e){return null==e?"":String(e).replace(/&quot;/g,'"').replace(/&lt;/g,"<").replace(/&gt;/g,">").replace(/&amp;/g,"&").replace(/&#([\d]+);/g,function(e,t){return String.fromCharCode(parseInt(t,10))})},s.assert=function(e,t){if(!e)throw new Error(t||"assert fail!")},s.objForEach=function(e,t){var n;for(n in e)e.hasOwnProperty(n)&&t(n,e[n]);if(d)for(var o=0;n=h[o++];)e[n]!==Object.prototype[n]&&t(n,e[n])};var d=!{toString:1}.propertyIsEnumerable("toString"),h=["toString","toLocaleString","valueOf","hasOwnProperty","isPrototypeOf","propertyIsEnumerable","constructor"];s.localUID=function(){return a++},s.makeInner=function(){var e="__private_d_"+s.localUID(),t=function(t){return t[e]||(t[e]={})};return t.attach=function(t){var n="__private_attach_",o=t.prototype;return e=o.hasOwnProperty(n)?o[n]:o[n]?o[n]="__private_s_"+(Number(o[n].split("_s_")[1])+1):o[n]="__private_s_0",t},t},s.isComponent=function(e,t){return Object(e)===e&&(t&&(e["__is__component__"]=1),!!e["__is__component__"])},s.getComponent=function(e){return s.isJQuery(e)&&(e=e[0]),!!e&&e["__component__"]},s.bindComponent=function(e,t){return s.isJQuery(e)&&(e=e[0]),!!e&&(s.isComponent(t)?e["__component__"]=t:!1===t&&(e["__component__"]=null),e["__component__"])},s.isJQuery=function(e){return e instanceof n},s.toInt=function(e){return parseInt(e,10)},s.assign=function(e,n,o,i,r){var s=t(o),a=t(i);for(var l in n)if(n.hasOwnProperty(l)&&!a.hasOwnProperty(l)){var u=null;if(o?s.hasOwnProperty(l)&&(u=s[l]):u=l,null!=u){if(r&&e.hasOwnProperty(u))throw new Error('Target attr "'+u+'" exists!');e[u]=n[l]}}return e};var f=s.isObject=function(e){var t=typeof e;return"function"===t||!!e&&"object"==t};return s.isEmptyObj=function(e){if(!f(e))return!1;for(var t in e)if(e.hasOwnProperty(t))return!1;return!0},s.isNaN=function(e){return e!==e},s.arrayIndexOf=function(e,t,n){if(!e)return-1;if(arguments.length<3&&"function"==typeof i)return i.call(e,t);for(var o=0,r=e.length;o<r;o++)if(arguments.length<3&&e[o]===t||f(e[o])&&e[o][n]===t)return o;return-1},s.arrayRemoveItem=function(e,t){var n=s.arrayIndexOf(e,t);n>0?e.splice(n,1):0===n&&e.shift()},s.arrayMap=function(e,t){for(var n=[],o=0,i=(e||[]).length;o<i;o++)n.push(t(e[o]));return n},s.arrayEquals=function(e,t){if(!n.isArray(e)||!n.isArray(t)||e.length!==t.length)return!1;for(var o=0,i=e.length;o<i;o++)if(e[o]!==t[o])return!1;return!0},s.objectKeys=function(e){var t=[];if(!s.isObject(e))return t;for(var n in e)e.hasOwnProperty(n)&&t.push(n);return t},s.objHasAttr=function(e,t){"string"===n.type(t)&&(t=[t]);for(var o=0,i=t.length;o<i;o++)if(e.hasOwnProperty[t[o]])return!0;return!1},s.diffObjects=function(e,t){function o(){return i.push({path:r.join("."),obj1:e,obj2:t}),i}var i=arguments[2]||[],r=arguments[3]||[],a=n.type(e),l=n.type(t);if(a!==l)return o();if("array"===a){if(e.length!==t.length)return o();for(var u=0,c=e.length;u<c;u++)r.push(u),s.diffObjects(e[u],t[u],i,r),r.pop()}else if("object"===a&&"object"===l){var d=s.objectKeys(e),h=s.objectKeys(t);if(!s.arrayEquals(d,h))return o();for(var u=0,c=d.length;u<c;u++){var f=d[u];r.push(f),s.diffObjects(e[f],t[f],i,r),r.pop()}}else if("date"===a){if(e.getTime()!==t.getTime())return o()}else if("regexp"===a){if(e.toString()!==t.toString())return o()}else if(e!==t)return o();return i},s.isBlank=function(e){return null==e||r.test(e)},s.toEcValue=function(e){return null==e?"-":e},s.fromEcValue=function(e){return"-"===e?null:e},s.toNotEmptyEcName=function(e){return s.isBlank(e)?"-":e},s.isSupportBase64=function(){var e=new Image,t=!0;return e.onload=e.onerror=function(){1===this.width&&1===this.height||(t=!1)},e.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",t}(),s.flashVersion=function(){var e;try{e=navigator.plugins["Shockwave Flash"],e=e.description}catch(t){try{e=new ActiveXObject("ShockwaveFlash.ShockwaveFlash").GetVariable("$version")}catch(t){e="0.0"}}return e=e.match(/\d+/g),parseFloat(e[0]+"."+e[1])}(),s.supportTransition=function(){var e=document.createElement("p").style,t="transition"in e||"WebkitTransition"in e||"MozTransition"in e||"msTransition"in e||"OTransition"in e;return e=null,t}(),s.noop=new Function,s.onlyHasProperty=function(e,t){var o=!0;if(null==t)return!1;n.isArray(t)||(t=[t]);for(var i in e)e.hasOwnProperty(i)&&-1===s.arrayIndexOf(t,i)&&(o=!1);return o},s}),define("dt/lib/json",["require"],function(e){var t={};return t.parseJSONLaxly=function(e,t){return new Function("return ("+e+");").call(t)},t}),define("dt/lib/throttle",["require"],function(e){var t={};return t.throttle=function(e,t,n,o){function i(i){function f(){c=(new Date).getTime(),d=null,(h?e:e[i]).apply(s,a||[])}return function(){l=(new Date).getTime(),s=this,a=arguments,r=l-(o?u:c)-t,clearTimeout(d),o?n?d=setTimeout(f,t):r>=0&&f():r>=0?f():n&&(d=setTimeout(f,-r)),u=l}}var r,s,a,l=(new Date).getTime(),u=0,c=0,d=null,h="function"==typeof e;if(t=t||0,h)return i();for(var f=[],p=0;p<e.length;p++)f[p]=i(p);return f},t.fixedRate=function(e,n){return null!=n?t.throttle(e,n,!0,!1):e},t.debounce=function(e,n){return null!=n?t.throttle(e,n,!0,!0):e},t}),define("dt/lib/dataDriven",["require","./base","jquery","./throttle"],function(e){function t(e,t){return!!(null===e||a.type(e)in f)&&e===t}function n(e,t){var n,o,i=[],r=this[d+"children"];for(n=0;o=r[n];n++)i.push(o.getCallback());for(i=t(i,e),n=0;o=r[n];n++)o.setCallback(i[n])}function o(e,t,n,o){if(!(arguments.length>1))return this()[e];this[d+"currValueInfo"]=n;var i=this();(o&&o.force||this.isDifferent(i[e],t))&&((!o||!o.silent)&&this.valueWillMutate(),i[e]=t,(!o||!o.silent)&&this.valueHasMutated()),r(this,o)}function i(e){return{ob:1,obArray:1,obHash:1}.hasOwnProperty(C(e))}function r(e,t){for(var n=t&&t.volatiles||[],o=e[d+"currValueInfo"],i=0,r=n.length;i<r;i++)delete o[n[i]]}var s=e("./base"),a=e("jquery"),l=e("./throttle"),u=Array.prototype.slice,c={},d="__prop__";c.subscribable=function(e){s.assign(e,h),e._subscriptions={}};var h={subscribe:function(e,t,n){n=n||"change";var o=this._subscriptions[n]||(this._subscriptions[n]=[]),i=new p(e,t,function(){s.arrayRemoveItem(o,i)});return o.push(i),i},notify:function(e,t){if(t=t||"change",this.hasSubscriptionsForEvent(t))for(var n,o=this._subscriptions[t].slice(),i=0;n=o[i];i++)n.callback(e)},hasSubscriptionsForEvent:function(e){return this._subscriptions[e]&&this._subscriptions[e].length},isDifferent:function(e,t){return!this.equalityComparer||!this.equalityComparer(e,t)},equalityComparer:t},f={undefined:1,boolean:1,number:1,string:1},p=function(e,t,n){this[d+"callback"]=e,this[d+"callbackScope"]=t,this[d+"disposeCallback"]=n,this[d+"isDisposed"]=!1},g=p.prototype;g.callback=function(e){return this[d+"isDisposed"]||this[d+"callback"].apply(this[d+"callbackScope"],e||[]),this},g.setCallback=function(e){return this[d+"callback"]=e,this},g.getCallback=function(){return this[d+"callback"]},g.dispose=function(){return this[d+"isDisposed"]=!0,this[d+"disposeCallback"](),this},g.throttle=function(e){return this[d+"callback"]=l.fixedRate(this[d+"callback"],e),this},g.debounce=function(e){return this[d+"callback"]=l.debounce(this[d+"callback"],e),this};var m=function(e){this[d+"children"]=a.extend([],e)},v=m.prototype;v.callback=function(e){for(var t,n=0;t=this[d+"children"][n];n++)t.callback(e)},v.dispose=function(){for(var e,t=0;e=this[d+"children"][t];t++)e.dispose()},v.throttle=function(e){return n.call(this,e,l.fixedRate),this},v.debounce=function(e){return n.call(this,e,l.debounce),this},c.ob=c.observable=function(e,t,n){function o(e,t,n){return arguments.length>0?void o[d+"writer"](e,t,n):o[d+"currValue"]}return C(e)&&(e=e.peek(),t=e.peekValueInfo()),o[d+"currValue"]=e,o[d+"currValueInfo"]=t,o[d+"authKey"]=n?n.authKey:null,c.subscribable(o),s.assign(o,w),o["__ob__type__"]="ob",o[d+"writer"]=function(e,t,n){o.validateAuthKey(n?n.authKey:null),s.assert(null==t||a.isPlainObject(t)),o[d+"currValueInfo"]=t,(n&&n.force||o.isDifferent(o[d+"currValue"],e))&&((!n||!n.silent)&&o.valueWillMutate(),o[d+"currValue"]=e,(!n||!n.silent)&&o.valueHasMutated()),r(this,n)},o};var w={force:function(e,t,n){n=n||{},n.force=!0,this[d+"writer"](e,t,n)},peek:function(){return this[d+"currValue"]},peekValueInfo:function(e){if(0===arguments.length){var t=this[d+"currValueInfo"];return t&&(t=a.extend({},t)),t}if(s.isObject(this[d+"currValueInfo"]))return this[d+"currValueInfo"][e]},extendWriter:function(e){var t=this,n=t[d+"writer"];return this[d+"writer"]=function(o,i,r){t.validateAuthKey(r?r.authKey:null),e.call(t,n,o,i,r)},this},valueHasMutated:function(){this.notify([this[d+"currValue"],this])},valueWillMutate:function(){this.notify([this[d+"currValue"],this],"beforeChange")},validateAuthKey:function(e){var t=this[d+"authKey"];if(null!=t&&e!==t)throw new Error("AuthKey error: "+e)}};c.obHash=function(e){var t=c.ob(e||{});return t["__ob__type__"]="obHash",t.prop=o,t},c.obArray=function(e){s.assert(void 0===e||a.isArray(e));var t=c.ob(e||[]);return s.assign(t,y),t["__ob__type__"]="obArray",t};var y={remove:function(e){for(var t,n=this(),o=[],i=[],r=0,s=n.length;r<s;)("function"==typeof e?e(n[r]):n[r]===e)?(t||(this.valueWillMutate(),t=!0),o.push(n.splice(r,1)),i.push(r),s--):r++;if(o.length){var a={key:b.REMOVE,indexes:i};this.notify([a,this],"arrayChange"),this.valueHasMutated()}return o},removeAll:function(){return this.splice(0,this.count())},indexOf:function(e){return s.arrayIndexOf(this(),e)},pop:function(){return this.splice(this.count()-1,1)},push:function(){return this.splice.apply(this,[this.count(),0].concat(u.call(arguments)))},shift:function(){return this.splice(0,1)},unshift:function(e){return this.splice(0,0,e)},splice:function(e,t){var n=this(),o=n.length,i=arguments.length;if(!i||!(e>=0&&e<=o))return[];1===i?t=o:t>=0?t>o-e&&(t=o-e):t=0,this.valueWillMutate();var r=n.splice.apply(n,arguments),s={key:b.SPLICE,index:e,removeCount:t,added:u.call(arguments,2)};return this.notify([s,this],"arrayChange"),this.valueHasMutated(),r},slice:function(){return u.apply(this(),arguments)},pushArray:function(e){return this.push.apply(this,e||[])},count:function(){return this().length},move:function(e,t){var n=this(),o=n.length;if(!(e<0||e>=o||t<0||t>=o||e===t)){this.valueWillMutate();var i=n.splice(e,1)[0];n.splice(t,0,i);var r={key:b.MOVE,originIndex:e,finalIndex:t};this.notify([r,this],"arrayChange"),this.valueHasMutated()}}},b=c.obArray.ChangeKey={REMOVE:"remove",SPLICE:"splice",MOVE:"move"};c.obSubscribe=function(e,t,n,o){if(C(e))return e.subscribe(t,n,o);if(a.isArray(e)){for(var i=[],r=0,s=e.length;r<s;r++)C(e[r])&&i.push(e[r].subscribe(t,n,o));return new m(i)}},c.value=function(e){return C(e)?e():e},c.peek=function(e){return C(e)?e.peek():e},c.setValue=function(e,t,n){return t=c.peek(t),i(e)?(e(t,n),e):t},c.valueInfo=function(e,t){return s.isObject(e)?s.assign({},e,["type","info"]):{type:e,info:t}},c.valueInfo.CONFIRMED="confirmed",c.valueInfoForConfirmed=function(e,t){var n=c.valueInfo(c.valueInfo.CONFIRMED,e);return t&&s.assign(n,t,null,["type","info"]),n},c.checkValueInfo=function(e,t,n){var o=c.obTypeOf(e)?e.peekValueInfo():e;return s.isObject(o)&&(null==t||o.type===t)&&(null==n||o.info===n)},c.checkValueInfoForConfirmed=function(e,t){return c.checkValueInfo(e,c.valueInfo.CONFIRMED,t)};var C=c.obTypeOf=function(e){return Object(e)===e&&e["__ob__type__"]};return c}),define("dt/lib/model",["require","jquery","./base","./dataDriven"],function(e){var t=e("jquery"),n=e("./base"),o=e("./dataDriven"),i={},r="__atom__",s=i.isAtom=function(e,i){return Object(e)!==e||!i&&e[r]||o.obTypeOf(e)||n.isComponent(e)||!t.isPlainObject(e)};i.isPlain=function(e,n){return t.isArray(e)||!s(e,n)},i.atom=function(e){return Object(e)!==e||e[r]||(e[r]=1),e},i.cloneAtom=function(e,i){var l,u,c=t.type(e);if(!s(e,!0))return e[r]?(e[r]=0,u=a({},e,{clone:!0}),u[r]=e[r]=1,u):void 0;if(l=o.obTypeOf(e))return o[l](a({},e.peek(),{clone:!0}));if(n.isComponent(e))return e.clone();if("date"===c)return new Date(e.getTime());if("regexp"===c)return new RegExp(e);if("array"===c){u=[];for(var d in e)e.hasOwnProperty(d)&&(u[d]=a({},e[d],{clone:!0}));return u}return c in{function:1,undefined:1,null:1,boolean:1,number:1,string:1}||i&&i.assignWhenCannotClone?e:void 0};var a=i.merge=function(e,t,n){if(void 0===t)return e;if(s(t))return n&&n.clone?i.cloneAtom(t,n):t;s(e)&&(e={});var o=n&&n.levelOneNeedMerge;n&&(n.levelOneNeedMerge=null);for(var r in t)!t.hasOwnProperty(r)||n&&n.onlyMergeOwnPropertyInTarget&&!e.hasOwnProperty(r)||(e[r]=!o||o[r]?a(e[r],t[r],n):t[r]);return e};return i.clone=function(e,t){if(void 0!==e)return a({},e,{clone:!0,assignWhenCannotClone:t})},i}),define("dt/lib/objectAccess",["require","./model"],function(e){function t(e){return e===Object(e)}function n(e){return"[object Array]"===Object.prototype.toString.call(e)}var o={},i=e("./model"),r=/[\.\[]/,s=/\[/g,a=/\]/g,l=o.getByPath=function(e,t,o){if(null==e)return t;var i=n(e)?e:l.parsePath(e),o=o||d;t={k:t},i.unshift("k");for(var r=0,s=i.length;r<s;r++){var a=i[r];switch(r?o(t,a):u.DRILL_DOWN){case u.DRILL_DOWN:t=t[a];break;case u.RETURN:return;default:throw new Error("path: "+a)}}return t},u=l.Action={DRILL_DOWN:"drillDown",THROW:"throw",RETURN:"return"},c=l.actionChoice={notObjectThrow:function(e){return t(e)?u.DRILL_DOWN:u.THROW},notObjectReturn:function(e){return t(e)?u.DRILL_DOWN:u.RETURN},atomThrow:function(e){return t(e)&&!i.isAtom(e)?u.DRILL_DOWN:u.THROW},notPlainThrow:function(e){return t(e)&&i.isPlain(e)?u.DRILL_DOWN:u.THROW},notPlainReturn:function(e){return t(e)&&i.isPlain(e)?u.DRILL_DOWN:u.RETURN}},d=c.notObjectThrow;l.normalizePath=function(e){return e.replace(s,".").replace(a,"")},l.parsePath=function(e){return e.replace(a,"").split(r)};var h=o.setByPath=function(e,t,n,o,i){if(null!=e){var s,a,l=e.split(r),o=o||g;n={k:n},l.unshift("k");for(var u,c=0,d=l.length;c<d;c++){a=l[c];var h=a.length;u=0,a.indexOf("]")===h-1&&(l[c]=a=a.slice(0,h-1),u=1);switch(c?o(n,a):f.DRILL_DOWN){case f.OVERLAP:s[l[c-1]]=n=u?[]:{};break;case f.DELETE:return void delete s[l[c-1]];case f.DRILL_DOWN:break;case f.RETURN:return;default:throw new Error("path: "+a)}s=n,n=n[a]}return"function"==typeof i?t=i(s,a,t):s[a]=t,t}},f=h.Action={DRILL_DOWN:"drillDown",THROW:"throw",RETURN:"return",OVERLAP:"overlap",DELETE:"delete"},p=h.actionChoice={notObjectOverlap:function(e){return t(e)?f.DRILL_DOWN:f.OVERLAP},notObjectThrow:function(e){return t(e)?f.DRILL_DOWN:void 0!==e?f.THROW:f.OVERLAP},notObjectReturn:function(e){return t(e)?f.DRILL_DOWN:void 0!==e?f.RETURN:f.OVERLAP},atomThrow:function(e){return t(e)&&!i.isAtom(e)?f.DRILL_DOWN:void 0!==e?f.THROW:f.OVERLAP},notPlainThrow:function(e){return t(e)&&i.isPlain(e)?f.DRILL_DOWN:void 0!==e?f.THROW:f.OVERLAP},notPlainOverlap:function(e){return t(e)&&i.isPlain(e)?f.DRILL_DOWN:f.OVERLAP}},g=p.notObjectThrow;return o.deleteByPath=function(e,t,n,o){function i(e,t){r=e[t],delete e[t]}var r;return h(e,void 0,t,n,i),r},o.reducePath=function(e,t){for(var n=e.split(r),o=[],i=0,s=n.length;i<s;i++){var a=n[i],l=a.length,u=!1;if(a.indexOf("]")===l-1&&(u=!0,a=a.slice(0,l-1)),a!==t[i])break;o.push((0===i?"":u?"[":".")+n[i])}return o.join("")},o}),define("dt/lib/objectOriented",["require","exports","module","./base"],function(e,t){function n(e,t){for(var n,o=this.constructor,i=this[e];(o=o.prototype._superClass)&&(n=o.prototype[e])&&n===i;);if(n)return n.apply(this,t||[]);throw new Error("parent Class has no method named "+e)}function o(e,t){var n=this[u]||(this[u]={});return arguments.length>1?n[e]=t:n[e]}function i(e){var o=this,i=t.newClass({_define:o.defineProperties}),r=function(){};r.prototype=o.prototype;var a=i.prototype=new r;return s(i.defineProperties,e._define),e._define=null,i.implement(e),a._applySuper=n,a._superClass=o,a.constructor=i,i}function r(e){return s(this.prototype,e)}function s(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e}function a(e){return"[object Function]"===Object.prototype.toString.call(e)}var l=e("./base"),u="privateProps";return t.newClass=function(e){var t=function(){return a(this._construct)?this._construct.apply(this,arguments):this};return t.extend=i,t.implement=r,s(t.defineProperties={},e._define),e._define=null,t.implement(e),t.uid="Class_"+l.localUID(),t.prototype._prop=o,t},t.simpleInherit=function(e,t){var o=e.prototype,i=new Function;i.prototype=t.prototype;var r=e.prototype=new i;return s(r,o),r._applySuper=n,r._superClass=t,r.constructor=e,e},t}),define("dt/lib/event",["require","jquery"],function(e){function t(e){return n.extend(e,r)}var n=e("jquery"),o=n.isFunction,i=n.inArray,r={addEventListener:function(e,t){o(e)&&(t=e,e="*"),this.__listeners=this.__listeners||{};var n=this.__listeners[e]||(this.__listeners[e]=[]);return i(n,t)<0&&n.push(t),this},removeEventListener:function(e,t){o(e)&&(t=e,e="*"),this.__listeners=this.__listeners||{};var n=this.__listeners[e];if(n)if(t){var r=i(n,t);~r&&delete n[r]}else n.length=0,delete this.__listeners[e];return this},removeAllEventListener:function(){return this.__listeners=[],this},fire:function(e,t){this.__listeners=this.__listeners||{};var o=this.__listeners[e],i=this;return o&&n.each(o,function(n,o){t=t||{},t.type=e,o.call(i,t)}),"*"!==e&&this.fire("*",t),this}};return{enableEvent:t}}),define("dt/lib/enumeration",["require","jquery"],function(e){function t(e){var t;if("array"===o.type(e)){t={};for(var n=0,i=e.length;n<i;n++)t[e[n]]=e[n]}else t=e;return t}function n(e){for(var t in e)if(e.hasOwnProperty(t)&&!r.test(t))throw new Error('Key must be spelled like "AAAA_BBB".')}var o=e("jquery"),i={},r=/^[A-Z][A-Z_]*$/;i.makeEnum=function(e,i){function r(){}return i=i||{},e=t(e),n(e),o.extend(r.prototype,s,i),o.extend(new r,e)};var s={has:function(e){return this.hasOwnProperty(e)},hasValue:function(e){return null!=this.getKeyByValue(e)},get:function(e){return this.hasOwnProperty(e)?this[e]:null},getKeyByValue:function(e){for(var t in this)if(this.hasOwnProperty(t)&&this[t]===e)return t;return null},contains:function(e,t){t&&!o.isArray(t)&&(t=[t]);for(var n=0,i=t.length;n<i;n++){for(var r=!1,s=0,a=e.length;s<a;s++)this[e[s]]===t[n]&&(r=!0);if(!r)return!1}return!0},forEachEnum:function(e,t){for(var n in this)this.hasOwnProperty(n)&&r.test(n)&&e.call(t,n,this[n])}};return i}),define("dt/lib/disable",["require","jquery"],function(e){function t(e,t,o){e=null!=e?e:"";var s=r[e];if(!s&&o){var a=null!=t?i+"-"+t:"";s=r[e]=n('<div class="'+i+" "+a+'"></div>').appendTo(document.body)}return s}var n=e("jquery"),o={},i="dt-global-mask",r={};return o.globalDisable=function(e){o.globalMask(!!e&&0)},o.globalMask=function(e,n,o,i){var r;if(!1===e)(r=t(n))&&r.hide().off(".dtGlobalMask");else{null==e&&(e=.5),r=t(n,o,!0),r.css({opacity:e}).show();for(var s in i)i.hasOwnProperty(s)&&r.on(s+".dtGlobalMask",i[s])}},o.disposeGlobalMask=function(e){var n=t(e);n&&n.off().remove()},o}),define("dt/lib/number",["require"],function(e){var t={},n=/^(\d+)px$/,o=/^(\d+|\d+\.\d+)%$/;t.ordinalSuffix=function(e){return 1==e?"st":2==e?"nd":3==e?"rd":"th"},t.pad=function(e,t){var n="",o=e<0,i=String(Math.abs(e));return i.length<t&&(n=new Array(t-i.length+1).join("0")),(o?"-":"")+n+i},t.formatNumber=function(e,n,o,i,r){if(!n)return e;r&&/[ID]%/.test(n)&&(e*=100);var s=/D+/.exec(n),a=s&&s.length>0?s[0].length:0;e=t.fixNumber(e,a,i);var l,u=e.toString(),c=u.split("."),d=c[0],h=c.length>1?c[1]:"";return l=n.replace(/I+,*I*/g,function(){var e,t,n=arguments[0],i=n.lastIndexOf(","),r=[];if(i>=0&&i!==d.length-1){t=n.length-1-i;for(var s;(s=d.length-t)>0&&t>0;)r.push(d.substr(s,t)),d=d.substring(0,s);r.push(d),r.reverse(),"-"===r[0]?(r.shift(),e="-"+r.join(",")):e=r.join(",")}else e=d;return o&&e&&e.indexOf("-")<0&&(e="+"+e),e}),l=l.replace(/D+/g,function(){var e=arguments[0],t=h;return t.length>e.length?t=t.substr(0,e.length):t+=new Array(e.length-t.length).join("0"),t})},t.fixNumber=function(e,t,n){if(e=i(e),null==t||null==e)return e;if(n)return 2==n?Number(e).toFixed(t):Number(e);var o=Math.pow(10,t);return Math.round(e*o)/o};var i=t.getNumber=function(e){var t=parseFloat(e);return e-t>=0?t:null};return t.refineNumber=function(e){for(var t=[],n=0,o=e.length;n<o;n++){var r=i(e[n]);null!=r&&t.push(r)}return t},t.validateNumeric=function(e){return e-parseFloat(e)>=0},t.isInteger=function(e){return t.validateNumeric(e)&&e%1==0},t.isPxStr=function(e){return n.test(e)},t.parsePxStr=function(e){return n.test(e)?parseFloat(RegExp.$1):null},t.isPercentStr=function(e){return o.test(e)},t.parsePercentStr=function(e){return o.test(e)?parseFloat(RegExp.$1):null},t}),define("dt/lib/htmlCleaner",["require"],function(e){function t(e,n){switch(e.nodeType){case 1:var o=e.tagName,r=e.attributes,s=n[o.toLowerCase()];if(!s)return i;for(var a=document.createElement(o),l=0,u=r.length;l<u;l++)~s.indexOf(r[l].name)&&a.setAttribute(r[l].name,r[l].value);for(var c=e.childNodes,l=0,u=c.length;l<u;l++){var d=t(c[l],n);d!==i&&a.appendChild(d)}return a;case 3:return document.createTextNode(e.nodeValue);default:return i}}function n(e){try{return(new DOMParser).parseFromString(e,"text/html")}catch(n){var t=new ActiveXObject("MSXML2.DOMDocument");return t.loadXML(e)}}function o(e,o){o=o||{};var s=n(e),a=o.htmlAllow||r.BASE,l=o.targetEl||document.createElement("div"),u=s.body.childNodes;l.innerHTML="";for(var c=0,d=u.length;c<d;c++){var h=t(u[c],a);h!==i&&l.appendChild(h)}return l.innerHTML}var i,r={BASE:{a:["title","alt","href","class","style"],b:["class","style"],em:["class","style"],strong:["class","style"],i:["class","style"],img:["src","class","style"],div:["class","style"],p:["class","style"],br:[]},EC_FORMATTER:{a:["title","alt","href","class","style"],b:["class","style"],em:["class","style"],strong:["class","style"],i:["class","style"],img:["src","class","style"],div:["class","style"],p:["class","style"],br:[]}};return{htmlClean:o,HTMLCleanAllow:r}}),define("dt/lib/codeStringify",["require","jquery"],function(e){function t(e,r,a,l){var u,d=l.singleLineDepth,h=null!=d?d<=a?"single":"multiple":"auto",f=l.quotationMark,p=l.indentBase,g=l.lineBreak,m=l.inlineDelimiterSpace,v=s.type(e),w=new Array(a*p+1).join(" "),y=new Array((a+1)*p+1).join(" "),b=!1,C=null!=r?n(r,f)+": ":"";switch(v){case"function":b="single"!==h,u=C+c.printFunction(e,a,p);break;case"regexp":u=C+f+e+f;break;case"date":u=C+i(e,f);break;case"array":for(var _=[],S=0,T=e.length;S<T;S++){var E=t(e[S],null,a+1,l);_.push(E.str),E.hasLineBreak&&(b=!0)}"multiple"===h&&(b=!0);var R=b?g:"",M=","+(b?g+y:m),O=b?y:"",k=b?w:"";u=C+"["+R+O+_.join(M)+R+k+"]";break;case"object":var _=[];for(var S in e)if(e.hasOwnProperty(S)){var E=t(e[S],S,a+1,l);_.push(E.str)}b="single"!==h;var R=b?g:"",M=","+(b?g+y:m),O=b?y:"",k=b?w:"";u=C+"{"+R+O+_.join(M)+R+k+"}";break;case"boolean":case"null":case"undefined":u=C+String(e);break;case"number":u=C+(isFinite(e)?String(e):"null");break;case"string":u=C+o(e,f);break;default:throw new Error('Illegal type "'+v+'" at "'+e+'"')}return{str:u,hasLineBreak:b}}function n(e,t){return c.jsReservedWordsMap[e]?t+e+t:/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(e)?e:o(e,t)}function o(e,t){var n=a[t];n.lastIndex=0;var o=u[t];return t+(n.test(e)?e.replace(n,function(e){var t=o[e];return"string"==typeof t?t:"\\u"+("0000"+e.charCodeAt(0).toString(16)).slice(-4)}):e)+t}function i(e,t){return isFinite(e.valueOf())?o(e.getUTCFullYear()+"-"+r(e.getUTCMonth()+1)+"-"+r(e.getUTCDate())+"T"+r(e.getUTCHours())+":"+r(e.getUTCMinutes())+":"+r(e.getUTCSeconds())+"Z",t):"null"}function r(e){return e<10?"0"+e:e}var s=e("jquery"),a={'"':/[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,"'":/[\\\'\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g},l={"\b":"\\b","\t":"\\t","\n":"\\n","\f":"\\f","\r":"\\r","\\":"\\\\"},u={'"':s.extend({},l,{'"':'\\"'}),"'":s.extend({},l,{"'":"\\'"})},c={};return c.jsReservedWords=["break","delete","function","return","typeof","case","do","if","switch","var","catch","else","in","this","void","continue","false","instanceof","throw","while","debugger","finally","new","true","with","default","for","null","try","abstract","double","goto","native","static","boolean","enum","implements","package","super","byte","export","import","private","synchronized","char","extends","int","protected","throws","class","final","interface","public","transient","const","float","long","short","volatile"],c.jsReservedWordsMap=function(e){for(var t={},n=0,o=e.length;n<o;n++)t[e[n]]=1;return t}(c.jsReservedWords),c.stringifyJSObject=function(e,n){if(n=n||{},null==n.indentBase&&(n.indentBase=4),null==n.lineBreak&&(n.lineBreak="\n"),null==n.quotationMark&&(n.quotationMark='"'),'"'!==n.quotationMark&&"'"!==n.quotationMark)throw new Error("Illegal quotation mark: "+n.quotationMark);n.compress&&(n.indentBase=0,n.lineBreak=""),n.inlineDelimiterSpace=n.compress?"":" ";try{return t(e,null,0,n).str}catch(e){return n.errorMessage||""}},c.stringifyJSObject2HTML=function(e,t,n){return"<pre>"+c.stringifyJSObject(e,t,n)+"</pre>"},c.printFunction=function(e,t,n){var o=new Array((t+1)*n).join(" "),i=(e+"").split("\n"),r="";return i.length>1&&"}"===s.trim(i[i.length-1])&&(i.pop(),r="\n"+new Array(t*n).join(" ")+"}"),i.join("\n"+o)+r},c}),define("dt/lib/others",["require","jquery","./base"],function(e){var t=e("jquery"),n=e("./base"),o={},i=/#\{(.+?)\}/g;o.parseURL=function(e){var t=[];if(!e)return t;var n=document.createElement("a");n.href=e;for(var o=(n.search||"").replace(/^\?/,"").split("&"),i=0,r=o.length;i<r;i++){var s=(o[i]||"").split("=");s.length>1&&s[0]&&t.push({name:s[0],value:s[1]})}return t},o.loadLazyImg=function(e,n){!n&&(n="src-origin"),e.each(function(e,o){o=t(o);var i=o.data(n);i&&(o.attr("src",i),o.data(n,""))})},o.parseInlineCss=function(e){e=e||"";for(var n={},o=e.split(";"),i=0,r=o.length;i<r;i++){var s=o[i].split(":");n[t.trim(s[0])]=t.trim(s[1])}return n},o.showBalloonTip=function(){var e,n,i="BAIDUHUI_BALLOON_TIP_SHOWN",r="DNOT_SHOW_WHEN_CLOSE";return function(s,a,l,u){function c(){e&&e.hide(),n===r&&o.cookie(i,1),n=null}if(!1===s)c();else{if((n=u)===r&&o.cookie(i))return;e||(e=t(['<div class="balloon-tip">','<div class="content"></div>','<div class="triangle"><i></i><em></em></div>','<div class="close-btn">X</div>',"</div>"].join("")).hide().appendTo(document.body),t(".close-btn",e).click(c)),t(".content",e).html(s),e.css({position:"absolute",left:a,top:l}).show()}}}(),o.cookie=function(e,t){if(null!=t)return document.cookie=e+"="+encodeURIComponent(t),t;var n=new RegExp("(^| )"+e+"=([^;]*)(;|$)"),o=n.exec(document.cookie);return o?decodeURIComponent(o[2]):null},function(){var e=!1;o.enableWindowScroll=function(t){e=!t},t(window).scroll(function(t){e&&(t.preventDefault(),t.stopPropagation())})}(),o.linkTargetBlank=function(e){var t=document,n=t.body,o=t.createElement("a");o.style.display="none",o.href=e||"#",o.target="_blank",n.appendChild(o),o.click(),n.removeChild(o)};var r=o.appendParam=function(e,t){return e+(e.indexOf("?")<0?"?":"&")+t};return o.replaceIntoParam=function(e,t,o){if(!e||n.isBlank(e))return e;o=null!=o?encodeURIComponent(o):"";var i=new RegExp("([&~?])"+t+"=[^&]*"),s=t+"="+o;return e=i.test(e)?e.replace(i,"$1"+s):r(e,s)},o.strTemplate=function(e,o){e=String(e);var r=Array.prototype.slice.call(arguments,1);return r.length?(r=1===r.length&&n.isObject(o)?o:r,e.replace(i,function(e,n){var o=r[n];return t.isFunction(o)&&(o=o(n)),null==o?"":o})):e},o.enhanceContentEditable=function(e){e.keypress(function(e){13===(e.keyCode||e.witch)&&e.preventDefault()})},o.getOpposite=function(e){var n=["top","right","bottom","left"],o=t.inArray(e,n);return o<0?null:o+2<n.length?n[o+2]:n[n.length-o-2]},function(){var e=[],t=!1;o.enableBeforeUnloadCheck=function(){t||(t=!0,window.onbeforeunload=function(){for(var t,n,o,i=0;n=e[i];i++)(o=n())&&(t=o);t&&(window.event.returnValue=t)})},o.addBeforeUnloadChecker=function(t){e.push(t)},o.removeBeforeUnloadChecker=function(t){var o=n.arrayIndexOf(e,t);return~o&&e.splice(o,1),!!~o}}(),o}),define("dt/lib/liteHashMap",["require","./base"],function(e){function t(e){var o=this;if(e instanceof t)e.each(function(e,t){o.set(t,e)});else if($.isArray(e))for(var i=0;i<e.length;i++)o.set(e[i],i);else e&&n.objForEach(e,function(e,t){o.set(e,t)})}var n=e("./base");return t.prototype={constructor:t,get:function(e){return this.hasOwnProperty(e)?this[e]:null},set:function(e,t){return this[e]=t},each:function(e,t){void 0!==t&&(e=$.proxy(e,t));for(var n in this)this.hasOwnProperty(n)&&e(this[n],n)},removeKey:function(e){delete this[e]}},{createLiteHashMap:function(e){return new t(e)}}}),
-define("dt/ui/tooltip",["require","jquery","../lib/base","../lib/model"],function(e){function t(e){var t=n(),o=e.x,i=e.y;null==o&&(o=0),null==i&&(i=0);var r=e.xAnchor||"center",s=e.yAnchor||"top",a="left"===r?0:t.outerWidth(),l="top"===s?0:t.outerHeight();t.css({left:Math.round("left"===r?o:"center"===r?o-a/2:o-a)+"px",top:Math.round("top"===s?i:"center"===s?i-l/2:i-l)+"px"})}function n(){return f||(f=o('<div class="'+u+'" style="display:none;"></div>').appendTo(document.body)),f}var o=e("jquery"),i=e("../lib/base"),r=e("../lib/model"),s=o.isFunction,a=o.extend,l=".dtui-global-tooltip-namespace",u="dtui-global-tooltip",c={x:0,y:-5,xAnchor:"center",yAnchor:"bottom"},d={x:0,y:-15,xAnchor:"center",yAnchor:"bottom"},h={},f=null,p=!1;return h.showTooltip=function(e){if(!p){e=e||{};var o=e.text;if(null==o)return void h.hideTooltip();o=!1!==e.encodeHTML?i.encodeHTML(o):o,n().html(o).show(),t(e.location)}},h.hideTooltip=function(){n().hide()},h.disableTooltip=function(){h.hideTooltip(),p=!0},h.enableTooltip=function(){p=!1},h.bindTooltip=function(e){function n(e){m={currentTarget:e.currentTarget,pageX:e.pageX,pageY:e.pageY}}function u(t){var n=e.text;return s(n)?n(t.currentTarget):n}function f(e){var t=s(p)?p(e.currentTarget):a({},p||(g?d:c));if(g)t.x+=e.pageX,t.y+=e.pageY;else if(!p){var n=o(e.currentTarget),i=n.offset();t.x+=i.left+n.outerWidth()/2,t.y+=i.top}return t}e=r.merge({},e,{clone:!0,assignWhenCannotClone:!0});var p=e.location,g=e.followMouse;i.assert(!i.isJQuery(e.bindEl));var m,v=o(e.bindEl),w=["mouseenter"+l,function(t){n(t),h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})}],y=["mouseleave"+l,function(){m=null,h.hideTooltip()}],b=["mousemove"+l,function(e){n(e),t(f(m))}],C=e.selector;return C&&(w.splice(1,0,C),y.splice(1,0,C),b.splice(1,0,C)),v.on.apply(v,w).on.apply(v,y),g&&v.on.apply(v,b),{refresh:function(){m&&h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})},setText:function(t){m&&h.showTooltip({text:t,encodeHTML:e.encodeHTML,location:f(m)})},hide:function(){m&&h.hideTooltip()},dispose:function(){m&&(h.hideTooltip(),m=null),v.off(l)}}},h}),define("dt/lib",["require","./lib/Set","./lib/base","./lib/json","./lib/dataDriven","./lib/objectAccess","./lib/objectOriented","./lib/model","./lib/event","./lib/enumeration","./lib/disable","./lib/number","./lib/throttle","./lib/htmlCleaner","./lib/codeStringify","./lib/others","./lib/liteHashMap","./ui/tooltip"],function(e){var t={Set:e("./lib/Set")};return function(e){for(var t=1,n=arguments.length;t<n;t++){var o=arguments[t];for(var i in o)if(o.hasOwnProperty(i)){if(e[i])throw new Error("Duplicate key: "+i);e[i]=o[i]}}}(t,e("./lib/base"),e("./lib/json"),e("./lib/dataDriven"),e("./lib/objectAccess"),e("./lib/objectOriented"),e("./lib/model"),e("./lib/event"),e("./lib/enumeration"),e("./lib/disable"),e("./lib/number"),e("./lib/throttle"),e("./lib/htmlCleaner"),e("./lib/codeStringify"),e("./lib/others"),e("./lib/liteHashMap"),e("./ui/tooltip")),t}),function(e){function t(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e}function n(){this.raw=[],this.length=0}function o(){return"___"+k++}function i(e,t){var n=new Function;n.prototype=t.prototype,e.prototype=new n,e.prototype.constructor=e}function r(e){return x[e]}function s(e){return'"'+e.replace(/\x5C/g,"\\\\").replace(/"/g,'\\"').replace(/\x0A/g,"\\n").replace(/\x09/g,"\\t").replace(/\x0D/g,"\\r")+'"'}function a(e){return e.replace(/[\^\[\]\$\(\)\{\}\?\*\.\+]/g,function(e){return"\\"+e})}function l(e){var t=arguments;return e.replace(/\{([0-9]+)\}/g,function(e,n){return t[n-0+1]})}function u(e){return e=e.replace(/^\s*\*/,""),l('gv({0},["{1}"])',s(e),e.replace(/\[['"]?([^'"]+)['"]?\]/g,function(e,t){return"."+t}).split(".").join('","'))}function c(e,t,n,o,i,r){for(var s=n.length,a=e.split(t),l=0,u=[],c=0,d=a.length;d>c;c++){var h=a[c];if(c){var f=1;for(l++;;){var p=h.indexOf(n);if(0>p){u.push(l>1&&f?t:"",h);break}if(l=o?l-1:0,u.push(l>0&&f?t:"",h.slice(0,p),l>0?n:""),h=h.slice(p+s),f=0,0===l)break}0===l&&(i(u.join("")),r(h),u=[])}else h&&r(h)}l>0&&u.length>0&&(r(t),r(u.join("")))}function d(e,t,n){var o,i=[],r=t.options,a="",l="",h="",f="";return n&&(a="ts(",l=")",h=P,f=H,o=r.defaultFilter),c(e,r.variableOpen,r.variableClose,1,function(e){n&&e.indexOf("|")<0&&o&&(e+="|"+o);var r=e.indexOf("|"),s=(r>0?e.slice(0,r):e).replace(/^\s+/,"").replace(/\s+$/,""),c=r>0?e.slice(r+1):"",p=0===s.indexOf("*"),g=[p?"":a,u(s),p?"":l];if(c){c=d(c,t);for(var m=c.split("|"),v=0,w=m.length;w>v;v++){/^\s*([a-z0-9_-]+)(\((.*)\))?\s*$/i.test(m[v])&&(g.unshift('fs["'+RegExp.$1+'"]('),RegExp.$3&&g.push(",",RegExp.$3),g.push(")"))}}i.push(h,g.join(""),f)},function(e){i.push(h,n?s(e):e,f)}),i.join("")}function h(e,t){this.value=e,this.engine=t}function f(e,t){this.value=e,this.engine=t,this.children=[],this.cloneProps=[]}function p(e,t){var n=e.stack,o=t?n.find(function(e){return e instanceof t}):n.bottom();if(o){for(var i;(i=n.top())!==o;){if(!i.autoClose)throw new Error(i.type+" must be closed manually: "+i.value);i.autoClose(e)}o.close(e)}return o}function g(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(\s*master\s*=\s*([a-z0-9\/_-]+)\s*\))?\s*/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.master=RegExp.$3,this.name=RegExp.$1,f.call(this,e,t),this.blocks={}}function m(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name"]}function v(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name","state","blocks"],this.blocks={}}function w(e,t){if(!/^\s*([a-z0-9_]+)\s*=([\s\S]*)$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.expr=RegExp.$2,f.call(this,e,t),this.cloneProps=["name","expr"]}function y(e,t){if(!/^\s*([a-z0-9_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function b(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function C(e,t){if(!new RegExp(l("^\\s*({0}[\\s\\S]+{1})\\s+as\\s+{0}([0-9a-z_]+){1}\\s*(,\\s*{0}([0-9a-z_]+){1})?\\s*$",a(t.options.variableOpen),a(t.options.variableClose)),"i").test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.list=RegExp.$1,this.item=RegExp.$2,this.index=RegExp.$4,f.call(this,e,t),this.cloneProps=["list","item","index"]}function _(e,t){f.call(this,e,t)}function S(e,t){_.call(this,e,t)}function T(e,t){f.call(this,e,t)}function E(e,t){t.target=e;var n=t.engine,o=e.name;if(n.targets[o])switch(n.options.namingConflict){case"override":n.targets[o]=e,t.targets.push(o);case"ignore":break;default:throw new Error("Target exists: "+o)}else n.targets[o]=e,t.targets.push(o)}function R(e,t){I[e]=t,t.prototype.type=e}function M(e){this.options={commandOpen:"\x3c!--",commandClose:"--\x3e",commandSyntax:/^\s*(\/)?([a-z]+)\s*(?::([\s\S]*))?$/,variableOpen:"${",variableClose:"}",defaultFilter:"html"},this.config(e),this.targets={},this.filters=t({},D)}function O(e,t){function o(){var e;if(d.length>0&&(e=d.join(""))){var n=new h(e,t);n.beforeAdd(u),l.top().addChild(n),d=[],t.options.strip&&u.current instanceof f&&(n.value=e.replace(/^[\x20\t\r]*\n/,"")),u.current=n}}var i,r=t.options.commandOpen,s=t.options.commandClose,a=t.options.commandSyntax,l=new n,u={engine:t,targets:[],stack:l,target:null},d=[];return c(e,r,s,0,function(e){var n=a.exec(e);if(n&&(i=I[n[2].toLowerCase()])&&"function"==typeof i){o();var l=u.current;t.options.strip&&l instanceof h&&(l.value=l.value.replace(/\r?\n[\x20\t]*$/,"\n")),n[1]?l=p(u,i):(l=new i(n[3],t),"function"==typeof l.beforeOpen&&l.beforeOpen(u),l.open(u)),u.current=l}else/^\s*\/\//.test(e)||d.push(r,e,s);i=null},function(e){d.push(e)}),o(),p(u),u.targets}n.prototype={push:function(e){this.raw[this.length++]=e},pop:function(){if(this.length>0){var e=this.raw[--this.length];return this.raw.length=this.length,e}},top:function(){return this.raw[this.length-1]},bottom:function(){return this.raw[0]},find:function(e){for(var t=this.length;t--;){var n=this.raw[t];if(e(n))return n}}};var k=178245,x={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},D={html:function(e){return e.replace(/[&<>"']/g,r)},url:encodeURIComponent,raw:function(e){return e}},A='var r="";',P="r+=",H=";",N="return r;";"undefined"!=typeof navigator&&/msie\s*([0-9]+)/i.test(navigator.userAgent)&&RegExp.$1-0<8&&(A="var r=[],ri=0;",P="r[ri++]=",N='return r.join("");'),h.prototype={getRendererBody:function(){var e=this.value,t=this.engine.options;return!e||t.strip&&/^\s*$/.test(e)?"":d(e,this.engine,1)},clone:function(){return this}},f.prototype={addChild:function(e){this.children.push(e)},open:function(e){var t=e.stack.top();t&&t.addChild(this),e.stack.push(this)},close:function(e){e.stack.top()===this&&e.stack.pop()},getRendererBody:function(){for(var e=[],t=this.children,n=0;n<t.length;n++)e.push(t[n].getRendererBody());return e.join("")},clone:function(){for(var e=new this.constructor(this.value,this.engine),t=0,n=this.children.length;n>t;t++)e.addChild(this.children[t].clone());for(var t=0,n=this.cloneProps.length;n>t;t++){var o=this.cloneProps[t];e[o]=this[o]}return e}};i(g,f),i(m,f),i(v,f),i(w,f),i(y,f),i(b,f),i(C,f),i(_,f),i(S,_),i(T,_);var L={READING:1,READED:2,APPLIED:3,READY:4};v.prototype.applyMaster=g.prototype.applyMaster=function(e){function t(e){var o=e.children;if(o instanceof Array)for(var i=0,r=o.length;r>i;i++){var s=o[i];s instanceof m&&n[s.name]&&(s=o[i]=n[s.name]),t(s)}}if(this.state>=L.APPLIED)return 1;var n=this.blocks,o=this.engine.targets[e];return o&&o.applyMaster(o.master)?(this.children=o.clone().children,t(this),this.state=L.APPLIED,1):void 0},g.prototype.isReady=function(){function e(o){for(var i=0,r=o.children.length;r>i;i++){var s=o.children[i];if(s instanceof v){var a=t.targets[s.name];n=n&&a&&a.isReady(t)}else s instanceof f&&e(s)}}if(this.state>=L.READY)return 1;var t=this.engine,n=1;return this.applyMaster(this.master)?(e(this),n&&(this.state=L.READY),n):void 0},g.prototype.getRenderer=function(){if(this.renderer)return this.renderer;if(this.isReady()){var e=new Function("data","engine",['data=data||{};var v={},fs=engine.filters,hg=typeof data.get=="function",gv=function(n,ps){var p=ps[0],d=v[p];if(d==null){if(hg){return data.get(n);}d=data[p];}for(var i=1,l=ps.length;i<l;i++)if(d!=null)d = d[ps[i]];return d;},ts=function(s){if(typeof s==="string"){return s;}if(s==null){s="";}return ""+s;};',A,this.getRendererBody(),N].join("\n")),t=this.engine;return this.renderer=function(n){return e(n,t)},this.renderer}return null},g.prototype.open=function(e){p(e),f.prototype.open.call(this,e),this.state=L.READING,E(this,e)},w.prototype.open=b.prototype.open=function(e){e.stack.top().addChild(this)},m.prototype.open=function(e){f.prototype.open.call(this,e),(e.imp||e.target).blocks[this.name]=this},S.prototype.open=function(e){(new T).open(e),p(e,_).addChild(this),e.stack.push(this)},T.prototype.open=function(e){p(e,_).addChild(this),e.stack.push(this)},v.prototype.open=function(e){this.parent=e.stack.top(),this.target=e.target,f.prototype.open.call(this,e),this.state=L.READING,e.imp=this},b.prototype.close=w.prototype.close=function(){},v.prototype.close=function(e){f.prototype.close.call(this,e),this.state=L.READED,e.imp=null},g.prototype.close=function(e){f.prototype.close.call(this,e),this.state=this.master?L.READED:L.APPLIED,e.target=null},v.prototype.autoClose=function(e){var t=this.parent.children;t.push.apply(t,this.children),this.children.length=0;for(var n in this.blocks)this.target.blocks[n]=this.blocks[n];this.blocks={},this.close(e)},b.prototype.beforeOpen=v.prototype.beforeOpen=w.prototype.beforeOpen=C.prototype.beforeOpen=y.prototype.beforeOpen=m.prototype.beforeOpen=_.prototype.beforeOpen=h.prototype.beforeAdd=function(e){if(!e.stack.bottom()){new g(o(),e.engine).open(e)}},v.prototype.getRendererBody=function(){return this.applyMaster(this.name),f.prototype.getRendererBody.call(this)},b.prototype.getRendererBody=function(){return l("{0}engine.render({2},{{3}}){1}",P,H,s(this.name),d(this.args,this.engine).replace(/(^|,)\s*([a-z0-9_]+)\s*=/gi,function(e,t,n){return(t||"")+s(n)+":"}))},w.prototype.getRendererBody=function(){return this.expr?l("v[{0}]={1};",s(this.name),d(this.expr,this.engine)):""},_.prototype.getRendererBody=function(){return l("if({0}){{1}}",d(this.value,this.engine),f.prototype.getRendererBody.call(this))},T.prototype.getRendererBody=function(){return l("}else{{0}",f.prototype.getRendererBody.call(this))},C.prototype.getRendererBody=function(){return l('var {0}={1};if({0} instanceof Array)for (var {4}=0,{5}={0}.length;{4}<{5};{4}++){v[{2}]={4};v[{3}]={0}[{4}];{6}}else if(typeof {0}==="object")for(var {4} in {0}){v[{2}]={4};v[{3}]={0}[{4}];{6}}',o(),d(this.list,this.engine),s(this.index||o()),s(this.item),o(),o(),f.prototype.getRendererBody.call(this))},y.prototype.getRendererBody=function(){var e=this.args;return l("{2}fs[{5}]((function(){{0}{4}{1}})(){6}){3}",A,N,P,H,f.prototype.getRendererBody.call(this),s(this.name),e?","+d(e,this.engine):"")};var I={};R("target",g),R("block",m),R("import",v),R("use",b),R("var",w),R("for",C),R("if",_),R("elif",S),R("else",T),R("filter",y),M.prototype.config=function(e){t(this.options,e)},M.prototype.compile=M.prototype.parse=function(e){if(e){var t=O(e,this);if(t.length)return this.targets[t[0]].getRenderer()}return new Function('return ""')},M.prototype.getRenderer=function(e){var t=this.targets[e];return t?t.getRenderer():void 0},M.prototype.render=function(e,t){var n=this.getRenderer(e);return n?n(t):""},M.prototype.addFilter=function(e,t){"function"==typeof t&&(this.filters[e]=t)};var W=new M;W.Engine=M,"object"==typeof exports&&"object"==typeof module?exports=module.exports=W:"function"==typeof define&&define.amd?define("etpl",W):e.etpl=W}(this),define("dt/tpl",["require","etpl","./lib"],function(e){function t(e){for(var t=!1,n=!1,o=1;o<arguments.length;o++)"raw"===arguments[o]&&(t=!0),"null"===arguments[o]&&(n=!0);return null!=e||n||(e=""),i.obTypeOf(e)&&(e=e()),e=String(e),t?e:i.encodeHTML(e)}function n(e){return null==e&&(e=""),String(e).replace(/^option\./,"")}var o=e("etpl"),i=e("./lib"),r={};return o.config({commandOpen:"{{",commandClose:"}}",defaultFilter:"ob"}),o.addFilter("ob",t),o.addFilter("dsp",n),r.render=function(e,t,n){return!o.getRenderer(e)&&n&&o.compile(n),o.render(e,t||{})},r}),define("dt/ui/Component",["require","jquery","dt/lib","dt/tpl"],function(e){function t(){function e(e){t.disabled(e)}var t=this._viewModel();t.visible=m.ob(!0);var n=t.disabled;t.disabled=m.ob(!1),null!=n&&this._disposable(n.subscribe(e,this))}function n(e){if(e){var t=b(this);e=t.$el=g(e),t.el=e[0],m.bindComponent(e,this),e.addClass(this.getFullCss().join(" "));var n=this._viewModel(),r=n.disabled,s=n.visible;this._disposable(r.subscribe(o,this)),this._disposable(s.subscribe(i,this)),o.call(this,r()),s("none"!==e[0].style.display)}}function o(e){this.$el()[e?"addClass":"removeClass"](this.getFullCss("-disabled").join(" "))}function i(e){this.$el()[e?"show":"hide"]()}function r(){var e=b(this).cptDef.tplTarget||this._getDefineProperty("tplTarget"),t=this.$el();e&&t&&t.length&&this._renderTpl(e,null,t),!this._getDefineProperty("suppressConstructSub")&&t&&t.length&&this._constructSub(t)}function s(){var e=this.$el(),t=b(this);e.off(t.eventNamespace),e.removeClass(this.getFullCss().join(" ")),t.viewModel=null,t.el=null,t.$el=null,t.subComponents=null,t.sub$Els=null,m.bindComponent(e,!1)}function a(e,t,n){if(!n&&m.isComponent(e)||n&&m.isJQuery(e))t(e);else if("object"===g.type(e)&&!m.isAtom(e))for(var o in e)e.hasOwnProperty(o)&&null!=e[o]&&a(e[o],t,n)}function l(e){var t=b(this),n=t.viewModel={},o=this;return this._traverseFromAncestor(function(e){n=m.merge(n,e.defineProperties.viewModel.call(o),{onlyMergeOwnPropertyInTarget:!1,levelOneNeedMerge:null,clone:!1})}),n=m.merge(n,e,{onlyMergeOwnPropertyInTarget:!!this._getDefineProperty("viewModelOnlyAccessDeclaredProperties"),levelOneNeedMerge:t.viewModelMergeMap||{}}),t.viewModel=n,n}function u(){var e=b(this),t=e.viewModelPublicMap={},n=e.viewModelMergeMap={};this._traverseFromAncestor(function(e){for(var o=e.defineProperties.viewModelPublic||[],i=0,r=o.length;i<r;i++)t[o[i]]=1;for(var s=e.defineProperties.viewModelMerge||[],i=0,r=s.length;i<r;i++)n[s[i]]=1})}function c(){var e=this._viewModel(),t=b(this),n=[];this._traverseFromAncestor(function(e){var t=e.defineProperties.css;g.isArray(t)?n.push.apply(n,t):t&&n.push(t)}),t.basicCss=n;var o=e&&e.css||[];g.isArray(o)||(o=[o]),t.extraCss=o}function d(e){return e=w.normalizePath(e),!!b(this).viewModelPublicMap[e]}function h(e){if(e&&g.isFunction(e.dispose))try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}else e&&m.isJQuery(e)&&e.off(this._event())}function f(e){if(e=e||b(this).subComponents,a(e,function(e){try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}}),!m.isAtom(e))for(var t in e)e.hasOwnProperty(t)&&(e[t]=null)}function p(e){e=e||b(this).sub$els;var t=this._event();if(a(e,function(e){e.off(t)},!0),!m.isAtom(e))for(var n in e)e.hasOwnProperty(n)&&(e[n]=null)}var g=e("jquery"),m=e("dt/lib"),v=e("dt/tpl"),w=m.getByPath,y=m.setByPath,b=m.makeInner(),C=b.attach(m.newClass(m.enableEvent({_define:{tpl:"",tplTarget:"",css:"",viewModel:function(){return{disabled:null,visible:null,css:"",tplTarget:null,tplRenderMode:"html"}},viewModelPublic:["disabled","visible"],viewModelMerge:[],viewModelOnlyAccessDeclaredProperties:!0,suppressConstructSub:!1},_prepare:g.noop,_init:g.noop,_dispose:g.noop,_disposeFinally:g.noop,_run:g.noop,_event:function(e){var t=b(this).eventNamespace;return(null!=e?e:"")+t},_parseViewModel:function(e,t){return e},_parseCptDef:function(e){return e},_construct:function(e,o,i){arguments.length>0&&m.assert(null!=e),!e||g.isPlainObject(e)?(i=o,o=e,e=null):e=g(e),i=g.extend({},i),m.isComponent(this,!0);var s=b(this);s.cptDef=i,s.eventNamespace=".namespace"+m.localUID(),s.subComponents={},s.sub$Els={},s.disposed=!1,s.cptDisposableArea={},s.cptInstanceUID="cpt-instance-"+m.localUID(),u.call(this),o=this._parseViewModel(o||{},i)||{},l.call(this,o),c.call(this),t.call(this),n.call(this,e),this._prepare(),r.call(this),this._init()},dispose:function(){var e=b(this);if(!e.disposed){var t=this.el(),n=this["__originalHTML"]||"";this._dispose(),f.call(this),p.call(this),this._disposable(!1),s.call(this),this._disposeFinally(),t.innerHTML=n,e.disposed=!0}},isDisposed:function(){return!!b(this).disposed},isFrozen:function(){return this._viewModel().disabled()||this.isDisposed()},_disposable:function(e,t){m.assert(null!=e);var n=b(this).cptDisposableArea;if(null==e)return e;if(!1===e)for(var o in n)n.hasOwnProperty(o)&&(h.call(this,n[o]),n[o]=null);else"string"===g.type(e)?(h.call(this,n[e]),n[e]=null):(m.assert(g.isFunction(e.dispose)||m.isJQuery(e),"No dispose method nor not jQuery!"),t=t||"-component-anonymouse-disposable"+m.localUID(),n[t]=e);return e},resize:g.noop,_manuInitView:function(e){n.call(this,e),this._constructSub(e)},_applyTpl:function(e,t){t&&(this._renderTpl(t,null,e),this._constructSub(e))},_renderTpl:function(e,t,n){var o={viewModel:t||this._viewModel(),lang:this.getLang(),constant:this.getConstant()},i=v.render(e,o,this._getDefineProperty("tpl"))||"";return n&&g(n)[this._viewModel().tplRenderMode](i),i},_constructSub:function(e,t){var n=g(e);m.assert(n.length),t&&n.data("cpt")&&this._constructSubCpt.call(this,e);var o=this;g("*[data-cpt]",n).each(function(e,t){o._constructSubCpt(t)})},_constructSubCpt:function(e){var t=g(e),n=e.innerHTML,o=this._viewModel(),i=this._parseCptDef(new Function("viewModel","lib","lang","constant","return {"+t.data("cpt")+"};").call(this,o,m,this.getLang(),this.getConstant())),r=this.getCptClass(i.type),s=i.viewModelGet?w(i.viewModelGet,o):i.viewModel,a=new r(e,s,i);return a["__originalHTML"]=n,this._sub(i.name||"-sub-cpt-name-"+m.localUID(),a)},recreateSubCpt:function(e){var t=this._sub(e);if(t){var n=t.el();t.dispose(),this._sub(e,null),this._constructSubCpt(n)}},traversalRun:function(e){a(b(this).subComponents,function(t){t.traversalRun(e)}),this._run(e)},_sub:function(e,t,n){var o=b(this).subComponents;return arguments.length<2?w(e,o,w.actionChoice.notPlainReturn):(y(e,t,o,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},_getDefineProperty:function(e){return this.constructor.defineProperties[e]},el:function(){return b(this).el},$el:function(e,t,n){var o=b(this);return 0===arguments.length?o.$el:1===arguments.length?w(e,o.sub$Els,w.actionChoice.notPlainReturn):(y(e,t,o.sub$Els,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},css:function(){return this._getDefineProperty("css")||""},viewModel:function(e){if(d.call(this,e))return w(e,b(this).viewModel);throw new Error(e+" is private!")},_viewModel:function(){return b(this).viewModel},getCptClass:function(e){return C.cptClasses[e]},getCptDef:function(e){return b(this).cptDef[e]},uid:function(){return b(this).cptInstanceUID},getFullCss:function(e){var t=["dtui-cpt"],n=b(this);return t.push.apply(t,n.basicCss||[]),t.push.apply(t,n.extraCss||[]),g.map(t,function(t){return t+(e||"")})},isDisabled:function(){return!!m.peek(this._viewModel().disabled)},getLang:function(){return C.defaultLanguageSet},getConstant:function(){return C.defaultConstant},clone:g.noop,_traverseFromAncestor:function(e){for(var t=[],n=this.constructor;n;n=n.prototype._superClass)t.push(n);for(var o=t.length;o--;)e.call(this,t[o])},localOb:function(e,t){var n,o=b(this),i=o.localObRepo||(o.localObRepo={});return arguments.length>1?!1===t?(n=i[e],delete i[e]):(m.assert(null==i[e]),n=i[e]=t):n=i[e],n},getAncestorLocalOb:function(e){for(var t,n,o=this.$el();(o=o&&o.parent())[0]&&!(n=(t=m.getComponent(o))&&t.localOb(e))&&o[0]!==document.body;);return n}})));return C.cptClasses={},C.defaultLanguageSet={},C.defaultConstant={},C.consoleLog=function(e){var t=window.console;m.isObject(t)&&"function"==typeof t.log&&t.log(m.stringifyJSON(e))},C}),define("spreadsheet/lang",["require","jquery"],function(e){var t=e("jquery"),n={langCode:"zh",pageTitle:"表格数据转换工具",pageDescHTML:"使用说明:在<strong>左侧</strong>贴入数据&nbsp;&nbsp;<strong>右下方</strong>立刻产生结果",typeSetting:"结果类型:",emptyValueSetting:"空值设置:",quotationMarkSetting:"引号设置:",quotationMarks:{singleQuotes:"单引号",doubleQuotes:"双引号"},dimensionSetting:"维度设置:",attributeSetting:"属性设置:",codeFormatSetting:"格式化:",codeFormat:{compressed:"压缩",expanded2Indent:"展开(2空格缩进)",expanded4Indent:"展开(4空格缩进)"},convertResult:"转换结果:",dimDesc:{dimallto2:"整体转换成一个二维数组",dim1to1:"每一列转换为一个一维数组",dim1to2:"每一列转换成一个二维数组",dim2to2:"每二列转换成一个二维数组",dim3to2:"每三列转换成一个二维数组",dim4to2:"每四列转换成一个二维数组",dim5to2:"每五列转换成一个二维数组",dim6to2:"每六列转换成一个二维数组"},codeInputTitle:"#{rangeDesc} 列转换结果:",attrInfoTitle:"列 #{colName} ",attrInfoAttrName:"属性名:",attrInfoType:"类型:",ecEmptyValue:"ECharts标准空值(中划线:'-')",jsDataTypeDimArray:"纯数组",jsDataTypeArrayObject:"数组+对象",jsDataTypeGEO:"地理坐标",outputFormat:"结果格式:",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"在第一列贴入国家或地区名称,然后点击:",geoConvertBtn:"转换成坐标",geoDesc:"结果解释:B 列:经度,C 列:纬度,D 列:2位简称",dataTableControl:{clear:"清空",lt:"⇱",rb:"⇲",l:"⇇",r:"⇉",t:"⇈",b:"⇊"}},o={langCode:"en",pageTitle:"Spreadsheet Data Converter",pageDescHTML:"Tip: Paste data on the <strong>left</strong>, and get result <strong>below</strong> immediately.",typeSetting:"Type: ",emptyValueSetting:"Empty Value: ",quotationMarkSetting:"Quotation Mark: ",quotationMarks:{singleQuotes:"single qutation mark",doubleQuotes:"double qutation mark"},dimensionSetting:"Dimension: ",dimDesc:{dim1to1:"Convert to a 1-dimension array every column.",dimallto2:"Convert all of the data to a 2-dimension array.",dim1to2:"Convert to a 2-dimension array every column.",dim2to2:"Convert to a 2-dimension array every 2 columns.",dim3to2:"Convert to a 2-dimension array every 3 columns.",dim4to2:"Convert to a 2-dimension array every 4 columns.",dim5to2:"Convert to a 2-dimension array every 5 columns."},attributeSetting:"Attributes: ",codeFormatSetting:"Formatting Result: ",codeFormat:{compressed:"compress",expanded2Indent:"expand and indent with 2 spaces",expanded4Indent:"expand and indent with 4 spaces"},convertResult:"Result: ",codeInputTitle:"Result from Column #{rangeDesc}:",attrInfoTitle:"Column #{colName} ",attrInfoAttrName:"Attr name: ",attrInfoType:"Type: ",ecEmptyValue:"ECharts Empty Value ('-')",jsDataTypeDimArray:"Array",jsDataTypeArrayObject:"Array + Object",jsDataTypeGEO:"GEO Coordinate",outputFormat:"Result Format: ",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"Paste names of countries or regions, and then click: ",geoConvertBtn:"Convert",geoDesc:"Explanation:B: longitude, C: latitude, D: alpha-2",dataTableControl:{clear:"Clear",lt:"⇱",rb:"⇲",l:"⇦",r:"⇨",t:"⇧",b:"⇩"}};return(window.EC_WWW_LANG||t("html").attr("lang")||"").toLowerCase().indexOf("zh")>-1?n:o}),define("spreadsheet/constant",["require"],function(e){var t={};return t.EC_EMPTY_VALUE="-",t.JSDATA_UPDATE_DELAY=700,t.JSDATA_DIM_ARRAY="dimArray",t.JSDATA_ARRAY_OBJECT="arrayObject",t.JSDATA_GEO="geo",t.UI_DATA_TABLE="dataTable",t.UI_CODE_INPUTS="codeInputs",t}),define("spreadsheet/helper",["require","jquery"],function(e){var t=e("jquery"),n={};return n.formatJSDataToEditorData=function(e,t,n){return e===t.getEmptyValue()?n.getEmptyValue():e},n.formatEditorDataToJSData=function(e,t,n){return e===n.getEmptyValue()?t.getEmptyValue():e},n.objectPropertyCount=function(e){e=e||{};var t=0;for(var n in e)e.hasOwnProperty(n)&&t++;return t},n.parseToArray=function(e){var n;try{n=new Function("return ("+e+")")()}catch(e){}return t.isArray(n)||(n=null),n},n}),function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define("handsontable",[],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.Handsontable=e()}}(function(){var e;return function e(t,n,o){function i(a,l){if(!n[a]){if(!t[a]){var u="function"==typeof require&&require;if(!l&&u)return u(a,!0);if(r)return r(a,!0);if(s[a]&&void 0!==window[s[a]])return window[s[a]];var c=new Error("Cannot find module '"+a+"'");throw c.code="MODULE_NOT_FOUND",c}var d=n[a]={exports:{}};t[a][0].call(d.exports,function(e){var n=t[a][1][e];return i(n||e)},d,d.exports,e,t,n,o)}return n[a].exports}for(var r="function"==typeof require&&require,s=JSON.parse('{"zeroclipboard":"ZeroClipboard","moment":"moment","numbro":"numbro","pikaday":"Pikaday"}')||{},a=0;a<o.length;a++)i(o[a]);return i}({1:[function(e,t,n){},{}],2:[function(e,t,n){window.jQuery&&function(e){e.fn.handsontable=function(e){var t,n,o,i,r,s=this.first(),a=s.data("handsontable");if("string"!=typeof e)return r=e||{},a?a.updateSettings(r):(a=new Handsontable.Core(s[0],r),s.data("handsontable",a),a.init()),s;if(o=[],arguments.length>1)for(t=1,n=arguments.length;t<n;t++)o.push(arguments[t]);if(a){if(void 0===a[e])throw new Error("Handsontable do not provide action: "+e);i=a[e].apply(a,o),"destroy"===e&&s.removeData()}return i}}(window.jQuery)},{}],3:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableBorder:{get:function(){return C}},__esModule:{value:!0}});var o,i,r,s,a,l,u=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},c=u.getComputedStyle,d=u.getTrimmingContainer,h=u.innerWidth,f=u.innerHeight,p=u.offset,g=u.outerHeight,m=u.outerWidth,v=((i=e("helpers/dom/event"))&&i.__esModule&&i||{default:i}).stopImmediatePropagation,w=((r=e("helpers/browser"))&&r.__esModule&&r||{default:r}).isMobileBrowser,y=((s=e("eventManager"))&&s.__esModule&&s||{default:s}).EventManager,b=((a=e("cell/coords"))&&a.__esModule&&a||{default:a}).WalkontableCellCoords,C=((l=e("overlay/_base.js"))&&l.__esModule,function(e,t){t&&(this.eventManager=new y(e),this.instance=e,this.wot=e,this.settings=t,this.mouseDown=!1,this.main=null,this.top=null,this.left=null,this.bottom=null,this.right=null,this.topStyle=null,this.leftStyle=null,this.bottomStyle=null,this.rightStyle=null,this.cornerDefaultStyle={width:"5px",height:"5px",borderWidth:"2px",borderStyle:"solid",borderColor:"#FFF"},this.corner=null,this.cornerStyle=null,this.createBorders(t),this.registerListeners())});$traceurRuntime.createClass(C,{registerListeners:function(){var e=this;this.eventManager.addEventListener(document.body,"mousedown",function(){return e.onMouseDown()}),this.eventManager.addEventListener(document.body,"mouseup",function(){return e.onMouseUp()});for(var t=this,n=0,o=this.main.childNodes.length;n<o;n++)!function(n,o){t.eventManager.addEventListener(t.main.childNodes[n],"mouseenter",function(t){return e.onMouseEnter(t,e.main.childNodes[n])})}(n)},onMouseDown:function(){this.mouseDown=!0},onMouseUp:function(){this.mouseDown=!1},onMouseEnter:function(e,t){function n(e){return e.clientY<Math.floor(r.top)||e.clientY>Math.ceil(r.top+r.height)||e.clientX<Math.floor(r.left)||e.clientX>Math.ceil(r.left+r.width)||void 0}function o(e){n(e)&&(i.eventManager.removeEventListener(document.body,"mousemove",o),t.style.display="block")}if(this.mouseDown&&this.wot.getSetting("hideBorderOnMouseDownOver")){e.preventDefault(),v(e);var i=this,r=t.getBoundingClientRect();t.style.display="none",this.eventManager.addEventListener(document.body,"mousemove",o)}},createBorders:function(e){this.main=document.createElement("div");var t=["top","left","bottom","right","corner"],n=this.main.style;n.position="absolute",n.top=0,n.left=0;for(var o=0;o<5;o++){var i=t[o],r=document.createElement("div");r.className="wtBorder "+(this.settings.className||""),this.settings[i]&&this.settings[i].hide&&(r.className+=" hidden"),n=r.style,n.backgroundColor=this.settings[i]&&this.settings[i].color?this.settings[i].color:e.border.color,n.height=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",n.width=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",this.main.appendChild(r)}this.top=this.main.childNodes[0],this.left=this.main.childNodes[1],this.bottom=this.main.childNodes[2],this.right=this.main.childNodes[3],this.topStyle=this.top.style,this.leftStyle=this.left.style,this.bottomStyle=this.bottom.style,this.rightStyle=this.right.style,this.corner=this.main.childNodes[4],this.corner.className+=" corner",this.cornerStyle=this.corner.style,this.cornerStyle.width=this.cornerDefaultStyle.width,this.cornerStyle.height=this.cornerDefaultStyle.height,this.cornerStyle.border=[this.cornerDefaultStyle.borderWidth,this.cornerDefaultStyle.borderStyle,this.cornerDefaultStyle.borderColor].join(" "),w()&&this.createMultipleSelectorHandles(),this.disappear(),this.wot.wtTable.bordersHolder||(this.wot.wtTable.bordersHolder=document.createElement("div"),this.wot.wtTable.bordersHolder.className="htBorders",this.wot.wtTable.spreader.appendChild(this.wot.wtTable.bordersHolder)),this.wot.wtTable.bordersHolder.insertBefore(this.main,this.wot.wtTable.bordersHolder.firstChild)},createMultipleSelectorHandles:function(){this.selectionHandles={topLeft:document.createElement("DIV"),topLeftHitArea:document.createElement("DIV"),bottomRight:document.createElement("DIV"),bottomRightHitArea:document.createElement("DIV")};this.selectionHandles.topLeft.className="topLeftSelectionHandle",this.selectionHandles.topLeftHitArea.className="topLeftSelectionHandle-HitArea",this.selectionHandles.bottomRight.className="bottomRightSelectionHandle",this.selectionHandles.bottomRightHitArea.className="bottomRightSelectionHandle-HitArea",this.selectionHandles.styles={topLeft:this.selectionHandles.topLeft.style,topLeftHitArea:this.selectionHandles.topLeftHitArea.style,bottomRight:this.selectionHandles.bottomRight.style,
+define("dt/ui/tooltip",["require","jquery","../lib/base","../lib/model"],function(e){function t(e){var t=n(),o=e.x,i=e.y;null==o&&(o=0),null==i&&(i=0);var r=e.xAnchor||"center",s=e.yAnchor||"top",a="left"===r?0:t.outerWidth(),l="top"===s?0:t.outerHeight();t.css({left:Math.round("left"===r?o:"center"===r?o-a/2:o-a)+"px",top:Math.round("top"===s?i:"center"===s?i-l/2:i-l)+"px"})}function n(){return f||(f=o('<div class="'+u+'" style="display:none;"></div>').appendTo(document.body)),f}var o=e("jquery"),i=e("../lib/base"),r=e("../lib/model"),s=o.isFunction,a=o.extend,l=".dtui-global-tooltip-namespace",u="dtui-global-tooltip",c={x:0,y:-5,xAnchor:"center",yAnchor:"bottom"},d={x:0,y:-15,xAnchor:"center",yAnchor:"bottom"},h={},f=null,p=!1;return h.showTooltip=function(e){if(!p){e=e||{};var o=e.text;if(null==o)return void h.hideTooltip();o=!1!==e.encodeHTML?i.encodeHTML(o):o,n().html(o).show(),t(e.location)}},h.hideTooltip=function(){n().hide()},h.disableTooltip=function(){h.hideTooltip(),p=!0},h.enableTooltip=function(){p=!1},h.bindTooltip=function(e){function n(e){m={currentTarget:e.currentTarget,pageX:e.pageX,pageY:e.pageY}}function u(t){var n=e.text;return s(n)?n(t.currentTarget):n}function f(e){var t=s(p)?p(e.currentTarget):a({},p||(g?d:c));if(g)t.x+=e.pageX,t.y+=e.pageY;else if(!p){var n=o(e.currentTarget),i=n.offset();t.x+=i.left+n.outerWidth()/2,t.y+=i.top}return t}e=r.merge({},e,{clone:!0,assignWhenCannotClone:!0});var p=e.location,g=e.followMouse;i.assert(!i.isJQuery(e.bindEl));var m,v=o(e.bindEl),w=["mouseenter"+l,function(t){n(t),h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})}],y=["mouseleave"+l,function(){m=null,h.hideTooltip()}],b=["mousemove"+l,function(e){n(e),t(f(m))}],C=e.selector;return C&&(w.splice(1,0,C),y.splice(1,0,C),b.splice(1,0,C)),v.on.apply(v,w).on.apply(v,y),g&&v.on.apply(v,b),{refresh:function(){m&&h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})},setText:function(t){m&&h.showTooltip({text:t,encodeHTML:e.encodeHTML,location:f(m)})},hide:function(){m&&h.hideTooltip()},dispose:function(){m&&(h.hideTooltip(),m=null),v.off(l)}}},h}),define("dt/lib",["require","./lib/Set","./lib/base","./lib/json","./lib/dataDriven","./lib/objectAccess","./lib/objectOriented","./lib/model","./lib/event","./lib/enumeration","./lib/disable","./lib/number","./lib/throttle","./lib/htmlCleaner","./lib/codeStringify","./lib/others","./lib/liteHashMap","./ui/tooltip"],function(e){var t={Set:e("./lib/Set")};return function(e){for(var t=1,n=arguments.length;t<n;t++){var o=arguments[t];for(var i in o)if(o.hasOwnProperty(i)){if(e[i])throw new Error("Duplicate key: "+i);e[i]=o[i]}}}(t,e("./lib/base"),e("./lib/json"),e("./lib/dataDriven"),e("./lib/objectAccess"),e("./lib/objectOriented"),e("./lib/model"),e("./lib/event"),e("./lib/enumeration"),e("./lib/disable"),e("./lib/number"),e("./lib/throttle"),e("./lib/htmlCleaner"),e("./lib/codeStringify"),e("./lib/others"),e("./lib/liteHashMap"),e("./ui/tooltip")),t}),function(e){function t(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e}function n(){this.raw=[],this.length=0}function o(){return"___"+k++}function i(e,t){var n=new Function;n.prototype=t.prototype,e.prototype=new n,e.prototype.constructor=e}function r(e){return x[e]}function s(e){return'"'+e.replace(/\x5C/g,"\\\\").replace(/"/g,'\\"').replace(/\x0A/g,"\\n").replace(/\x09/g,"\\t").replace(/\x0D/g,"\\r")+'"'}function a(e){return e.replace(/[\^\[\]\$\(\)\{\}\?\*\.\+]/g,function(e){return"\\"+e})}function l(e){var t=arguments;return e.replace(/\{([0-9]+)\}/g,function(e,n){return t[n-0+1]})}function u(e){return e=e.replace(/^\s*\*/,""),l('gv({0},["{1}"])',s(e),e.replace(/\[['"]?([^'"]+)['"]?\]/g,function(e,t){return"."+t}).split(".").join('","'))}function c(e,t,n,o,i,r){for(var s=n.length,a=e.split(t),l=0,u=[],c=0,d=a.length;d>c;c++){var h=a[c];if(c){var f=1;for(l++;;){var p=h.indexOf(n);if(0>p){u.push(l>1&&f?t:"",h);break}if(l=o?l-1:0,u.push(l>0&&f?t:"",h.slice(0,p),l>0?n:""),h=h.slice(p+s),f=0,0===l)break}0===l&&(i(u.join("")),r(h),u=[])}else h&&r(h)}l>0&&u.length>0&&(r(t),r(u.join("")))}function d(e,t,n){var o,i=[],r=t.options,a="",l="",h="",f="";return n&&(a="ts(",l=")",h=P,f=H,o=r.defaultFilter),c(e,r.variableOpen,r.variableClose,1,function(e){n&&e.indexOf("|")<0&&o&&(e+="|"+o);var r=e.indexOf("|"),s=(r>0?e.slice(0,r):e).replace(/^\s+/,"").replace(/\s+$/,""),c=r>0?e.slice(r+1):"",p=0===s.indexOf("*"),g=[p?"":a,u(s),p?"":l];if(c){c=d(c,t);for(var m=c.split("|"),v=0,w=m.length;w>v;v++){/^\s*([a-z0-9_-]+)(\((.*)\))?\s*$/i.test(m[v])&&(g.unshift('fs["'+RegExp.$1+'"]('),RegExp.$3&&g.push(",",RegExp.$3),g.push(")"))}}i.push(h,g.join(""),f)},function(e){i.push(h,n?s(e):e,f)}),i.join("")}function h(e,t){this.value=e,this.engine=t}function f(e,t){this.value=e,this.engine=t,this.children=[],this.cloneProps=[]}function p(e,t){var n=e.stack,o=t?n.find(function(e){return e instanceof t}):n.bottom();if(o){for(var i;(i=n.top())!==o;){if(!i.autoClose)throw new Error(i.type+" must be closed manually: "+i.value);i.autoClose(e)}o.close(e)}return o}function g(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(\s*master\s*=\s*([a-z0-9\/_-]+)\s*\))?\s*/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.master=RegExp.$3,this.name=RegExp.$1,f.call(this,e,t),this.blocks={}}function m(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name"]}function v(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name","state","blocks"],this.blocks={}}function w(e,t){if(!/^\s*([a-z0-9_]+)\s*=([\s\S]*)$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.expr=RegExp.$2,f.call(this,e,t),this.cloneProps=["name","expr"]}function y(e,t){if(!/^\s*([a-z0-9_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function b(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function C(e,t){if(!new RegExp(l("^\\s*({0}[\\s\\S]+{1})\\s+as\\s+{0}([0-9a-z_]+){1}\\s*(,\\s*{0}([0-9a-z_]+){1})?\\s*$",a(t.options.variableOpen),a(t.options.variableClose)),"i").test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.list=RegExp.$1,this.item=RegExp.$2,this.index=RegExp.$4,f.call(this,e,t),this.cloneProps=["list","item","index"]}function _(e,t){f.call(this,e,t)}function S(e,t){_.call(this,e,t)}function T(e,t){f.call(this,e,t)}function E(e,t){t.target=e;var n=t.engine,o=e.name;if(n.targets[o])switch(n.options.namingConflict){case"override":n.targets[o]=e,t.targets.push(o);case"ignore":break;default:throw new Error("Target exists: "+o)}else n.targets[o]=e,t.targets.push(o)}function R(e,t){I[e]=t,t.prototype.type=e}function M(e){this.options={commandOpen:"\x3c!--",commandClose:"--\x3e",commandSyntax:/^\s*(\/)?([a-z]+)\s*(?::([\s\S]*))?$/,variableOpen:"${",variableClose:"}",defaultFilter:"html"},this.config(e),this.targets={},this.filters=t({},D)}function O(e,t){function o(){var e;if(d.length>0&&(e=d.join(""))){var n=new h(e,t);n.beforeAdd(u),l.top().addChild(n),d=[],t.options.strip&&u.current instanceof f&&(n.value=e.replace(/^[\x20\t\r]*\n/,"")),u.current=n}}var i,r=t.options.commandOpen,s=t.options.commandClose,a=t.options.commandSyntax,l=new n,u={engine:t,targets:[],stack:l,target:null},d=[];return c(e,r,s,0,function(e){var n=a.exec(e);if(n&&(i=I[n[2].toLowerCase()])&&"function"==typeof i){o();var l=u.current;t.options.strip&&l instanceof h&&(l.value=l.value.replace(/\r?\n[\x20\t]*$/,"\n")),n[1]?l=p(u,i):(l=new i(n[3],t),"function"==typeof l.beforeOpen&&l.beforeOpen(u),l.open(u)),u.current=l}else/^\s*\/\//.test(e)||d.push(r,e,s);i=null},function(e){d.push(e)}),o(),p(u),u.targets}n.prototype={push:function(e){this.raw[this.length++]=e},pop:function(){if(this.length>0){var e=this.raw[--this.length];return this.raw.length=this.length,e}},top:function(){return this.raw[this.length-1]},bottom:function(){return this.raw[0]},find:function(e){for(var t=this.length;t--;){var n=this.raw[t];if(e(n))return n}}};var k=178245,x={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},D={html:function(e){return e.replace(/[&<>"']/g,r)},url:encodeURIComponent,raw:function(e){return e}},A='var r="";',P="r+=",H=";",N="return r;";"undefined"!=typeof navigator&&/msie\s*([0-9]+)/i.test(navigator.userAgent)&&RegExp.$1-0<8&&(A="var r=[],ri=0;",P="r[ri++]=",N='return r.join("");'),h.prototype={getRendererBody:function(){var e=this.value,t=this.engine.options;return!e||t.strip&&/^\s*$/.test(e)?"":d(e,this.engine,1)},clone:function(){return this}},f.prototype={addChild:function(e){this.children.push(e)},open:function(e){var t=e.stack.top();t&&t.addChild(this),e.stack.push(this)},close:function(e){e.stack.top()===this&&e.stack.pop()},getRendererBody:function(){for(var e=[],t=this.children,n=0;n<t.length;n++)e.push(t[n].getRendererBody());return e.join("")},clone:function(){for(var e=new this.constructor(this.value,this.engine),t=0,n=this.children.length;n>t;t++)e.addChild(this.children[t].clone());for(var t=0,n=this.cloneProps.length;n>t;t++){var o=this.cloneProps[t];e[o]=this[o]}return e}};i(g,f),i(m,f),i(v,f),i(w,f),i(y,f),i(b,f),i(C,f),i(_,f),i(S,_),i(T,_);var L={READING:1,READED:2,APPLIED:3,READY:4};v.prototype.applyMaster=g.prototype.applyMaster=function(e){function t(e){var o=e.children;if(o instanceof Array)for(var i=0,r=o.length;r>i;i++){var s=o[i];s instanceof m&&n[s.name]&&(s=o[i]=n[s.name]),t(s)}}if(this.state>=L.APPLIED)return 1;var n=this.blocks,o=this.engine.targets[e];return o&&o.applyMaster(o.master)?(this.children=o.clone().children,t(this),this.state=L.APPLIED,1):void 0},g.prototype.isReady=function(){function e(o){for(var i=0,r=o.children.length;r>i;i++){var s=o.children[i];if(s instanceof v){var a=t.targets[s.name];n=n&&a&&a.isReady(t)}else s instanceof f&&e(s)}}if(this.state>=L.READY)return 1;var t=this.engine,n=1;return this.applyMaster(this.master)?(e(this),n&&(this.state=L.READY),n):void 0},g.prototype.getRenderer=function(){if(this.renderer)return this.renderer;if(this.isReady()){var e=new Function("data","engine",['data=data||{};var v={},fs=engine.filters,hg=typeof data.get=="function",gv=function(n,ps){var p=ps[0],d=v[p];if(d==null){if(hg){return data.get(n);}d=data[p];}for(var i=1,l=ps.length;i<l;i++)if(d!=null)d = d[ps[i]];return d;},ts=function(s){if(typeof s==="string"){return s;}if(s==null){s="";}return ""+s;};',A,this.getRendererBody(),N].join("\n")),t=this.engine;return this.renderer=function(n){return e(n,t)},this.renderer}return null},g.prototype.open=function(e){p(e),f.prototype.open.call(this,e),this.state=L.READING,E(this,e)},w.prototype.open=b.prototype.open=function(e){e.stack.top().addChild(this)},m.prototype.open=function(e){f.prototype.open.call(this,e),(e.imp||e.target).blocks[this.name]=this},S.prototype.open=function(e){(new T).open(e),p(e,_).addChild(this),e.stack.push(this)},T.prototype.open=function(e){p(e,_).addChild(this),e.stack.push(this)},v.prototype.open=function(e){this.parent=e.stack.top(),this.target=e.target,f.prototype.open.call(this,e),this.state=L.READING,e.imp=this},b.prototype.close=w.prototype.close=function(){},v.prototype.close=function(e){f.prototype.close.call(this,e),this.state=L.READED,e.imp=null},g.prototype.close=function(e){f.prototype.close.call(this,e),this.state=this.master?L.READED:L.APPLIED,e.target=null},v.prototype.autoClose=function(e){var t=this.parent.children;t.push.apply(t,this.children),this.children.length=0;for(var n in this.blocks)this.target.blocks[n]=this.blocks[n];this.blocks={},this.close(e)},b.prototype.beforeOpen=v.prototype.beforeOpen=w.prototype.beforeOpen=C.prototype.beforeOpen=y.prototype.beforeOpen=m.prototype.beforeOpen=_.prototype.beforeOpen=h.prototype.beforeAdd=function(e){if(!e.stack.bottom()){new g(o(),e.engine).open(e)}},v.prototype.getRendererBody=function(){return this.applyMaster(this.name),f.prototype.getRendererBody.call(this)},b.prototype.getRendererBody=function(){return l("{0}engine.render({2},{{3}}){1}",P,H,s(this.name),d(this.args,this.engine).replace(/(^|,)\s*([a-z0-9_]+)\s*=/gi,function(e,t,n){return(t||"")+s(n)+":"}))},w.prototype.getRendererBody=function(){return this.expr?l("v[{0}]={1};",s(this.name),d(this.expr,this.engine)):""},_.prototype.getRendererBody=function(){return l("if({0}){{1}}",d(this.value,this.engine),f.prototype.getRendererBody.call(this))},T.prototype.getRendererBody=function(){return l("}else{{0}",f.prototype.getRendererBody.call(this))},C.prototype.getRendererBody=function(){return l('var {0}={1};if({0} instanceof Array)for (var {4}=0,{5}={0}.length;{4}<{5};{4}++){v[{2}]={4};v[{3}]={0}[{4}];{6}}else if(typeof {0}==="object")for(var {4} in {0}){v[{2}]={4};v[{3}]={0}[{4}];{6}}',o(),d(this.list,this.engine),s(this.index||o()),s(this.item),o(),o(),f.prototype.getRendererBody.call(this))},y.prototype.getRendererBody=function(){var e=this.args;return l("{2}fs[{5}]((function(){{0}{4}{1}})(){6}){3}",A,N,P,H,f.prototype.getRendererBody.call(this),s(this.name),e?","+d(e,this.engine):"")};var I={};R("target",g),R("block",m),R("import",v),R("use",b),R("var",w),R("for",C),R("if",_),R("elif",S),R("else",T),R("filter",y),M.prototype.config=function(e){t(this.options,e)},M.prototype.compile=M.prototype.parse=function(e){if(e){var t=O(e,this);if(t.length)return this.targets[t[0]].getRenderer()}return new Function('return ""')},M.prototype.getRenderer=function(e){var t=this.targets[e];return t?t.getRenderer():void 0},M.prototype.render=function(e,t){var n=this.getRenderer(e);return n?n(t):""},M.prototype.addFilter=function(e,t){"function"==typeof t&&(this.filters[e]=t)};var W=new M;W.Engine=M,"object"==typeof exports&&"object"==typeof module?exports=module.exports=W:"function"==typeof define&&define.amd?define("etpl",W):e.etpl=W}(this),define("dt/tpl",["require","etpl","./lib"],function(e){function t(e){for(var t=!1,n=!1,o=1;o<arguments.length;o++)"raw"===arguments[o]&&(t=!0),"null"===arguments[o]&&(n=!0);return null!=e||n||(e=""),i.obTypeOf(e)&&(e=e()),e=String(e),t?e:i.encodeHTML(e)}function n(e){return null==e&&(e=""),String(e).replace(/^option\./,"")}var o=e("etpl"),i=e("./lib"),r={};return o.config({commandOpen:"{{",commandClose:"}}",defaultFilter:"ob"}),o.addFilter("ob",t),o.addFilter("dsp",n),r.render=function(e,t,n){return!o.getRenderer(e)&&n&&o.compile(n),o.render(e,t||{})},r}),define("dt/ui/Component",["require","jquery","dt/lib","dt/tpl"],function(e){function t(){function e(e){t.disabled(e)}var t=this._viewModel();t.visible=m.ob(!0);var n=t.disabled;t.disabled=m.ob(!1),null!=n&&this._disposable(n.subscribe(e,this))}function n(e){if(e){var t=b(this);e=t.$el=g(e),t.el=e[0],m.bindComponent(e,this),e.addClass(this.getFullCss().join(" "));var n=this._viewModel(),r=n.disabled,s=n.visible;this._disposable(r.subscribe(o,this)),this._disposable(s.subscribe(i,this)),o.call(this,r()),s("none"!==e[0].style.display)}}function o(e){this.$el()[e?"addClass":"removeClass"](this.getFullCss("-disabled").join(" "))}function i(e){this.$el()[e?"show":"hide"]()}function r(){var e=b(this).cptDef.tplTarget||this._getDefineProperty("tplTarget"),t=this.$el();e&&t&&t.length&&this._renderTpl(e,null,t),!this._getDefineProperty("suppressConstructSub")&&t&&t.length&&this._constructSub(t)}function s(){var e=this.$el(),t=b(this);e.off(t.eventNamespace),e.removeClass(this.getFullCss().join(" ")),t.viewModel=null,t.el=null,t.$el=null,t.subComponents=null,t.sub$Els=null,m.bindComponent(e,!1)}function a(e,t,n){if(!n&&m.isComponent(e)||n&&m.isJQuery(e))t(e);else if("object"===g.type(e)&&!m.isAtom(e))for(var o in e)e.hasOwnProperty(o)&&null!=e[o]&&a(e[o],t,n)}function l(e){var t=b(this),n=t.viewModel={},o=this;return this._traverseFromAncestor(function(e){n=m.merge(n,e.defineProperties.viewModel.call(o),{onlyMergeOwnPropertyInTarget:!1,levelOneNeedMerge:null,clone:!1})}),n=m.merge(n,e,{onlyMergeOwnPropertyInTarget:!!this._getDefineProperty("viewModelOnlyAccessDeclaredProperties"),levelOneNeedMerge:t.viewModelMergeMap||{}}),t.viewModel=n,n}function u(){var e=b(this),t=e.viewModelPublicMap={},n=e.viewModelMergeMap={};this._traverseFromAncestor(function(e){for(var o=e.defineProperties.viewModelPublic||[],i=0,r=o.length;i<r;i++)t[o[i]]=1;for(var s=e.defineProperties.viewModelMerge||[],i=0,r=s.length;i<r;i++)n[s[i]]=1})}function c(){var e=this._viewModel(),t=b(this),n=[];this._traverseFromAncestor(function(e){var t=e.defineProperties.css;g.isArray(t)?n.push.apply(n,t):t&&n.push(t)}),t.basicCss=n;var o=e&&e.css||[];g.isArray(o)||(o=[o]),t.extraCss=o}function d(e){return e=w.normalizePath(e),!!b(this).viewModelPublicMap[e]}function h(e){if(e&&g.isFunction(e.dispose))try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}else e&&m.isJQuery(e)&&e.off(this._event())}function f(e){if(e=e||b(this).subComponents,a(e,function(e){try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}}),!m.isAtom(e))for(var t in e)e.hasOwnProperty(t)&&(e[t]=null)}function p(e){e=e||b(this).sub$els;var t=this._event();if(a(e,function(e){e.off(t)},!0),!m.isAtom(e))for(var n in e)e.hasOwnProperty(n)&&(e[n]=null)}var g=e("jquery"),m=e("dt/lib"),v=e("dt/tpl"),w=m.getByPath,y=m.setByPath,b=m.makeInner(),C=b.attach(m.newClass(m.enableEvent({_define:{tpl:"",tplTarget:"",css:"",viewModel:function(){return{disabled:null,visible:null,css:"",tplTarget:null,tplRenderMode:"html"}},viewModelPublic:["disabled","visible"],viewModelMerge:[],viewModelOnlyAccessDeclaredProperties:!0,suppressConstructSub:!1},_prepare:g.noop,_init:g.noop,_dispose:g.noop,_disposeFinally:g.noop,_run:g.noop,_event:function(e){var t=b(this).eventNamespace;return(null!=e?e:"")+t},_parseViewModel:function(e,t){return e},_parseCptDef:function(e){return e},_construct:function(e,o,i){arguments.length>0&&m.assert(null!=e),!e||g.isPlainObject(e)?(i=o,o=e,e=null):e=g(e),i=g.extend({},i),m.isComponent(this,!0);var s=b(this);s.cptDef=i,s.eventNamespace=".namespace"+m.localUID(),s.subComponents={},s.sub$Els={},s.disposed=!1,s.cptDisposableArea={},s.cptInstanceUID="cpt-instance-"+m.localUID(),u.call(this),o=this._parseViewModel(o||{},i)||{},l.call(this,o),c.call(this),t.call(this),n.call(this,e),this._prepare(),r.call(this),this._init()},dispose:function(){var e=b(this);if(!e.disposed){var t=this.el(),n=this["__originalHTML"]||"";this._dispose(),f.call(this),p.call(this),this._disposable(!1),s.call(this),this._disposeFinally(),t.innerHTML=n,e.disposed=!0}},isDisposed:function(){return!!b(this).disposed},isFrozen:function(){return this._viewModel().disabled()||this.isDisposed()},_disposable:function(e,t){m.assert(null!=e);var n=b(this).cptDisposableArea;if(null==e)return e;if(!1===e)for(var o in n)n.hasOwnProperty(o)&&(h.call(this,n[o]),n[o]=null);else"string"===g.type(e)?(h.call(this,n[e]),n[e]=null):(m.assert(g.isFunction(e.dispose)||m.isJQuery(e),"No dispose method nor not jQuery!"),t=t||"-component-anonymouse-disposable"+m.localUID(),n[t]=e);return e},resize:g.noop,_manuInitView:function(e){n.call(this,e),this._constructSub(e)},_applyTpl:function(e,t){t&&(this._renderTpl(t,null,e),this._constructSub(e))},_renderTpl:function(e,t,n){var o={viewModel:t||this._viewModel(),lang:this.getLang(),constant:this.getConstant()},i=v.render(e,o,this._getDefineProperty("tpl"))||"";return n&&g(n)[this._viewModel().tplRenderMode](i),i},_constructSub:function(e,t){var n=g(e);m.assert(n.length),t&&n.data("cpt")&&this._constructSubCpt.call(this,e);var o=this;g("*[data-cpt]",n).each(function(e,t){o._constructSubCpt(t)})},_constructSubCpt:function(e){var t=g(e),n=e.innerHTML,o=this._viewModel(),i=this._parseCptDef(new Function("viewModel","lib","lang","constant","return {"+t.data("cpt")+"};").call(this,o,m,this.getLang(),this.getConstant())),r=this.getCptClass(i.type),s=i.viewModelGet?w(i.viewModelGet,o):i.viewModel,a=new r(e,s,i);return a["__originalHTML"]=n,this._sub(i.name||"-sub-cpt-name-"+m.localUID(),a)},recreateSubCpt:function(e){var t=this._sub(e);if(t){var n=t.el();t.dispose(),this._sub(e,null),this._constructSubCpt(n)}},traversalRun:function(e){a(b(this).subComponents,function(t){t.traversalRun(e)}),this._run(e)},_sub:function(e,t,n){var o=b(this).subComponents;return arguments.length<2?w(e,o,w.actionChoice.notPlainReturn):(y(e,t,o,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},_getDefineProperty:function(e){return this.constructor.defineProperties[e]},el:function(){return b(this).el},$el:function(e,t,n){var o=b(this);return 0===arguments.length?o.$el:1===arguments.length?w(e,o.sub$Els,w.actionChoice.notPlainReturn):(y(e,t,o.sub$Els,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},css:function(){return this._getDefineProperty("css")||""},viewModel:function(e){if(d.call(this,e))return w(e,b(this).viewModel);throw new Error(e+" is private!")},_viewModel:function(){return b(this).viewModel},getCptClass:function(e){return C.cptClasses[e]},getCptDef:function(e){return b(this).cptDef[e]},uid:function(){return b(this).cptInstanceUID},getFullCss:function(e){var t=["dtui-cpt"],n=b(this);return t.push.apply(t,n.basicCss||[]),t.push.apply(t,n.extraCss||[]),g.map(t,function(t){return t+(e||"")})},isDisabled:function(){return!!m.peek(this._viewModel().disabled)},getLang:function(){return C.defaultLanguageSet},getConstant:function(){return C.defaultConstant},clone:g.noop,_traverseFromAncestor:function(e){for(var t=[],n=this.constructor;n;n=n.prototype._superClass)t.push(n);for(var o=t.length;o--;)e.call(this,t[o])},localOb:function(e,t){var n,o=b(this),i=o.localObRepo||(o.localObRepo={});return arguments.length>1?!1===t?(n=i[e],delete i[e]):(m.assert(null==i[e]),n=i[e]=t):n=i[e],n},getAncestorLocalOb:function(e){for(var t,n,o=this.$el();(o=o&&o.parent())[0]&&!(n=(t=m.getComponent(o))&&t.localOb(e))&&o[0]!==document.body;);return n}})));return C.cptClasses={},C.defaultLanguageSet={},C.defaultConstant={},C.consoleLog=function(e){var t=window.console;m.isObject(t)&&"function"==typeof t.log&&t.log(m.stringifyJSON(e))},C}),define("spreadsheet/lang",["require","jquery"],function(e){var t=e("jquery"),n={langCode:"zh",pageTitle:"表格数据转换工具",pageDescHTML:"使用说明:在<strong>左侧</strong>贴入数据&nbsp;&nbsp;<strong>右下方</strong>立刻产生结果",typeSetting:"结果类型:",emptyValueSetting:"空值设置:",quotationMarkSetting:"引号设置:",quotationMarks:{singleQuotes:"单引号",doubleQuotes:"双引号"},dimensionSetting:"维度设置:",attributeSetting:"属性设置:",codeFormatSetting:"格式化:",codeFormat:{compressed:"压缩",expanded2Indent:"展开(2空格缩进)",expanded4Indent:"展开(4空格缩进)"},convertResult:"转换结果:",dimDesc:{dimallto2:"整体转换成一个二维数组",dim1to1:"每一列转换为一个一维数组",dim1to2:"每一列转换成一个二维数组",dim2to2:"每二列转换成一个二维数组",dim3to2:"每三列转换成一个二维数组",dim4to2:"每四列转换成一个二维数组",dim5to2:"每五列转换成一个二维数组",dim6to2:"每六列转换成一个二维数组"},codeInputTitle:"#{rangeDesc} 列转换结果:",attrInfoTitle:"列 #{colName} ",attrInfoAttrName:"属性名:",attrInfoType:"类型:",ecEmptyValue:"ECharts标准空值(中划线:'-')",jsDataTypeDimArray:"纯数组",jsDataTypeArrayObject:"数组+对象",jsDataTypeGEO:"地理坐标",outputFormat:"结果格式:",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"在第一列贴入国家或地区名称,然后点击:",geoConvertBtn:"转换成坐标",geoDesc:"结果解释:B 列:经度,C 列:纬度,D 列:2位简称",dataTableControl:{clear:"清空",lt:"⇱",rb:"⇲",l:"⇇",r:"⇉",t:"⇈",b:"⇊"}},o={langCode:"en",pageTitle:"Spreadsheet Data Converter",pageDescHTML:"Tip: Paste data on the <strong>left</strong>, and get result <strong>below</strong> immediately.",typeSetting:"Type: ",emptyValueSetting:"Empty Value: ",quotationMarkSetting:"Quotation Mark: ",quotationMarks:{singleQuotes:"single quotation mark",doubleQuotes:"double quotation mark"},dimensionSetting:"Dimension: ",dimDesc:{dim1to1:"Convert to a 1-dimension array every column.",dimallto2:"Convert all of the data to a 2-dimension array.",dim1to2:"Convert to a 2-dimension array every column.",dim2to2:"Convert to a 2-dimension array every 2 columns.",dim3to2:"Convert to a 2-dimension array every 3 columns.",dim4to2:"Convert to a 2-dimension array every 4 columns.",dim5to2:"Convert to a 2-dimension array every 5 columns."},attributeSetting:"Attributes: ",codeFormatSetting:"Formatting Result: ",codeFormat:{compressed:"compress",expanded2Indent:"expand and indent with 2 spaces",expanded4Indent:"expand and indent with 4 spaces"},convertResult:"Result: ",codeInputTitle:"Result from Column #{rangeDesc}:",attrInfoTitle:"Column #{colName} ",attrInfoAttrName:"Attr name: ",attrInfoType:"Type: ",ecEmptyValue:"ECharts Empty Value ('-')",jsDataTypeDimArray:"Array",jsDataTypeArrayObject:"Array + Object",jsDataTypeGEO:"GEO Coordinate",outputFormat:"Result Format: ",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"Paste names of countries or regions, and then click: ",geoConvertBtn:"Convert",geoDesc:"Explanation:B: longitude, C: latitude, D: alpha-2",dataTableControl:{clear:"Clear",lt:"⇱",rb:"⇲",l:"⇦",r:"⇨",t:"⇧",b:"⇩"}};return(window.EC_WWW_LANG||t("html").attr("lang")||"").toLowerCase().indexOf("zh")>-1?n:o}),define("spreadsheet/constant",["require"],function(e){var t={};return t.EC_EMPTY_VALUE="-",t.JSDATA_UPDATE_DELAY=700,t.JSDATA_DIM_ARRAY="dimArray",t.JSDATA_ARRAY_OBJECT="arrayObject",t.JSDATA_GEO="geo",t.UI_DATA_TABLE="dataTable",t.UI_CODE_INPUTS="codeInputs",t}),define("spreadsheet/helper",["require","jquery"],function(e){var t=e("jquery"),n={};return n.formatJSDataToEditorData=function(e,t,n){return e===t.getEmptyValue()?n.getEmptyValue():e},n.formatEditorDataToJSData=function(e,t,n){return e===n.getEmptyValue()?t.getEmptyValue():e},n.objectPropertyCount=function(e){e=e||{};var t=0;for(var n in e)e.hasOwnProperty(n)&&t++;return t},n.parseToArray=function(e){var n;try{n=new Function("return ("+e+")")()}catch(e){}return t.isArray(n)||(n=null),n},n}),function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define("handsontable",[],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.Handsontable=e()}}(function(){var e;return function e(t,n,o){function i(a,l){if(!n[a]){if(!t[a]){var u="function"==typeof require&&require;if(!l&&u)return u(a,!0);if(r)return r(a,!0);if(s[a]&&void 0!==window[s[a]])return window[s[a]];var c=new Error("Cannot find module '"+a+"'");throw c.code="MODULE_NOT_FOUND",c}var d=n[a]={exports:{}};t[a][0].call(d.exports,function(e){var n=t[a][1][e];return i(n||e)},d,d.exports,e,t,n,o)}return n[a].exports}for(var r="function"==typeof require&&require,s=JSON.parse('{"zeroclipboard":"ZeroClipboard","moment":"moment","numbro":"numbro","pikaday":"Pikaday"}')||{},a=0;a<o.length;a++)i(o[a]);return i}({1:[function(e,t,n){},{}],2:[function(e,t,n){window.jQuery&&function(e){e.fn.handsontable=function(e){var t,n,o,i,r,s=this.first(),a=s.data("handsontable");if("string"!=typeof e)return r=e||{},a?a.updateSettings(r):(a=new Handsontable.Core(s[0],r),s.data("handsontable",a),a.init()),s;if(o=[],arguments.length>1)for(t=1,n=arguments.length;t<n;t++)o.push(arguments[t]);if(a){if(void 0===a[e])throw new Error("Handsontable do not provide action: "+e);i=a[e].apply(a,o),"destroy"===e&&s.removeData()}return i}}(window.jQuery)},{}],3:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableBorder:{get:function(){return C}},__esModule:{value:!0}});var o,i,r,s,a,l,u=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},c=u.getComputedStyle,d=u.getTrimmingContainer,h=u.innerWidth,f=u.innerHeight,p=u.offset,g=u.outerHeight,m=u.outerWidth,v=((i=e("helpers/dom/event"))&&i.__esModule&&i||{default:i}).stopImmediatePropagation,w=((r=e("helpers/browser"))&&r.__esModule&&r||{default:r}).isMobileBrowser,y=((s=e("eventManager"))&&s.__esModule&&s||{default:s}).EventManager,b=((a=e("cell/coords"))&&a.__esModule&&a||{default:a}).WalkontableCellCoords,C=((l=e("overlay/_base.js"))&&l.__esModule,function(e,t){t&&(this.eventManager=new y(e),this.instance=e,this.wot=e,this.settings=t,this.mouseDown=!1,this.main=null,this.top=null,this.left=null,this.bottom=null,this.right=null,this.topStyle=null,this.leftStyle=null,this.bottomStyle=null,this.rightStyle=null,this.cornerDefaultStyle={width:"5px",height:"5px",borderWidth:"2px",borderStyle:"solid",borderColor:"#FFF"},this.corner=null,this.cornerStyle=null,this.createBorders(t),this.registerListeners())});$traceurRuntime.createClass(C,{registerListeners:function(){var e=this;this.eventManager.addEventListener(document.body,"mousedown",function(){return e.onMouseDown()}),this.eventManager.addEventListener(document.body,"mouseup",function(){return e.onMouseUp()});for(var t=this,n=0,o=this.main.childNodes.length;n<o;n++)!function(n,o){t.eventManager.addEventListener(t.main.childNodes[n],"mouseenter",function(t){return e.onMouseEnter(t,e.main.childNodes[n])})}(n)},onMouseDown:function(){this.mouseDown=!0},onMouseUp:function(){this.mouseDown=!1},onMouseEnter:function(e,t){function n(e){return e.clientY<Math.floor(r.top)||e.clientY>Math.ceil(r.top+r.height)||e.clientX<Math.floor(r.left)||e.clientX>Math.ceil(r.left+r.width)||void 0}function o(e){n(e)&&(i.eventManager.removeEventListener(document.body,"mousemove",o),t.style.display="block")}if(this.mouseDown&&this.wot.getSetting("hideBorderOnMouseDownOver")){e.preventDefault(),v(e);var i=this,r=t.getBoundingClientRect();t.style.display="none",this.eventManager.addEventListener(document.body,"mousemove",o)}},createBorders:function(e){this.main=document.createElement("div");var t=["top","left","bottom","right","corner"],n=this.main.style;n.position="absolute",n.top=0,n.left=0;for(var o=0;o<5;o++){var i=t[o],r=document.createElement("div");r.className="wtBorder "+(this.settings.className||""),this.settings[i]&&this.settings[i].hide&&(r.className+=" hidden"),n=r.style,n.backgroundColor=this.settings[i]&&this.settings[i].color?this.settings[i].color:e.border.color,n.height=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",n.width=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",this.main.appendChild(r)}this.top=this.main.childNodes[0],this.left=this.main.childNodes[1],this.bottom=this.main.childNodes[2],this.right=this.main.childNodes[3],this.topStyle=this.top.style,this.leftStyle=this.left.style,this.bottomStyle=this.bottom.style,this.rightStyle=this.right.style,this.corner=this.main.childNodes[4],this.corner.className+=" corner",this.cornerStyle=this.corner.style,this.cornerStyle.width=this.cornerDefaultStyle.width,this.cornerStyle.height=this.cornerDefaultStyle.height,this.cornerStyle.border=[this.cornerDefaultStyle.borderWidth,this.cornerDefaultStyle.borderStyle,this.cornerDefaultStyle.borderColor].join(" "),w()&&this.createMultipleSelectorHandles(),this.disappear(),this.wot.wtTable.bordersHolder||(this.wot.wtTable.bordersHolder=document.createElement("div"),this.wot.wtTable.bordersHolder.className="htBorders",this.wot.wtTable.spreader.appendChild(this.wot.wtTable.bordersHolder)),this.wot.wtTable.bordersHolder.insertBefore(this.main,this.wot.wtTable.bordersHolder.firstChild)},createMultipleSelectorHandles:function(){this.selectionHandles={topLeft:document.createElement("DIV"),topLeftHitArea:document.createElement("DIV"),bottomRight:document.createElement("DIV"),bottomRightHitArea:document.createElement("DIV")};this.selectionHandles.topLeft.className="topLeftSelectionHandle",this.selectionHandles.topLeftHitArea.className="topLeftSelectionHandle-HitArea",this.selectionHandles.bottomRight.className="bottomRightSelectionHandle",this.selectionHandles.bottomRightHitArea.className="bottomRightSelectionHandle-HitArea",this.selectionHandles.styles={topLeft:this.selectionHandles.topLeft.style,topLeftHitArea:this.selectionHandles.topLeftHitArea.style,bottomRight:this.selectionHandles.bottomRight.style,
 bottomRightHitArea:this.selectionHandles.bottomRightHitArea.style};var e={position:"absolute",height:"40px",width:"40px","border-radius":parseInt(40/1.5,10)+"px"};for(var t in e)e.hasOwnProperty(t)&&(this.selectionHandles.styles.bottomRightHitArea[t]=e[t],this.selectionHandles.styles.topLeftHitArea[t]=e[t]);var n={position:"absolute",height:"10px",width:"10px","border-radius":parseInt(10/1.5,10)+"px",background:"#F5F5FF",border:"1px solid #4285c8"};for(var o in n)n.hasOwnProperty(o)&&(this.selectionHandles.styles.bottomRight[o]=n[o],this.selectionHandles.styles.topLeft[o]=n[o]);this.main.appendChild(this.selectionHandles.topLeft),this.main.appendChild(this.selectionHandles.bottomRight),this.main.appendChild(this.selectionHandles.topLeftHitArea),this.main.appendChild(this.selectionHandles.bottomRightHitArea)},isPartRange:function(e,t){return!(!this.wot.selections.area.cellRange||e==this.wot.selections.area.cellRange.to.row&&t==this.wot.selections.area.cellRange.to.col)},updateMultipleSelectionHandlesPosition:function(e,t,n,o,i,r){var s=parseInt(this.selectionHandles.styles.topLeft.width,10),a=parseInt(this.selectionHandles.styles.topLeftHitArea.width,10);this.selectionHandles.styles.topLeft.top=parseInt(n-s,10)+"px",this.selectionHandles.styles.topLeft.left=parseInt(o-s,10)+"px",this.selectionHandles.styles.topLeftHitArea.top=parseInt(n-a/4*3,10)+"px",this.selectionHandles.styles.topLeftHitArea.left=parseInt(o-a/4*3,10)+"px",this.selectionHandles.styles.bottomRight.top=parseInt(n+r,10)+"px",this.selectionHandles.styles.bottomRight.left=parseInt(o+i,10)+"px",this.selectionHandles.styles.bottomRightHitArea.top=parseInt(n+r-a/4,10)+"px",this.selectionHandles.styles.bottomRightHitArea.left=parseInt(o+i-a/4,10)+"px",this.settings.border.multipleSelectionHandlesVisible&&this.settings.border.multipleSelectionHandlesVisible()?(this.selectionHandles.styles.topLeft.display="block",this.selectionHandles.styles.topLeftHitArea.display="block",this.isPartRange(e,t)?(this.selectionHandles.styles.bottomRight.display="none",this.selectionHandles.styles.bottomRightHitArea.display="none"):(this.selectionHandles.styles.bottomRight.display="block",this.selectionHandles.styles.bottomRightHitArea.display="block")):(this.selectionHandles.styles.topLeft.display="none",this.selectionHandles.styles.bottomRight.display="none",this.selectionHandles.styles.topLeftHitArea.display="none",this.selectionHandles.styles.bottomRightHitArea.display="none"),e==this.wot.wtSettings.getSetting("fixedRowsTop")||t==this.wot.wtSettings.getSetting("fixedColumnsLeft")?(this.selectionHandles.styles.topLeft.zIndex="9999",this.selectionHandles.styles.topLeftHitArea.zIndex="9999"):(this.selectionHandles.styles.topLeft.zIndex="",this.selectionHandles.styles.topLeftHitArea.zIndex="")},appear:function(e){if(!this.disabled){var t,n,o,i,r,s,a,l,u,v,y,C,_,S,T,E,R,M;M=this.wot.wtTable.getRenderedRowsCount();for(var O=0;O<M;O++){var k=this.wot.wtTable.rowFilter.renderedToSource(O);if(k>=e[0]&&k<=e[2]){_=k;break}}for(var x=M-1;x>=0;x--){var D=this.wot.wtTable.rowFilter.renderedToSource(x);if(D>=e[0]&&D<=e[2]){T=D;break}}M=this.wot.wtTable.getRenderedColumnsCount();for(var A=0;A<M;A++){var P=this.wot.wtTable.columnFilter.renderedToSource(A);if(P>=e[1]&&P<=e[3]){S=P;break}}for(var H=M-1;H>=0;H--){var N=this.wot.wtTable.columnFilter.renderedToSource(H);if(N>=e[1]&&N<=e[3]){E=N;break}}if(void 0===_||void 0===S)return void this.disappear();t=_!==T||S!==E,n=this.wot.wtTable.getCell(new b(_,S)),o=t?this.wot.wtTable.getCell(new b(T,E)):n,i=p(n),r=t?p(o):i,s=p(this.wot.wtTable.TABLE),l=i.top,y=r.top+g(o)-l,v=i.left,C=r.left+m(o)-v,a=l-s.top-1,u=v-s.left-1;var L=c(n);parseInt(L.borderTopWidth,10)>0&&(a+=1,y=y>0?y-1:0),parseInt(L.borderLeftWidth,10)>0&&(u+=1,C=C>0?C-1:0),this.topStyle.top=a+"px",this.topStyle.left=u+"px",this.topStyle.width=C+"px",this.topStyle.display="block",this.leftStyle.top=a+"px",this.leftStyle.left=u+"px",this.leftStyle.height=y+"px",this.leftStyle.display="block";var I=Math.floor(this.settings.border.width/2);this.bottomStyle.top=a+y-I+"px",this.bottomStyle.left=u+"px",this.bottomStyle.width=C+"px",this.bottomStyle.display="block",this.rightStyle.top=a+"px",this.rightStyle.left=u+C-I+"px",this.rightStyle.height=y+1+"px",this.rightStyle.display="block",w()||!this.hasSetting(this.settings.border.cornerVisible)||this.isPartRange(T,E)?this.cornerStyle.display="none":(this.cornerStyle.top=a+y-4+"px",this.cornerStyle.left=u+C-4+"px",this.cornerStyle.borderRightWidth=this.cornerDefaultStyle.borderWidth,this.cornerStyle.width=this.cornerDefaultStyle.width,this.cornerStyle.display="block",R=d(this.wot.wtTable.TABLE),E===this.wot.getSetting("totalColumns")-1&&o.offsetLeft+m(o)>=h(R)&&(this.cornerStyle.left=Math.floor(u+C-3-parseInt(this.cornerDefaultStyle.width)/2)+"px",this.cornerStyle.borderRightWidth=0),T===this.wot.getSetting("totalRows")-1&&o.offsetTop+g(o)>=f(R)&&(this.cornerStyle.top=Math.floor(a+y-3-parseInt(this.cornerDefaultStyle.height)/2)+"px",this.cornerStyle.borderBottomWidth=0)),w()&&this.updateMultipleSelectionHandlesPosition(_,S,a,u,C,y)}},disappear:function(){this.topStyle.display="none",this.leftStyle.display="none",this.bottomStyle.display="none",this.rightStyle.display="none",this.cornerStyle.display="none",w()&&(this.selectionHandles.styles.topLeft.display="none",this.selectionHandles.styles.bottomRight.display="none")},hasSetting:function(e){return"function"==typeof e?e():!!e}},{}),window.WalkontableBorder=C},{"cell/coords":6,eventManager:42,"helpers/browser":44,"helpers/dom/element":47,"helpers/dom/event":48,"overlay/_base.js":12}],4:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableViewportColumnsCalculator:{get:function(){return i}},__esModule:{value:!0}});var o=new WeakMap,i=function(e,t,n,i,r,s,a){var l=void 0!==arguments[7]?arguments[7]:function(e){return e};o.set(this,{viewportWidth:e,scrollOffset:t,totalColumns:n,columnWidthFn:i,overrideFn:r,onlyFullyVisible:s,stretchingColumnWidthFn:l}),this.count=0,this.startColumn=null,this.endColumn=null,this.startPosition=null,this.stretchAllRatio=0,this.stretchLastWidth=0,this.stretch=a,this.totalTargetWidth=0,this.needVerifyLastColumnWidth=!0,this.stretchAllColumnsWidth=[],this.calculate()},r=i;$traceurRuntime.createClass(i,{calculate:function(){for(var e,t=0,n=!0,i=[],r=o.get(this),s=r.onlyFullyVisible,a=r.overrideFn,l=r.scrollOffset,u=r.totalColumns,c=r.viewportWidth,d=0;d<u;d++)if(e=this._getColumnWidth(d),t<=l&&!s&&(this.startColumn=d),t>=l&&t+e<=l+c&&(null==this.startColumn&&(this.startColumn=d),this.endColumn=d),i.push(t),t+=e,s||(this.endColumn=d),t>=l+c){n=!1;break}if(this.endColumn===u-1&&n)for(this.startColumn=this.endColumn;this.startColumn>0;){var h=i[this.endColumn]+e-i[this.startColumn-1];if((h<=c||!s)&&this.startColumn--,h>c)break}null!==this.startColumn&&a&&a(this),this.startPosition=i[this.startColumn],void 0==this.startPosition&&(this.startPosition=null),null!==this.startColumn&&(this.count=this.endColumn-this.startColumn+1)},refreshStretching:function(e){if("none"!==this.stretch){this.totalTargetWidth=e;for(var t=o.get(this),n=t.totalColumns,i=0,r=0;r<n;r++){var s=this._getColumnWidth(r),a=t.stretchingColumnWidthFn(void 0,r);"number"==typeof a?e-=a:i+=s}var l=e-i;if("all"===this.stretch&&l>0)this.stretchAllRatio=e/i,this.stretchAllColumnsWidth=[],this.needVerifyLastColumnWidth=!0;else if("last"===this.stretch&&e!==1/0){var u=this._getColumnWidth(n-1),c=l+u;this.stretchLastWidth=c>=0?c:u}}},getStretchedColumnWidth:function(e,t){var n=null;return"all"===this.stretch&&0!==this.stretchAllRatio?n=this._getStretchedAllColumnWidth(e,t):"last"===this.stretch&&0!==this.stretchLastWidth&&(n=this._getStretchedLastColumnWidth(e)),n},_getStretchedAllColumnWidth:function(e,t){var n=0,i=o.get(this),r=i.totalColumns;if(!this.stretchAllColumnsWidth[e]){var s=Math.round(t*this.stretchAllRatio),a=i.stretchingColumnWidthFn(s,e);this.stretchAllColumnsWidth[e]=void 0===a?s:isNaN(a)?this._getColumnWidth(e):a}if(this.stretchAllColumnsWidth.length===r&&this.needVerifyLastColumnWidth){this.needVerifyLastColumnWidth=!1;for(var l=0;l<this.stretchAllColumnsWidth.length;l++)n+=this.stretchAllColumnsWidth[l];n!==this.totalTargetWidth&&(this.stretchAllColumnsWidth[this.stretchAllColumnsWidth.length-1]+=this.totalTargetWidth-n)}return this.stretchAllColumnsWidth[e]},_getStretchedLastColumnWidth:function(e){return e===o.get(this).totalColumns-1?this.stretchLastWidth:null},_getColumnWidth:function(e){var t=o.get(this).columnWidthFn(e);return void 0===t&&(t=r.DEFAULT_WIDTH),t}},{get DEFAULT_WIDTH(){return 50}}),window.WalkontableViewportColumnsCalculator=i},{}],5:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableViewportRowsCalculator:{get:function(){return i}},__esModule:{value:!0}});var o=new WeakMap,i=function(e,t,n,i,r,s,a){o.set(this,{viewportHeight:e,scrollOffset:t,totalRows:n,rowHeightFn:i,overrideFn:r,onlyFullyVisible:s,horizontalScrollbarHeight:a}),this.count=0,this.startRow=null,this.endRow=null,this.startPosition=null,this.calculate()},r=i;$traceurRuntime.createClass(i,{calculate:function(){for(var e=0,t=!0,n=[],i=o.get(this),s=i.onlyFullyVisible,a=i.overrideFn,l=i.rowHeightFn,u=i.scrollOffset,c=i.totalRows,d=i.viewportHeight,h=i.horizontalScrollbarHeight||0,f=0;f<c;f++){var p=l(f);if(void 0===p&&(p=r.DEFAULT_HEIGHT),e<=u&&!s&&(this.startRow=f),e>=u&&e+p<=u+d-h&&(null===this.startRow&&(this.startRow=f),this.endRow=f),n.push(e),e+=p,s||(this.endRow=f),e>=u+d-h){t=!1;break}}if(this.endRow===c-1&&t)for(this.startRow=this.endRow;this.startRow>0;){var g=n[this.endRow]+p-n[this.startRow-1];if((g<=d-h||!s)&&this.startRow--,g>=d-h)break}null!==this.startRow&&a&&a(this),this.startPosition=n[this.startRow],void 0==this.startPosition&&(this.startPosition=null),null!==this.startRow&&(this.count=this.endRow-this.startRow+1)}},{get DEFAULT_HEIGHT(){return 23}}),window.WalkontableViewportRowsCalculator=i},{}],6:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableCellCoords:{get:function(){return o}},__esModule:{value:!0}});var o=function(e,t){void 0!==e&&void 0!==t?(this.row=e,this.col=t):(this.row=null,this.col=null)};$traceurRuntime.createClass(o,{isValid:function(e){return!(this.row<0||this.col<0||this.row>=e.getSetting("totalRows")||this.col>=e.getSetting("totalColumns"))},isEqual:function(e){return e===this||this.row===e.row&&this.col===e.col},isSouthEastOf:function(e){return this.row>=e.row&&this.col>=e.col},isNorthWestOf:function(e){return this.row<=e.row&&this.col<=e.col},isSouthWestOf:function(e){return this.row>=e.row&&this.col<=e.col},isNorthEastOf:function(e){return this.row<=e.row&&this.col>=e.col}},{}),window.WalkontableCellCoords=o},{}],7:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableCellRange:{get:function(){return r}},__esModule:{value:!0}});var o,i=((o=e("cell/coords"))&&o.__esModule&&o||{default:o}).WalkontableCellCoords,r=function(e,t,n){this.highlight=e,this.from=t,this.to=n},s=r;$traceurRuntime.createClass(r,{isValid:function(e){return this.from.isValid(e)&&this.to.isValid(e)},isSingle:function(){return this.from.row===this.to.row&&this.from.col===this.to.col},getHeight:function(){return Math.max(this.from.row,this.to.row)-Math.min(this.from.row,this.to.row)+1},getWidth:function(){return Math.max(this.from.col,this.to.col)-Math.min(this.from.col,this.to.col)+1},includes:function(e){var t=e,n=t.row,o=t.col,i=this.getTopLeftCorner(),r=this.getBottomRightCorner();return i.row<=n&&r.row>=n&&i.col<=o&&r.col>=o},includesRange:function(e){return this.includes(e.getTopLeftCorner())&&this.includes(e.getBottomRightCorner())},isEqual:function(e){return Math.min(this.from.row,this.to.row)==Math.min(e.from.row,e.to.row)&&Math.max(this.from.row,this.to.row)==Math.max(e.from.row,e.to.row)&&Math.min(this.from.col,this.to.col)==Math.min(e.from.col,e.to.col)&&Math.max(this.from.col,this.to.col)==Math.max(e.from.col,e.to.col)},overlaps:function(e){return e.isSouthEastOf(this.getTopLeftCorner())&&e.isNorthWestOf(this.getBottomRightCorner())},isSouthEastOf:function(e){return this.getTopLeftCorner().isSouthEastOf(e)||this.getBottomRightCorner().isSouthEastOf(e)},isNorthWestOf:function(e){return this.getTopLeftCorner().isNorthWestOf(e)||this.getBottomRightCorner().isNorthWestOf(e)},expand:function(e){var t=this.getTopLeftCorner(),n=this.getBottomRightCorner();return(e.row<t.row||e.col<t.col||e.row>n.row||e.col>n.col)&&(this.from=new i(Math.min(t.row,e.row),Math.min(t.col,e.col)),this.to=new i(Math.max(n.row,e.row),Math.max(n.col,e.col)),!0)},expandByRange:function(e){if(this.includesRange(e)||!this.overlaps(e))return!1;var t=this.getTopLeftCorner(),n=this.getBottomRightCorner(),o=(this.getTopRightCorner(),this.getBottomLeftCorner(),e.getTopLeftCorner()),r=e.getBottomRightCorner(),a=Math.min(t.row,o.row),l=Math.min(t.col,o.col),u=Math.max(n.row,r.row),c=Math.max(n.col,r.col),d=new i(a,l),h=new i(u,c),f=new s(d,d,h).isCorner(this.from,e),p=e.isEqual(new s(d,d,h));return f&&!p&&(this.from.col>d.col&&(d.col=c,h.col=l),this.from.row>d.row&&(d.row=u,h.row=a)),this.from=d,this.to=h,!0},getDirection:function(){return this.from.isNorthWestOf(this.to)?"NW-SE":this.from.isNorthEastOf(this.to)?"NE-SW":this.from.isSouthEastOf(this.to)?"SE-NW":this.from.isSouthWestOf(this.to)?"SW-NE":void 0},setDirection:function(e){switch(e){case"NW-SE":this.from=this.getTopLeftCorner(),this.to=this.getBottomRightCorner();break;case"NE-SW":this.from=this.getTopRightCorner(),this.to=this.getBottomLeftCorner();break;case"SE-NW":this.from=this.getBottomRightCorner(),this.to=this.getTopLeftCorner();break;case"SW-NE":this.from=this.getBottomLeftCorner(),this.to=this.getTopRightCorner()}},getTopLeftCorner:function(){return new i(Math.min(this.from.row,this.to.row),Math.min(this.from.col,this.to.col))},getBottomRightCorner:function(){return new i(Math.max(this.from.row,this.to.row),Math.max(this.from.col,this.to.col))},getTopRightCorner:function(){return new i(Math.min(this.from.row,this.to.row),Math.max(this.from.col,this.to.col))},getBottomLeftCorner:function(){return new i(Math.max(this.from.row,this.to.row),Math.min(this.from.col,this.to.col))},isCorner:function(e,t){return!!(t&&t.includes(e)&&(this.getTopLeftCorner().isEqual(new i(t.from.row,t.from.col))||this.getTopRightCorner().isEqual(new i(t.from.row,t.to.col))||this.getBottomLeftCorner().isEqual(new i(t.to.row,t.from.col))||this.getBottomRightCorner().isEqual(new i(t.to.row,t.to.col))))||e.isEqual(this.getTopLeftCorner())||e.isEqual(this.getTopRightCorner())||e.isEqual(this.getBottomLeftCorner())||e.isEqual(this.getBottomRightCorner())},getOppositeCorner:function(e,t){if(!(e instanceof i))return!1;if(t&&t.includes(e)){if(this.getTopLeftCorner().isEqual(new i(t.from.row,t.from.col)))return this.getBottomRightCorner();if(this.getTopRightCorner().isEqual(new i(t.from.row,t.to.col)))return this.getBottomLeftCorner();if(this.getBottomLeftCorner().isEqual(new i(t.to.row,t.from.col)))return this.getTopRightCorner();if(this.getBottomRightCorner().isEqual(new i(t.to.row,t.to.col)))return this.getTopLeftCorner()}return e.isEqual(this.getBottomRightCorner())?this.getTopLeftCorner():e.isEqual(this.getTopLeftCorner())?this.getBottomRightCorner():e.isEqual(this.getTopRightCorner())?this.getBottomLeftCorner():e.isEqual(this.getBottomLeftCorner())?this.getTopRightCorner():void 0},getBordersSharedWith:function(e){if(!this.includesRange(e))return[];var t={top:Math.min(this.from.row,this.to.row),bottom:Math.max(this.from.row,this.to.row),left:Math.min(this.from.col,this.to.col),right:Math.max(this.from.col,this.to.col)},n={top:Math.min(e.from.row,e.to.row),bottom:Math.max(e.from.row,e.to.row),left:Math.min(e.from.col,e.to.col),right:Math.max(e.from.col,e.to.col)},o=[];return t.top==n.top&&o.push("top"),t.right==n.right&&o.push("right"),t.bottom==n.bottom&&o.push("bottom"),t.left==n.left&&o.push("left"),o},getInner:function(){for(var e=this.getTopLeftCorner(),t=this.getBottomRightCorner(),n=[],o=e.row;o<=t.row;o++)for(var r=e.col;r<=t.col;r++)this.from.row===o&&this.from.col===r||this.to.row===o&&this.to.col===r||n.push(new i(o,r));return n},getAll:function(){for(var e=this.getTopLeftCorner(),t=this.getBottomRightCorner(),n=[],o=e.row;o<=t.row;o++)for(var r=e.col;r<=t.col;r++)e.row===o&&e.col===r?n.push(e):t.row===o&&t.col===r?n.push(t):n.push(new i(o,r));return n},forAll:function(e){for(var t=this.getTopLeftCorner(),n=this.getBottomRightCorner(),o=t.row;o<=n.row;o++)for(var i=t.col;i<=n.col;i++){var r=e(o,i);if(!1===r)return}}},{}),window.WalkontableCellRange=r},{"cell/coords":6}],8:[function(e,t,n){"use strict";Object.defineProperties(n,{Walkontable:{get:function(){return A}},__esModule:{value:!0}});var o,i,r,s,a,l,u,c,d,h,f,p,g,m,v=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},w=v.addClass,y=v.fastInnerText,b=v.isVisible,C=v.removeClass,_=((i=e("helpers/object"))&&i.__esModule&&i||{default:i}).objectEach,S=(r=e("helpers/string"))&&r.__esModule&&r||{default:r},T=S.toUpperCaseFirst,E=S.randomString,R=((s=e("event"))&&s.__esModule&&s||{default:s}).WalkontableEvent,M=((a=e("overlays"))&&a.__esModule&&a||{default:a}).WalkontableOverlays,O=((l=e("scroll"))&&l.__esModule&&l||{default:l}).WalkontableScroll,k=((u=e("settings"))&&u.__esModule&&u||{default:u}).WalkontableSettings,x=((c=e("table"))&&c.__esModule&&c||{default:c}).WalkontableTable,D=((d=e("viewport"))&&d.__esModule&&d||{default:d}).WalkontableViewport,A=((h=e("overlay/_base.js"))&&h.__esModule,(f=e("overlay/top.js"))&&f.__esModule,(p=e("overlay/left.js"))&&p.__esModule,(g=e("overlay/debug.js"))&&g.__esModule,(m=e("overlay/topLeftCorner.js"))&&m.__esModule,function(e){var t=[];if(this.guid="wt_"+E(),e.cloneSource?(this.cloneSource=e.cloneSource,this.cloneOverlay=e.cloneOverlay,this.wtSettings=e.cloneSource.wtSettings,this.wtTable=new x(this,e.table,e.wtRootElement),this.wtScroll=new O(this),this.wtViewport=e.cloneSource.wtViewport,this.wtEvent=new R(this),this.selections=this.cloneSource.selections):(this.wtSettings=new k(this,e),this.wtTable=new x(this,e.table),this.wtScroll=new O(this),this.wtViewport=new D(this),this.wtEvent=new R(this),this.selections=this.getSetting("selections"),this.wtOverlays=new M(this),this.exportSettingsAsClassNames()),this.wtTable.THEAD.childNodes.length&&this.wtTable.THEAD.childNodes[0].childNodes.length){for(var n=0,o=this.wtTable.THEAD.childNodes[0].childNodes.length;n<o;n++)t.push(this.wtTable.THEAD.childNodes[0].childNodes[n].innerHTML);this.getSetting("columnHeaders").length||this.update("columnHeaders",[function(e,n){y(n,t[e])}])}this.drawn=!1,this.drawInterrupted=!1});$traceurRuntime.createClass(A,{draw:function(){var e=void 0!==arguments[0]&&arguments[0];return this.drawInterrupted=!1,e||b(this.wtTable.TABLE)?this.wtTable.draw(e):this.drawInterrupted=!0,this},getCell:function(e){if(void 0===arguments[1]||!arguments[1])return this.wtTable.getCell(e);var t=this.wtSettings.getSetting("totalRows"),n=this.wtSettings.getSetting("fixedRowsTop"),o=this.wtSettings.getSetting("fixedRowsBottom"),i=this.wtSettings.getSetting("fixedColumnsLeft");if(e.row<n&&e.col<i)return this.wtOverlays.topLeftCornerOverlay.clone.wtTable.getCell(e);if(e.row<n)return this.wtOverlays.topOverlay.clone.wtTable.getCell(e);if(e.col<i&&e.row>=t-o){if(this.wtOverlays.bottomLeftCornerOverlay.clone)return this.wtOverlays.bottomLeftCornerOverlay.clone.wtTable.getCell(e)}else{if(e.col<i)return this.wtOverlays.leftOverlay.clone.wtTable.getCell(e);if(e.row<t&&e.row>t-o&&this.wtOverlays.bottomOverlay.clone)return this.wtOverlays.bottomOverlay.clone.wtTable.getCell(e)}return this.wtTable.getCell(e)},update:function(e,t){return this.wtSettings.update(e,t)},scrollVertical:function(e){return this.wtOverlays.topOverlay.scrollTo(e),this.getSetting("onScrollVertically"),this},scrollHorizontal:function(e){return this.wtOverlays.leftOverlay.scrollTo(e),this.getSetting("onScrollHorizontally"),this},scrollViewport:function(e){return this.wtScroll.scrollViewport(e),this},getViewport:function(){return[this.wtTable.getFirstVisibleRow(),this.wtTable.getFirstVisibleColumn(),this.wtTable.getLastVisibleRow(),this.wtTable.getLastVisibleColumn()]},getOverlayName:function(){return this.cloneOverlay?this.cloneOverlay.type:"master"},isOverlayName:function(e){return!!this.cloneOverlay&&this.cloneOverlay.type===e},exportSettingsAsClassNames:function(){var e=this,t={rowHeaders:["array"],columnHeaders:["array"]},n=[],o=[];_(t,function(t,i){t.indexOf("array")>-1&&e.getSetting(i).length&&o.push("ht"+T(i)),n.push("ht"+T(i))}),C(this.wtTable.wtRootElement.parentNode,n),w(this.wtTable.wtRootElement.parentNode,o)},getSetting:function(e,t,n,o,i){return this.wtSettings.getSetting(e,t,n,o,i)},hasSetting:function(e){return this.wtSettings.has(e)},destroy:function(){this.wtOverlays.destroy(),this.wtEvent.destroy()}},{}),window.Walkontable=A},{event:9,"helpers/dom/element":47,"helpers/object":53,"helpers/string":55,"overlay/_base.js":12,"overlay/debug.js":13,"overlay/left.js":14,"overlay/top.js":15,"overlay/topLeftCorner.js":16,overlays:17,scroll:18,settings:20,table:21,viewport:23}],9:[function(e,t,n){"use strict";function o(e){var t=this,n=h(e);this.instance=e;var o=[null,null];this.dblClickTimeout=[null,null];var i=function(e){var n=t.parentCell(e.realTarget);u(e.realTarget,"corner")?t.instance.getSetting("onCellCornerMouseDown",e,e.realTarget):n.TD&&t.instance.hasSetting("onCellMouseDown")&&t.instance.getSetting("onCellMouseDown",e,n.coords,n.TD,t.instance),2!==e.button&&n.TD&&(o[0]=n.TD,clearTimeout(t.dblClickTimeout[0]),t.dblClickTimeout[0]=setTimeout(function(){o[0]=null},1e3))},r=function(e){t.instance.touchMoving=!0},s=function(e){n.addEventListener(this,"touchmove",r),t.checkIfTouchMove=setTimeout(function(){return!0===t.instance.touchMoving?(t.instance.touchMoving=void 0,void n.removeEventListener("touchmove",r,!1)):void i(e)},30)},a=function(e){var n,o,i;t.instance.hasSetting("onCellMouseOver")&&(n=t.instance.wtTable.TABLE,o=l(e.realTarget,["TD","TH"],n),i=t.instance.cloneSource||t.instance,o&&o!==i.lastMouseOver&&c(o,n)&&(i.lastMouseOver=o,t.instance.getSetting("onCellMouseOver",e,t.instance.wtTable.getCoords(o),o,t.instance)))},f=function(e){if(2!==e.button){var n=t.parentCell(e.realTarget);n.TD===o[0]&&n.TD===o[1]?(u(e.realTarget,"corner")?t.instance.getSetting("onCellCornerDblClick",e,n.coords,n.TD,t.instance):t.instance.getSetting("onCellDblClick",e,n.coords,n.TD,t.instance),o[0]=null,o[1]=null):n.TD===o[0]&&(o[1]=n.TD,clearTimeout(t.dblClickTimeout[1]),t.dblClickTimeout[1]=setTimeout(function(){o[1]=null},500))}},p=function(e){clearTimeout(void 0),e.preventDefault(),f(e)};if(n.addEventListener(this.instance.wtTable.holder,"mousedown",i),n.addEventListener(this.instance.wtTable.TABLE,"mouseover",a),n.addEventListener(this.instance.wtTable.holder,"mouseup",f),this.instance.wtTable.holder.parentNode.parentNode&&d()&&!t.instance.wtTable.isWorkingOnClone()){var g="."+this.instance.wtTable.holder.parentNode.className.split(" ").join(".");n.addEventListener(this.instance.wtTable.holder,"touchstart",function(e){t.instance.touchApplied=!0,c(e.target,g)&&s.call(e.target,e)}),n.addEventListener(this.instance.wtTable.holder,"touchend",function(e){t.instance.touchApplied=!1,c(e.target,g)&&p.call(e.target,e)}),t.instance.momentumScrolling||(t.instance.momentumScrolling={}),n.addEventListener(this.instance.wtTable.holder,"scroll",function(e){clearTimeout(t.instance.momentumScrolling._timeout),t.instance.momentumScrolling.ongoing||t.instance.getSetting("onBeforeTouchScroll"),t.instance.momentumScrolling.ongoing=!0,t.instance.momentumScrolling._timeout=setTimeout(function(){t.instance.touchApplied||(t.instance.momentumScrolling.ongoing=!1,t.instance.getSetting("onAfterMomentumScroll"))},200)})}n.addEventListener(window,"resize",function(){"none"!==t.instance.getSetting("stretchH")&&t.instance.draw()}),this.destroy=function(){clearTimeout(this.dblClickTimeout[0]),clearTimeout(this.dblClickTimeout[1]),n.destroy()}}Object.defineProperties(n,{WalkontableEvent:{get:function(){return o}},__esModule:{value:!0}});var i,r,s,a=(i=e("helpers/dom/element"))&&i.__esModule&&i||{default:i},l=a.closestDown,u=a.hasClass,c=a.isChildOf,d=((r=e("helpers/browser"))&&r.__esModule&&r||{default:r}).isMobileBrowser,h=((s=e("eventManager"))&&s.__esModule&&s||{default:s}).eventManager;o.prototype.parentCell=function(e){var t={},n=this.instance.wtTable.TABLE,o=l(e,["TD","TH"],n);return o?(t.coords=this.instance.wtTable.getCoords(o),t.TD=o):u(e,"wtBorder")&&u(e,"current")?(t.coords=this.instance.selections.current.cellRange.highlight,t.TD=this.instance.wtTable.getCell(t.coords)):u(e,"wtBorder")&&u(e,"area")&&this.instance.selections.area.cellRange&&(t.coords=this.instance.selections.area.cellRange.to,t.TD=this.instance.wtTable.getCell(t.coords)),t},window.WalkontableEvent=o},{eventManager:42,"helpers/browser":44,"helpers/dom/element":47}],10:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableColumnFilter:{get:function(){return o}},__esModule:{value:!0}});var o=function(e,t,n){this.offset=e,this.total=t,this.countTH=n};$traceurRuntime.createClass(o,{offsetted:function(e){return e+this.offset},unOffsetted:function(e){return e-this.offset},renderedToSource:function(e){return this.offsetted(e)},sourceToRendered:function(e){return this.unOffsetted(e)},offsettedTH:function(e){return e-this.countTH},unOffsettedTH:function(e){return e+this.countTH},visibleRowHeadedColumnToSourceColumn:function(e){return this.renderedToSource(this.offsettedTH(e))},sourceColumnToVisibleRowHeadedColumn:function(e){return this.unOffsettedTH(this.sourceToRendered(e))}},{}),window.WalkontableColumnFilter=o},{}],11:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableRowFilter:{get:function(){return o}},__esModule:{value:!0}});var o=function(e,t,n){this.offset=e,this.total=t,this.countTH=n};$traceurRuntime.createClass(o,{offsetted:function(e){return e+this.offset},unOffsetted:function(e){return e-this.offset},renderedToSource:function(e){return this.offsetted(e)},sourceToRendered:function(e){return this.unOffsetted(e)},offsettedTH:function(e){return e-this.countTH},unOffsettedTH:function(e){return e+this.countTH},visibleColHeadedRowToSourceRow:function(e){return this.renderedToSource(this.offsettedTH(e))},sourceRowToVisibleColHeadedRow:function(e){return this.unOffsettedTH(this.sourceToRendered(e))}},{}),window.WalkontableRowFilter=o},{}],12:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableOverlay:{get:function(){return h}},__esModule:{value:!0}});var o,i,r,s=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},a=s.getScrollableElement,l=s.getTrimmingContainer,u=((i=e("helpers/object"))&&i.__esModule&&i||{default:i}).defineGetter,c=((r=e("eventManager"))&&r.__esModule&&r||{default:r}).eventManager,d={},h=function(e){u(this,"wot",e,{writable:!1}),this.instance=this.wot,this.type="",this.mainTableScrollableElement=null,this.TABLE=this.wot.wtTable.TABLE,this.hider=this.wot.wtTable.hider,this.spreader=this.wot.wtTable.spreader,this.holder=this.wot.wtTable.holder,this.wtRootElement=this.wot.wtTable.wtRootElement,this.trimmingContainer=l(this.hider.parentNode.parentNode),this.needFullRender=this.shouldBeRendered(),this.areElementSizesAdjusted=!1},f=h;$traceurRuntime.createClass(h,{shouldBeRendered:function(){return!0},updateTrimmingContainer:function(){this.trimmingContainer=l(this.hider.parentNode.parentNode)},updateMainScrollableElement:function(){this.mainTableScrollableElement=a(this.wot.wtTable.TABLE)},makeClone:function(e){if(-1===f.CLONE_TYPES.indexOf(e))throw new Error('Clone type "'+e+'" is not supported.');var t=document.createElement("DIV"),n=document.createElement("TABLE");t.className="ht_clone_"+e+" handsontable",t.style.position="absolute",t.style.top=0,t.style.left=0,t.style.overflow="hidden",n.className=this.wot.wtTable.TABLE.className,t.appendChild(n),this.type=e,this.wot.wtTable.wtRootElement.parentNode.appendChild(t);var o=this.wot.getSetting("preventOverflow");return!0===o||"horizontal"===o&&this.type===f.CLONE_TOP||"vertical"===o&&this.type===f.CLONE_LEFT?this.mainTableScrollableElement=window:this.mainTableScrollableElement=a(this.wot.wtTable.TABLE),new Walkontable({cloneSource:this.wot,cloneOverlay:this,table:n})},refresh:function(){var e=void 0!==arguments[0]&&arguments[0],t=this.shouldBeRendered();this.clone&&(this.needFullRender||t)&&this.clone.draw(e),this.needFullRender=t},destroy:function(){c(this.clone).destroy()}},{get CLONE_TOP(){return"top"},get CLONE_BOTTOM(){return"bottom"},get CLONE_LEFT(){return"left"},get CLONE_TOP_LEFT_CORNER(){return"top_left_corner"},get CLONE_BOTTOM_LEFT_CORNER(){return"bottom_left_corner"},get CLONE_DEBUG(){return"debug"},get CLONE_TYPES(){return[f.CLONE_TOP,f.CLONE_BOTTOM,f.CLONE_LEFT,f.CLONE_TOP_LEFT_CORNER,f.CLONE_BOTTOM_LEFT_CORNER,f.CLONE_DEBUG]},registerOverlay:function(e,t){if(-1===f.CLONE_TYPES.indexOf(e))throw new Error("Unsupported overlay ("+e+").");d[e]=t},createOverlay:function(e,t){return new d[e](t)},isOverlayTypeOf:function(e,t){return!(!e||!d[t])&&e instanceof d[t]}}),window.WalkontableOverlay=h},{eventManager:42,"helpers/dom/element":47,"helpers/object":53}],13:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableDebugOverlay:{get:function(){return a}},__esModule:{value:!0}});var o,i,r=((o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o}).addClass,s=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,a=function(e){$traceurRuntime.superConstructor(l).call(this,e),this.clone=this.makeClone(s.CLONE_DEBUG),this.clone.wtTable.holder.style.opacity=.4,this.clone.wtTable.holder.style.textShadow="0 0 2px #ff0000",r(this.clone.wtTable.holder.parentNode,"wtDebugVisible")},l=a;$traceurRuntime.createClass(a,{},{},s),window.WalkontableDebugOverlay=a,s.registerOverlay(s.CLONE_DEBUG,a)},{_base:12,"helpers/dom/element":47}],14:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableLeftOverlay:{get:function(){return v}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.addClass,a=r.getScrollbarWidth,l=r.getScrollLeft,u=r.getWindowScrollTop,c=r.hasClass,d=r.outerWidth,h=r.innerHeight,f=r.removeClass,p=r.setOverlayPosition,g=r.resetCssTransform,m=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,v=function(e){$traceurRuntime.superConstructor(w).call(this,e),this.clone=this.makeClone(m.CLONE_LEFT)},w=v;$traceurRuntime.createClass(v,{shouldBeRendered:function(){return!(!this.wot.getSetting("fixedColumnsLeft")&&!this.wot.getSetting("rowHeaders").length)},resetFixedPosition:function(){if(this.needFullRender&&this.wot.wtTable.holder.parentNode){var e=this.clone.wtTable.holder.parentNode,t=0,n=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||n&&"horizontal"===n)t=this.getScrollPosition(),g(e);else{var o,i,r=this.wot.wtTable.hider.getBoundingClientRect(),s=Math.ceil(r.left),a=Math.ceil(r.right);i=this.wot.wtTable.hider.style.top,i=""===i?0:i,o=s<0&&a-e.offsetWidth>0?-s:0,t=o,o+="px",p(e,o,i)}this.adjustHeaderBordersPosition(t),this.adjustElementsSize()}},setScrollPosition:function(e){this.mainTableScrollableElement===window?window.scrollTo(e,u()):this.mainTableScrollableElement.scrollLeft=e},onScroll:function(){this.wot.getSetting("onScrollVertically")},sumCellSizes:function(e,t){for(var n=0,o=this.wot.wtSettings.defaultColumnWidth;e<t;)n+=this.wot.wtTable.getStretchedColumnWidth(e)||o,e++;return n},adjustElementsSize:function(){var e=void 0!==arguments[0]&&arguments[0];this.updateTrimmingContainer(),(this.needFullRender||e)&&(this.adjustRootElementSize(),this.adjustRootChildrenSize(),e||(this.areElementSizesAdjusted=!0))},adjustRootElementSize:function(){var e,t=this.wot.wtTable.holder,n=t.clientHeight===t.offsetHeight?0:a(),o=this.clone.wtTable.holder.parentNode,i=o.style,r=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||"vertical"===r){
 var s=this.wot.wtViewport.getWorkspaceHeight()-n;s=Math.min(s,h(this.wot.wtTable.wtRootElement)),i.height=s+"px"}else i.height="";this.clone.wtTable.holder.style.height=i.height,e=d(this.clone.wtTable.TABLE),i.width=(0===e?e:e+4)+"px"},adjustRootChildrenSize:function(){var e=a();this.clone.wtTable.hider.style.height=this.hider.style.height,this.clone.wtTable.holder.style.height=this.clone.wtTable.holder.parentNode.style.height,0===e&&(e=30),this.clone.wtTable.holder.style.width=parseInt(this.clone.wtTable.holder.parentNode.style.width,10)+e+"px"},applyToDOM:function(){var e=this.wot.getSetting("totalColumns");if(this.areElementSizesAdjusted||this.adjustElementsSize(),"number"==typeof this.wot.wtViewport.columnsRenderCalculator.startPosition)this.spreader.style.left=this.wot.wtViewport.columnsRenderCalculator.startPosition+"px";else{if(0!==e)throw new Error("Incorrect value of the columnsRenderCalculator");this.spreader.style.left="0"}this.spreader.style.right="",this.needFullRender&&this.syncOverlayOffset()},syncOverlayOffset:function(){"number"==typeof this.wot.wtViewport.rowsRenderCalculator.startPosition?this.clone.wtTable.spreader.style.top=this.wot.wtViewport.rowsRenderCalculator.startPosition+"px":this.clone.wtTable.spreader.style.top=""},scrollTo:function(e,t){var n=this.getTableParentOffset(),o=this.wot.cloneSource?this.wot.cloneSource:this.wot,i=o.wtTable.holder,r=0;t&&i.offsetWidth!==i.clientWidth&&(r=a()),t?(n+=this.sumCellSizes(0,e+1),n-=this.wot.wtViewport.getViewportWidth()):n+=this.sumCellSizes(this.wot.getSetting("fixedColumnsLeft"),e),n+=r,this.setScrollPosition(n)},getTableParentOffset:function(){var e=this.wot.getSetting("preventOverflow"),t=0;return e||this.trimmingContainer!==window||(t=this.wot.wtTable.holderOffset.left),t},getScrollPosition:function(){return l(this.mainTableScrollableElement)},adjustHeaderBordersPosition:function(e){var t=this.wot.wtTable.holder.parentNode,n=this.wot.getSetting("rowHeaders"),o=this.wot.getSetting("fixedColumnsLeft");if(this.wot.getSetting("totalRows")?f(t,"emptyRows"):s(t,"emptyRows"),o&&!n.length)s(t,"innerBorderLeft");else if(!o&&n.length){var i=c(t,"innerBorderLeft");e?s(t,"innerBorderLeft"):f(t,"innerBorderLeft"),(!i&&e||i&&!e)&&this.wot.wtOverlays.adjustElementsSize()}}},{},m),window.WalkontableLeftOverlay=v,m.registerOverlay(m.CLONE_LEFT,v)},{_base:12,"helpers/dom/element":47}],15:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableTopOverlay:{get:function(){return v}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.addClass,a=r.getScrollbarWidth,l=r.getScrollTop,u=r.getWindowScrollLeft,c=r.hasClass,d=r.outerHeight,h=r.innerWidth,f=r.removeClass,p=r.setOverlayPosition,g=r.resetCssTransform,m=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,v=function(e){$traceurRuntime.superConstructor(w).call(this,e),this.clone=this.makeClone(m.CLONE_TOP)},w=v;$traceurRuntime.createClass(v,{shouldBeRendered:function(){return!(!this.wot.getSetting("fixedRowsTop")&&!this.wot.getSetting("columnHeaders").length)},resetFixedPosition:function(){if(this.needFullRender&&this.wot.wtTable.holder.parentNode){var e=this.clone.wtTable.holder.parentNode,t=0,n=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||n&&"vertical"===n)t=this.getScrollPosition(),g(e);else{var o,i,r=this.wot.wtTable.hider.getBoundingClientRect(),s=Math.ceil(r.top),a=Math.ceil(r.bottom);o=this.wot.wtTable.hider.style.left,o=""===o?0:o,i=s<0&&a-e.offsetHeight>0?-s:0,t=i,i+="px",p(e,o,i)}this.adjustHeaderBordersPosition(t),this.adjustElementsSize()}},setScrollPosition:function(e){this.mainTableScrollableElement===window?window.scrollTo(u(),e):this.mainTableScrollableElement.scrollTop=e},onScroll:function(){this.wot.getSetting("onScrollHorizontally")},sumCellSizes:function(e,t){for(var n=0,o=this.wot.wtSettings.settings.defaultRowHeight;e<t;){var i=this.wot.wtTable.getRowHeight(e);n+=void 0===i?o:i,e++}return n},adjustElementsSize:function(){var e=void 0!==arguments[0]&&arguments[0];this.updateTrimmingContainer(),(this.needFullRender||e)&&(this.adjustRootElementSize(),this.adjustRootChildrenSize(),e||(this.areElementSizesAdjusted=!0))},adjustRootElementSize:function(){var e,t=this.wot.wtTable.holder,n=t.clientWidth===t.offsetWidth?0:a(),o=this.clone.wtTable.holder.parentNode,i=o.style,r=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||"horizontal"===r){var s=this.wot.wtViewport.getWorkspaceWidth()-n;s=Math.min(s,h(this.wot.wtTable.wtRootElement)),i.width=s+"px"}else i.width="";this.clone.wtTable.holder.style.width=i.width,e=d(this.clone.wtTable.TABLE),i.height=(0===e?e:e+4)+"px"},adjustRootChildrenSize:function(){var e=a();this.clone.wtTable.hider.style.width=this.hider.style.width,this.clone.wtTable.holder.style.width=this.clone.wtTable.holder.parentNode.style.width,0===e&&(e=30),this.clone.wtTable.holder.style.height=parseInt(this.clone.wtTable.holder.parentNode.style.height,10)+e+"px"},applyToDOM:function(){var e=this.wot.getSetting("totalRows");if(this.areElementSizesAdjusted||this.adjustElementsSize(),"number"==typeof this.wot.wtViewport.rowsRenderCalculator.startPosition)this.spreader.style.top=this.wot.wtViewport.rowsRenderCalculator.startPosition+"px";else{if(0!==e)throw new Error("Incorrect value of the rowsRenderCalculator");this.spreader.style.top="0"}this.spreader.style.bottom="",this.needFullRender&&this.syncOverlayOffset()},syncOverlayOffset:function(){"number"==typeof this.wot.wtViewport.columnsRenderCalculator.startPosition?this.clone.wtTable.spreader.style.left=this.wot.wtViewport.columnsRenderCalculator.startPosition+"px":this.clone.wtTable.spreader.style.left=""},scrollTo:function(e,t){var n=this.getTableParentOffset(),o=this.wot.cloneSource?this.wot.cloneSource:this.wot,i=o.wtTable.holder,r=0;if(t&&i.offsetHeight!==i.clientHeight&&(r=a()),t){var s=this.wot.getSetting("fixedRowsBottom"),l=(this.wot.getSetting("fixedRowsTop"),this.wot.getSetting("totalRows"));n+=this.sumCellSizes(0,e+1),n-=this.wot.wtViewport.getViewportHeight()-this.sumCellSizes(l-s,l),n+=1}else n+=this.sumCellSizes(this.wot.getSetting("fixedRowsTop"),e);n+=r,this.setScrollPosition(n)},getTableParentOffset:function(){return this.mainTableScrollableElement===window?this.wot.wtTable.holderOffset.top:0},getScrollPosition:function(){return l(this.mainTableScrollableElement)},adjustHeaderBordersPosition:function(e){var t=this.wot.wtTable.holder.parentNode;if(this.wot.getSetting("totalColumns")?f(t,"emptyColumns"):s(t,"emptyColumns"),0===this.wot.getSetting("fixedRowsTop")&&this.wot.getSetting("columnHeaders").length>0){var n=c(t,"innerBorderTop");e||0===this.wot.getSetting("totalRows")?s(t,"innerBorderTop"):f(t,"innerBorderTop"),(!n&&e||n&&!e)&&this.wot.wtOverlays.adjustElementsSize()}if(0===this.wot.getSetting("rowHeaders").length){var o=this.clone.wtTable.THEAD.querySelectorAll("th:nth-of-type(2)");if(o)for(var i=0;i<o.length;i++)o[i].style["border-left-width"]=0}}},{},m),window.WalkontableTopOverlay=v,m.registerOverlay(m.CLONE_TOP,v)},{_base:12,"helpers/dom/element":47}],16:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableTopLeftCornerOverlay:{get:function(){return d}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.outerHeight,a=r.outerWidth,l=r.setOverlayPosition,u=r.resetCssTransform,c=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,d=function(e){$traceurRuntime.superConstructor(h).call(this,e),this.clone=this.makeClone(c.CLONE_TOP_LEFT_CORNER)},h=d;$traceurRuntime.createClass(d,{shouldBeRendered:function(){return!(!this.wot.getSetting("fixedRowsTop")&&!this.wot.getSetting("columnHeaders").length||!this.wot.getSetting("fixedColumnsLeft")&&!this.wot.getSetting("rowHeaders").length)},resetFixedPosition:function(){if(this.updateTrimmingContainer(),this.wot.wtTable.holder.parentNode){var e=this.clone.wtTable.holder.parentNode,t=s(this.clone.wtTable.TABLE),n=a(this.clone.wtTable.TABLE),o=this.wot.getSetting("preventOverflow");if(this.trimmingContainer===window){var i=this.wot.wtTable.hider.getBoundingClientRect(),r=Math.ceil(i.top),c=Math.ceil(i.left),d=Math.ceil(i.bottom),h=Math.ceil(i.right),f="0",p="0";o&&"vertical"!==o||c<0&&h-e.offsetWidth>0&&(f=-c+"px"),o&&"horizontal"!==o||r<0&&d-e.offsetHeight>0&&(p=-r+"px"),l(e,f,p)}else u(e);e.style.height=(0===t?t:t+4)+"px",e.style.width=(0===n?n:n+4)+"px"}}},{},c),window.WalkontableTopLeftCornerOverlay=d,c.registerOverlay(c.CLONE_TOP_LEFT_CORNER,d)},{_base:12,"helpers/dom/element":47}],17:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableOverlays:{get:function(){return v}},__esModule:{value:!0}});var o,i,r,s,a,l=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},u=l.getScrollableElement,c=l.getScrollbarWidth,d=l.getScrollLeft,h=l.getScrollTop,f=((i=e("helpers/array"))&&i.__esModule&&i||{default:i}).arrayEach,p=((r=e("helpers/unicode"))&&r.__esModule&&r||{default:r}).isKey,g=((s=e("helpers/browser"))&&s.__esModule&&s||{default:s}).isMobileBrowser,m=((a=e("eventManager"))&&a.__esModule&&a||{default:a}).EventManager,v=function(e){this.wot=e,this.instance=this.wot,this.eventManager=new m(this.wot),this.wot.update("scrollbarWidth",c()),this.wot.update("scrollbarHeight",c()),this.scrollableElement=u(this.wot.wtTable.TABLE),this.topOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_TOP,this.wot),"undefined"==typeof WalkontableBottomOverlay?this.bottomOverlay={needFullRender:!1}:this.bottomOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_BOTTOM,this.wot),this.leftOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_LEFT,this.wot),this.topOverlay.needFullRender&&this.leftOverlay.needFullRender&&(this.topLeftCornerOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_TOP_LEFT_CORNER,this.wot)),this.bottomOverlay.needFullRender&&this.leftOverlay.needFullRender&&"undefined"!=typeof WalkontableBottomLeftCornerOverlay?this.bottomLeftCornerOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER,this.wot):this.bottomLeftCornerOverlay={needFullRender:!1},this.wot.getSetting("debug")&&(this.debug=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_DEBUG,this.wot)),this.destroyed=!1,this.keyPressed=!1,this.spreaderLastSize={width:null,height:null},this.overlayScrollPositions={master:{top:0,left:0},top:{top:null,left:0},bottom:{top:null,left:0},left:{top:0,left:null}},this.pendingScrollCallbacks={master:{top:0,left:0},top:{left:0},bottom:{left:0},left:{top:0}},this.verticalScrolling=!1,this.horizontalScrolling=!1,this.delegatedScrollCallback=!1,this.registeredListeners=[],this.registerListeners()};$traceurRuntime.createClass(v,{refreshAll:function(){if(this.wot.drawn){if(!this.wot.wtTable.holder.parentNode)return void this.destroy();this.wot.draw(!0),this.verticalScrolling&&this.leftOverlay.onScroll(),this.horizontalScrolling&&this.topOverlay.onScroll(),this.verticalScrolling=!1,this.horizontalScrolling=!1}},registerListeners:function(){var e=this,t=this.topOverlay.mainTableScrollableElement,n=this.leftOverlay.mainTableScrollableElement,o=[];for(o.push([document.documentElement,"keydown",function(t){return e.onKeyDown(t)}]),o.push([document.documentElement,"keyup",function(){return e.onKeyUp()}]),o.push([document,"visibilitychange",function(){return e.onKeyUp()}]),o.push([t,"scroll",function(t){return e.onTableScroll(t)}]),t!==n&&o.push([n,"scroll",function(t){return e.onTableScroll(t)}]),this.topOverlay.needFullRender&&(o.push([this.topOverlay.clone.wtTable.holder,"scroll",function(t){return e.onTableScroll(t)}]),o.push([this.topOverlay.clone.wtTable.holder,"wheel",function(t){return e.onTableScroll(t)}])),this.bottomOverlay.needFullRender&&(o.push([this.bottomOverlay.clone.wtTable.holder,"scroll",function(t){return e.onTableScroll(t)}]),o.push([this.bottomOverlay.clone.wtTable.holder,"wheel",function(t){return e.onTableScroll(t)}])),this.leftOverlay.needFullRender&&(o.push([this.leftOverlay.clone.wtTable.holder,"scroll",function(t){return e.onTableScroll(t)}]),o.push([this.leftOverlay.clone.wtTable.holder,"wheel",function(t){return e.onTableScroll(t)}])),this.topOverlay.trimmingContainer!==window&&this.leftOverlay.trimmingContainer!==window&&o.push([window,"wheel",function(t){var n,o=t.wheelDeltaY||t.deltaY,i=t.wheelDeltaX||t.deltaX;e.topOverlay.clone.wtTable.holder.contains(t.realTarget)?n="top":e.bottomOverlay.clone&&e.bottomOverlay.clone.wtTable.holder.contains(t.realTarget)?n="bottom":e.leftOverlay.clone.wtTable.holder.contains(t.realTarget)&&(n="left"),"top"==n&&0!==o?t.preventDefault():"left"==n&&0!==i?t.preventDefault():"bottom"==n&&0!==o&&t.preventDefault()}]);o.length;){var i=o.pop();this.eventManager.addEventListener(i[0],i[1],i[2]),this.registeredListeners.push(i)}},deregisterListeners:function(){for(;this.registeredListeners.length;){var e=this.registeredListeners.pop();this.eventManager.removeEventListener(e[0],e[1],e[2])}},onTableScroll:function(e){if(!g()){var t=this.leftOverlay.mainTableScrollableElement,n=this.topOverlay.mainTableScrollableElement,o=e.target;this.keyPressed&&(n!==window&&o!==window&&!e.target.contains(n)||t!==window&&o!==window&&!e.target.contains(t))||("scroll"===e.type?this.syncScrollPositions(e):this.translateMouseWheelToScroll(e))}},onKeyDown:function(e){this.keyPressed=p(e.keyCode,"ARROW_UP|ARROW_RIGHT|ARROW_DOWN|ARROW_LEFT")},onKeyUp:function(){this.keyPressed=!1},translateMouseWheelToScroll:function(e){var t,n=this.topOverlay.clone.wtTable.holder,o=this.bottomOverlay.clone?this.bottomOverlay.clone.wtTable.holder:null,i=this.leftOverlay.clone.wtTable.holder,r={type:"wheel"},s=e.target,a=e.wheelDeltaY||-1*e.deltaY,l=e.wheelDeltaX||-1*e.deltaX;for(1===e.deltaMode&&(a*=120,l*=120);s!=document&&null!=s;){if(s.className.indexOf("wtHolder")>-1){t=s;break}s=s.parentNode}return r.target=t,t==n?this.syncScrollPositions(r,-.2*a):t==o?this.syncScrollPositions(r,-.2*a):t==i&&this.syncScrollPositions(r,-.2*l),!1},syncScrollPositions:function(e){var t=void 0!==arguments[1]?arguments[1]:null;if(!this.destroyed){if(0===arguments.length)return void this.syncScrollWithMaster();var n,o,i,r=this.leftOverlay.mainTableScrollableElement,s=this.topOverlay.mainTableScrollableElement,a=e.target,l=0,u=!1,c=!1,f=this.wot.getSetting("preventOverflow");this.topOverlay.needFullRender&&(n=this.topOverlay.clone.wtTable.holder),this.bottomOverlay.needFullRender&&(i=this.bottomOverlay.clone.wtTable.holder),this.leftOverlay.needFullRender&&(o=this.leftOverlay.clone.wtTable.holder),a===document&&(a=window),a===r||a===s?(l=d(f?this.scrollableElement:a),this.horizontalScrolling=!0,this.overlayScrollPositions.master.left=l,u=!0,this.pendingScrollCallbacks.master.left>0?this.pendingScrollCallbacks.master.left--:(n&&n.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.top.left++,n.scrollLeft=l,c=r!==window),i&&i.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.bottom.left++,i.scrollLeft=l,c=r!==window)),l=h(a),this.verticalScrolling=!0,this.overlayScrollPositions.master.top=l,u=!0,this.pendingScrollCallbacks.master.top>0?this.pendingScrollCallbacks.master.top--:o&&o.scrollTop!==l&&(null==t&&this.pendingScrollCallbacks.left.top++,o.scrollTop=l,c=s!==window)):a===i?(l=d(a),this.horizontalScrolling=!0,this.overlayScrollPositions.bottom.left=l,u=!0,this.pendingScrollCallbacks.bottom.left>0?this.pendingScrollCallbacks.bottom.left--:(null==t&&this.pendingScrollCallbacks.master.left++,r.scrollLeft=l,n&&n.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.top.left++,n.scrollLeft=l,c=s!==window)),null!==t&&(u=!0,s.scrollTop+=t)):a===n?(l=d(a),this.horizontalScrolling=!0,this.overlayScrollPositions.top.left=l,u=!0,this.pendingScrollCallbacks.top.left>0?this.pendingScrollCallbacks.top.left--:(null==t&&this.pendingScrollCallbacks.master.left++,r.scrollLeft=l),null!==t&&(u=!0,s.scrollTop+=t),i&&i.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.bottom.left++,i.scrollLeft=l,c=s!==window)):a===o&&(l=h(a),this.overlayScrollPositions.left.top!==l&&(this.verticalScrolling=!0,this.overlayScrollPositions.left.top=l,u=!0,this.pendingScrollCallbacks.left.top>0?this.pendingScrollCallbacks.left.top--:(null==t&&this.pendingScrollCallbacks.master.top++,s.scrollTop=l)),null!==t&&(u=!0,s.scrollLeft+=t)),!this.keyPressed&&u&&"scroll"===e.type&&(this.delegatedScrollCallback?this.delegatedScrollCallback=!1:this.refreshAll(),c&&(this.delegatedScrollCallback=!0))}},syncScrollWithMaster:function(){var e=this.topOverlay.mainTableScrollableElement;this.topOverlay.needFullRender&&(this.topOverlay.clone.wtTable.holder.scrollLeft=e.scrollLeft),this.leftOverlay.needFullRender&&(this.leftOverlay.clone.wtTable.holder.scrollTop=e.scrollTop)},updateMainScrollableElements:function(){this.deregisterListeners(),this.leftOverlay.updateMainScrollableElement(),this.topOverlay.updateMainScrollableElement(),this.bottomOverlay.needFullRender&&this.bottomOverlay.updateMainScrollableElement(),this.scrollableElement=u(this.wot.wtTable.TABLE),this.registerListeners()},destroy:function(){this.eventManager.destroy(),this.topOverlay.destroy(),this.bottomOverlay.clone&&this.bottomOverlay.destroy(),this.leftOverlay.destroy(),this.topLeftCornerOverlay&&this.topLeftCornerOverlay.destroy(),this.bottomLeftCornerOverlay&&this.bottomLeftCornerOverlay.clone&&this.bottomLeftCornerOverlay.destroy(),this.debug&&this.debug.destroy(),this.destroyed=!0},refresh:function(){var e=void 0!==arguments[0]&&arguments[0];if(this.topOverlay.areElementSizesAdjusted&&this.leftOverlay.areElementSizesAdjusted){var t=this.wot.wtTable.wtRootElement.parentNode||this.wot.wtTable.wtRootElement,n=t.clientWidth,o=t.clientHeight;n===this.spreaderLastSize.width&&o===this.spreaderLastSize.height||(this.spreaderLastSize.width=n,this.spreaderLastSize.height=o,this.adjustElementsSize())}this.bottomOverlay.clone&&this.bottomOverlay.refresh(e),this.leftOverlay.refresh(e),this.topOverlay.refresh(e),this.topLeftCornerOverlay&&this.topLeftCornerOverlay.refresh(e),this.bottomLeftCornerOverlay&&this.bottomLeftCornerOverlay.clone&&this.bottomLeftCornerOverlay.refresh(e),this.debug&&this.debug.refresh(e)},adjustElementsSize:function(){var e=void 0!==arguments[0]&&arguments[0],t=this.wot.getSetting("totalColumns"),n=this.wot.getSetting("totalRows"),o=this.wot.wtViewport.getRowHeaderWidth(),i=this.wot.wtViewport.getColumnHeaderHeight(),r=this.wot.wtTable.hider.style;r.width=o+this.leftOverlay.sumCellSizes(0,t)+"px",r.height=i+this.topOverlay.sumCellSizes(0,n)+1+"px",this.topOverlay.adjustElementsSize(e),this.leftOverlay.adjustElementsSize(e),this.bottomOverlay.clone&&this.bottomOverlay.adjustElementsSize(e)},applyToDOM:function(){this.topOverlay.areElementSizesAdjusted&&this.leftOverlay.areElementSizesAdjusted||this.adjustElementsSize(),this.topOverlay.applyToDOM(),this.bottomOverlay.clone&&this.bottomOverlay.applyToDOM(),this.leftOverlay.applyToDOM()},getParentOverlay:function(e){if(!e)return null;var t=[this.topOverlay,this.leftOverlay,this.bottomOverlay,this.topLeftCornerOverlay,this.bottomLeftCornerOverlay],n=null;return f(t,function(t,o){t&&t.clone&&t.clone.wtTable.TABLE.contains(e)&&(n=t.clone)}),n}},{}),window.WalkontableOverlays=v},{eventManager:42,"helpers/array":43,"helpers/browser":44,"helpers/dom/element":47,"helpers/unicode":56}],18:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableScroll:{get:function(){return p}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.innerHeight,a=r.innerWidth,l=r.getScrollLeft,u=r.getScrollTop,c=r.offset,d=(i=e("helpers/number"))&&i.__esModule&&i||{default:i},h=d.rangeEach,f=d.rangeEachReverse,p=function(e){this.wot=e,this.instance=e};$traceurRuntime.createClass(p,{scrollViewport:function(e){if(this.wot.drawn){var t=this._getVariables(),n=t.topOverlay,o=t.leftOverlay,i=t.totalRows,r=t.totalColumns,s=t.fixedRowsTop,a=t.fixedRowsBottom,l=t.fixedColumnsLeft;if(e.row<0||e.row>Math.max(i-1,0))throw new Error("row "+e.row+" does not exist");if(e.col<0||e.col>Math.max(r-1,0))throw new Error("column "+e.col+" does not exist");e.row>=s&&e.row<this.getFirstVisibleRow()?n.scrollTo(e.row):e.row>this.getLastVisibleRow()&&e.row<i-a&&n.scrollTo(e.row,!0),e.col>=l&&e.col<this.getFirstVisibleColumn()?o.scrollTo(e.col):e.col>this.getLastVisibleColumn()&&o.scrollTo(e.col,!0)}},getFirstVisibleRow:function(){var e=this._getVariables(),t=e.topOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalRows,r=e.fixedRowsTop,a=n.getFirstVisibleRow();if(t.mainTableScrollableElement===window){var l=c(n.wtRootElement),d=s(n.hider),h=s(window),p=u(window);if(l.top+d-h<=p){var g=o.getColumnHeaderHeight();g+=t.sumCellSizes(0,r),f(i,1,function(e){if(g+=t.sumCellSizes(e-1,e),l.top+d-g<=p)return a=e,!1})}}return a},getLastVisibleRow:function(){var e=this._getVariables(),t=e.topOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalRows,r=n.getLastVisibleRow();if(t.mainTableScrollableElement===window){var a=c(n.wtRootElement),l=s(window),d=u(window);if(a.top>d){var f=o.getColumnHeaderHeight();h(1,i,function(e){if(f+=t.sumCellSizes(e-1,e),a.top+f-d>=l)return r=e-2,!1})}}return r},getFirstVisibleColumn:function(){var e=this._getVariables(),t=e.leftOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalColumns,r=(e.fixedColumnsLeft,n.getFirstVisibleColumn());if(t.mainTableScrollableElement===window){var s=c(n.wtRootElement),u=a(n.hider),d=a(window),h=l(window);if(s.left+u-d<=h){var p=o.getRowHeaderWidth();f(i,1,function(e){if(p+=t.sumCellSizes(e-1,e),s.left+u-p<=h)return r=e,!1})}}return r},getLastVisibleColumn:function(){var e=this._getVariables(),t=e.leftOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalColumns,r=n.getLastVisibleColumn();if(t.mainTableScrollableElement===window){var s=c(n.wtRootElement),u=a(window),d=l(window);if(s.left>d){var f=o.getRowHeaderWidth();h(1,i,function(e){if(f+=t.sumCellSizes(e-1,e),s.left+f-d>=u)return r=e-2,!1})}}return r},_getVariables:function(){var e=this.wot;return{topOverlay:e.wtOverlays.topOverlay,leftOverlay:e.wtOverlays.leftOverlay,wtTable:e.wtTable,wtViewport:e.wtViewport,totalRows:e.getSetting("totalRows"),totalColumns:e.getSetting("totalColumns"),fixedRowsTop:e.getSetting("fixedRowsTop"),fixedRowsBottom:e.getSetting("fixedRowsBottom"),fixedColumnsLeft:e.getSetting("fixedColumnsLeft")}}},{}),window.WalkontableScroll=p},{"helpers/dom/element":47,"helpers/number":52}],19:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableSelection:{get:function(){return d}},__esModule:{value:!0}});var o,i,r,s,a=((o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o}).addClass,l=((i=e("border"))&&i.__esModule&&i||{default:i}).WalkontableBorder,u=((r=e("cell/coords"))&&r.__esModule&&r||{default:r}).WalkontableCellCoords,c=((s=e("cell/range"))&&s.__esModule&&s||{default:s}).WalkontableCellRange,d=function(e,t){this.settings=e,this.cellRange=t||null,this.instanceBorders={}};$traceurRuntime.createClass(d,{getBorder:function(e){return this.instanceBorders[e.guid]?this.instanceBorders[e.guid]:void(this.instanceBorders[e.guid]=new l(e,this.settings))},isEmpty:function(){return null===this.cellRange},add:function(e){this.isEmpty()?this.cellRange=new c(e,e,e):this.cellRange.expand(e)},replace:function(e,t){if(!this.isEmpty()){if(this.cellRange.from.isEqual(e))return this.cellRange.from=t,!0;if(this.cellRange.to.isEqual(e))return this.cellRange.to=t,!0}return!1},clear:function(){this.cellRange=null},getCorners:function(){var e=this.cellRange.getTopLeftCorner(),t=this.cellRange.getBottomRightCorner();return[e.row,e.col,t.row,t.col]},addClassAtCoords:function(e,t,n,o){var i=e.wtTable.getCell(new u(t,n));"object"==typeof i&&a(i,o)},draw:function(e){if(this.isEmpty()){if(this.settings.border){var t=this.getBorder(e);t&&t.disappear()}}else{for(var n,o,i,r=e.wtTable.getRenderedRowsCount(),s=e.wtTable.getRenderedColumnsCount(),l=this.getCorners(),u=0;u<s;u++)(o=e.wtTable.columnFilter.renderedToSource(u))>=l[1]&&o<=l[3]&&(i=e.wtTable.getColumnHeader(o))&&this.settings.highlightColumnClassName&&a(i,this.settings.highlightColumnClassName);for(var c=0;c<r;c++){(n=e.wtTable.rowFilter.renderedToSource(c))>=l[0]&&n<=l[2]&&(i=e.wtTable.getRowHeader(n))&&this.settings.highlightRowClassName&&a(i,this.settings.highlightRowClassName);for(var d=0;d<s;d++)o=e.wtTable.columnFilter.renderedToSource(d),n>=l[0]&&n<=l[2]&&o>=l[1]&&o<=l[3]?this.settings.className&&this.addClassAtCoords(e,n,o,this.settings.className):n>=l[0]&&n<=l[2]?this.settings.highlightRowClassName&&this.addClassAtCoords(e,n,o,this.settings.highlightRowClassName):o>=l[1]&&o<=l[3]&&this.settings.highlightColumnClassName&&this.addClassAtCoords(e,n,o,this.settings.highlightColumnClassName)}if(e.getSetting("onBeforeDrawBorders",l,this.settings.className),this.settings.border){var h=this.getBorder(e);h&&h.appear(l)}}}},{}),window.WalkontableSelection=d},{border:3,"cell/coords":6,"cell/range":7,"helpers/dom/element":47}],20:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableSettings:{get:function(){return r}},__esModule:{value:!0}});var o,i=((o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o}).fastInnerText,r=function(e,t){var n=this;this.wot=e,this.instance=e,this.defaults={table:void 0,debug:!1,externalRowCalculator:!1,stretchH:"none",currentRowClassName:null,currentColumnClassName:null,preventOverflow:function(){return!1},data:void 0,fixedColumnsLeft:0,fixedRowsTop:0,fixedRowsBottom:0,minSpareRows:0,rowHeaders:function(){return[]},columnHeaders:function(){return[]},totalRows:void 0,totalColumns:void 0,cellRenderer:function(e,t,o){var r=n.getSetting("data",e,t);i(o,void 0===r||null===r?"":r)},columnWidth:function(e){},rowHeight:function(e){},defaultRowHeight:23,defaultColumnWidth:50,selections:null,hideBorderOnMouseDownOver:!1,viewportRowCalculatorOverride:null,viewportColumnCalculatorOverride:null,onCellMouseDown:null,onCellMouseOver:null,onCellDblClick:null,onCellCornerMouseDown:null,onCellCornerDblClick:null,beforeDraw:null,onDraw:null,onBeforeDrawBorders:null,onScrollVertically:null,onScrollHorizontally:null,onBeforeTouchScroll:null,onAfterMomentumScroll:null,onBeforeStretchingColumnWidth:function(e){return e},scrollbarWidth:10,scrollbarHeight:10,renderAllRows:!1,groups:!1,rowHeaderWidth:null,columnHeaderHeight:null},this.settings={};for(var o in this.defaults)if(this.defaults.hasOwnProperty(o))if(void 0!==t[o])this.settings[o]=t[o];else{if(void 0===this.defaults[o])throw new Error('A required setting "'+o+'" was not provided');this.settings[o]=this.defaults[o]}};$traceurRuntime.createClass(r,{update:function(e,t){if(void 0===t)for(var n in e)e.hasOwnProperty(n)&&(this.settings[n]=e[n]);else this.settings[e]=t;return this.wot},getSetting:function(e,t,n,o,i){return"function"==typeof this.settings[e]?this.settings[e](t,n,o,i):void 0!==t&&Array.isArray(this.settings[e])?this.settings[e][t]:this.settings[e]},has:function(e){return!!this.settings[e]}},{}),window.WalkontableSettings=r},{"helpers/dom/element":47}],21:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableTable:{get:function(){return S}},__esModule:{value:!0}});var o,i,r,s,a,l,u=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},c=u.getStyle,d=u.getTrimmingContainer,h=u.hasClass,f=u.index,p=u.offset,g=u.removeClass,m=u.removeTextNodes,v=u.overlayContainsElement,w=u.closest,y=((i=e("cell/coords"))&&i.__esModule&&i||{default:i}).WalkontableCellCoords,b=((r=e("cell/range"))&&r.__esModule,((s=e("filter/column"))&&s.__esModule&&s||{default:s}).WalkontableColumnFilter),C=((a=e("filter/row"))&&a.__esModule&&a||{default:a}).WalkontableRowFilter,_=((l=e("tableRenderer"))&&l.__esModule&&l||{default:l}).WalkontableTableRenderer,S=function(e,t){this.wot=e,this.instance=this.wot,this.TABLE=t,this.TBODY=null,this.THEAD=null,this.COLGROUP=null,this.tableOffset=0,this.holderOffset=0,m(this.TABLE),this.spreader=this.createSpreader(this.TABLE),this.hider=this.createHider(this.spreader),this.holder=this.createHolder(this.hider),this.wtRootElement=this.holder.parentNode,this.alignOverlaysWithTrimmingContainer(),this.fixTableDomTree(),this.colgroupChildrenLength=this.COLGROUP.childNodes.length,this.theadChildrenLength=this.THEAD.firstChild?this.THEAD.firstChild.childNodes.length:0,this.tbodyChildrenLength=this.TBODY.childNodes.length,this.rowFilter=null,this.columnFilter=null};$traceurRuntime.createClass(S,{fixTableDomTree:function(){this.TBODY=this.TABLE.querySelector("tbody"),this.TBODY||(this.TBODY=document.createElement("tbody"),this.TABLE.appendChild(this.TBODY)),this.THEAD=this.TABLE.querySelector("thead"),this.THEAD||(this.THEAD=document.createElement("thead"),this.TABLE.insertBefore(this.THEAD,this.TBODY)),this.COLGROUP=this.TABLE.querySelector("colgroup"),this.COLGROUP||(this.COLGROUP=document.createElement("colgroup"),this.TABLE.insertBefore(this.COLGROUP,this.THEAD)),this.wot.getSetting("columnHeaders").length&&!this.THEAD.childNodes.length&&this.THEAD.appendChild(document.createElement("TR"))},createSpreader:function(e){var t,n=e.parentNode;return n&&1===n.nodeType&&h(n,"wtHolder")||(t=document.createElement("div"),t.className="wtSpreader",n&&n.insertBefore(t,e),t.appendChild(e)),t.style.position="relative",t},createHider:function(e){var t,n=e.parentNode;return n&&1===n.nodeType&&h(n,"wtHolder")||(t=document.createElement("div"),t.className="wtHider",n&&n.insertBefore(t,e),t.appendChild(e)),t},createHolder:function(e){var t,n=e.parentNode;return n&&1===n.nodeType&&h(n,"wtHolder")||(t=document.createElement("div"),t.style.position="relative",t.className="wtHolder",n&&n.insertBefore(t,e),this.isWorkingOnClone()||(t.parentNode.className+="ht_master handsontable"),t.appendChild(e)),t},alignOverlaysWithTrimmingContainer:function(){var e=d(this.wtRootElement);if(!this.isWorkingOnClone())if(this.holder.parentNode.style.position="relative",e===window){var t=this.wot.getSetting("preventOverflow");t||(this.holder.style.overflow="visible",this.wtRootElement.style.overflow="visible")}else this.holder.style.width=c(e,"width"),this.holder.style.height=c(e,"height"),this.holder.style.overflow=""},isWorkingOnClone:function(){return!!this.wot.cloneSource},draw:function(e){var t=this.instance.getSetting("totalRows");if(this.isWorkingOnClone()||(this.holderOffset=p(this.holder),e=this.wot.wtViewport.createRenderCalculators(e)),e)this.isWorkingOnClone()||this.wot.wtViewport.createVisibleCalculators(),this.wot.wtOverlays&&this.wot.wtOverlays.refresh(!0);else{this.isWorkingOnClone()?this.tableOffset=this.wot.cloneSource.wtTable.tableOffset:this.tableOffset=p(this.TABLE);var n;n=WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_DEBUG)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_TOP)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_TOP_LEFT_CORNER)?0:WalkontableOverlay.isOverlayTypeOf(this.instance.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM)||WalkontableOverlay.isOverlayTypeOf(this.instance.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER)?Math.max(t-this.wot.getSetting("fixedRowsBottom"),0):this.wot.wtViewport.rowsRenderCalculator.startRow;var o;o=WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_DEBUG)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_LEFT)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_TOP_LEFT_CORNER)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER)?0:this.wot.wtViewport.columnsRenderCalculator.startColumn,this.rowFilter=new C(n,t,this.wot.getSetting("columnHeaders").length),this.columnFilter=new b(o,this.wot.getSetting("totalColumns"),this.wot.getSetting("rowHeaders").length),this.alignOverlaysWithTrimmingContainer(),this._doDraw()}return this.refreshSelections(e),this.isWorkingOnClone()||(this.wot.wtOverlays.topOverlay.resetFixedPosition(),
 this.wot.wtOverlays.bottomOverlay.clone&&this.wot.wtOverlays.bottomOverlay.resetFixedPosition(),this.wot.wtOverlays.leftOverlay.resetFixedPosition(),this.wot.wtOverlays.topLeftCornerOverlay&&this.wot.wtOverlays.topLeftCornerOverlay.resetFixedPosition(),this.instance.wtOverlays.bottomLeftCornerOverlay&&this.instance.wtOverlays.bottomLeftCornerOverlay.clone&&this.wot.wtOverlays.bottomLeftCornerOverlay.resetFixedPosition()),this.wot.drawn=!0,this},_doDraw:function(){new _(this).render()},removeClassFromCells:function(e){for(var t=this.TABLE.querySelectorAll("."+e),n=0,o=t.length;n<o;n++)g(t[n],e)},refreshSelections:function(e){if(this.wot.selections){var t=this.wot.selections.length;if(e)for(var n=0;n<t;n++)this.wot.selections[n].settings.className&&this.removeClassFromCells(this.wot.selections[n].settings.className),this.wot.selections[n].settings.highlightRowClassName&&this.removeClassFromCells(this.wot.selections[n].settings.highlightRowClassName),this.wot.selections[n].settings.highlightColumnClassName&&this.removeClassFromCells(this.wot.selections[n].settings.highlightColumnClassName);for(var o=0;o<t;o++)this.wot.selections[o].draw(this.wot,e)}},getCell:function(e){if(this.isRowBeforeRenderedRows(e.row))return-1;if(this.isRowAfterRenderedRows(e.row))return-2;var t=this.TBODY.childNodes[this.rowFilter.sourceToRendered(e.row)];return t?t.childNodes[this.columnFilter.sourceColumnToVisibleRowHeadedColumn(e.col)]:void 0},getColumnHeader:function(e){var t=void 0!==arguments[1]?arguments[1]:0,n=this.THEAD.childNodes[t];if(n)return n.childNodes[this.columnFilter.sourceColumnToVisibleRowHeadedColumn(e)]},getRowHeader:function(e){if(0===this.columnFilter.sourceColumnToVisibleRowHeadedColumn(0))return null;var t=this.TBODY.childNodes[this.rowFilter.sourceToRendered(e)];return t?t.childNodes[0]:void 0},getCoords:function(e){"TD"!==e.nodeName&&"TH"!==e.nodeName&&(e=w(e,["TD","TH"]));var t=e.parentNode,n=t.parentNode,o=f(t),i=e.cellIndex;return v(WalkontableOverlay.CLONE_TOP_LEFT_CORNER,e)||v(WalkontableOverlay.CLONE_TOP,e)?"THEAD"===n.nodeName&&(o-=n.childNodes.length):o=n===this.THEAD?this.rowFilter.visibleColHeadedRowToSourceRow(o):this.rowFilter.renderedToSource(o),i=v(WalkontableOverlay.CLONE_TOP_LEFT_CORNER,e)||v(WalkontableOverlay.CLONE_LEFT,e)?this.columnFilter.offsettedTH(i):this.columnFilter.visibleRowHeadedColumnToSourceColumn(i),new y(o,i)},getTrForRow:function(e){return this.TBODY.childNodes[this.rowFilter.sourceToRendered(e)]},getFirstRenderedRow:function(){return this.wot.wtViewport.rowsRenderCalculator.startRow},getFirstVisibleRow:function(){return this.wot.wtViewport.rowsVisibleCalculator.startRow},getFirstRenderedColumn:function(){return this.wot.wtViewport.columnsRenderCalculator.startColumn},getFirstVisibleColumn:function(){return this.wot.wtViewport.columnsVisibleCalculator.startColumn},getLastRenderedRow:function(){return this.wot.wtViewport.rowsRenderCalculator.endRow},getLastVisibleRow:function(){return this.wot.wtViewport.rowsVisibleCalculator.endRow},getLastRenderedColumn:function(){return this.wot.wtViewport.columnsRenderCalculator.endColumn},getLastVisibleColumn:function(){return this.wot.wtViewport.columnsVisibleCalculator.endColumn},isRowBeforeRenderedRows:function(e){return this.rowFilter.sourceToRendered(e)<0&&e>=0},isRowAfterViewport:function(e){return this.rowFilter.sourceToRendered(e)>this.getLastVisibleRow()},isRowAfterRenderedRows:function(e){return this.rowFilter.sourceToRendered(e)>this.getLastRenderedRow()},isColumnBeforeViewport:function(e){return this.columnFilter.sourceToRendered(e)<0&&e>=0},isColumnAfterViewport:function(e){return this.columnFilter.sourceToRendered(e)>this.getLastVisibleColumn()},isLastRowFullyVisible:function(){return this.getLastVisibleRow()===this.getLastRenderedRow()},isLastColumnFullyVisible:function(){return this.getLastVisibleColumn()===this.getLastRenderedColumn()},getRenderedColumnsCount:function(){var e=this.wot.wtViewport.columnsRenderCalculator.count,t=this.wot.getSetting("totalColumns");if(this.wot.isOverlayName(WalkontableOverlay.CLONE_DEBUG))e=t;else if(this.wot.isOverlayName(WalkontableOverlay.CLONE_LEFT)||this.wot.isOverlayName(WalkontableOverlay.CLONE_TOP_LEFT_CORNER)||this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER))return Math.min(this.wot.getSetting("fixedColumnsLeft"),t);return e},getRenderedRowsCount:function(){var e=this.wot.wtViewport.rowsRenderCalculator.count,t=this.wot.getSetting("totalRows");return this.wot.isOverlayName(WalkontableOverlay.CLONE_DEBUG)?e=t:this.wot.isOverlayName(WalkontableOverlay.CLONE_TOP)||this.wot.isOverlayName(WalkontableOverlay.CLONE_TOP_LEFT_CORNER)?e=Math.min(this.wot.getSetting("fixedRowsTop"),t):(this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)||this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER))&&(e=Math.min(this.wot.getSetting("fixedRowsBottom"),t)),e},getVisibleRowsCount:function(){return this.wot.wtViewport.rowsVisibleCalculator.count},allRowsInViewport:function(){return this.wot.getSetting("totalRows")==this.getVisibleRowsCount()},getRowHeight:function(e){var t=this.wot.wtSettings.settings.rowHeight(e),n=this.wot.wtViewport.oversizedRows[e];return void 0!==n&&(t=void 0===t?n:Math.max(t,n)),t},getColumnHeaderHeight:function(e){var t=this.wot.wtSettings.settings.defaultRowHeight,n=this.wot.wtViewport.oversizedColumnHeaders[e];return void 0!==n&&(t=t?Math.max(t,n):n),t},getVisibleColumnsCount:function(){return this.wot.wtViewport.columnsVisibleCalculator.count},allColumnsInViewport:function(){return this.wot.getSetting("totalColumns")==this.getVisibleColumnsCount()},getColumnWidth:function(e){var t=this.wot.wtSettings.settings.columnWidth;return"function"==typeof t?t=t(e):"object"==typeof t&&(t=t[e]),t||this.wot.wtSettings.settings.defaultColumnWidth},getStretchedColumnWidth:function(e){var t=this.getColumnWidth(e),n=null==t?this.instance.wtSettings.settings.defaultColumnWidth:t,o=this.wot.wtViewport.columnsRenderCalculator;if(o){var i=o.getStretchedColumnWidth(e,n);i&&(n=i)}return n}},{}),window.WalkontableTable=S},{"cell/coords":6,"cell/range":7,"filter/column":10,"filter/row":11,"helpers/dom/element":47,tableRenderer:22}],22:[function(e,t,n){"use strict";function o(e,t){var n=document.createElement("TH");return t.insertBefore(n,e),t.removeChild(e),n}function i(e,t){var n=document.createElement("TD");return t.insertBefore(n,e),t.removeChild(e),n}Object.defineProperties(n,{WalkontableTableRenderer:{get:function(){return p}},__esModule:{value:!0}});var r,s=(r=e("helpers/dom/element"))&&r.__esModule&&r||{default:r},a=s.addClass,l=s.empty,u=s.getScrollbarWidth,c=s.hasClass,d=s.innerHeight,h=s.outerWidth,f=!1,p=function(e){this.wtTable=e,this.wot=e.instance,this.instance=e.instance,this.rowFilter=e.rowFilter,this.columnFilter=e.columnFilter,this.TABLE=e.TABLE,this.THEAD=e.THEAD,this.TBODY=e.TBODY,this.COLGROUP=e.COLGROUP,this.rowHeaders=[],this.rowHeaderCount=0,this.columnHeaders=[],this.columnHeaderCount=0,this.fixedRowsTop=0,this.fixedRowsBottom=0};$traceurRuntime.createClass(p,{render:function(){this.wtTable.isWorkingOnClone()||this.wot.getSetting("beforeDraw",!0),this.rowHeaders=this.wot.getSetting("rowHeaders"),this.rowHeaderCount=this.rowHeaders.length,this.fixedRowsTop=this.wot.getSetting("fixedRowsTop"),this.fixedRowsBottom=this.wot.getSetting("fixedRowsBottom"),this.columnHeaders=this.wot.getSetting("columnHeaders"),this.columnHeaderCount=this.columnHeaders.length;var e,t=this.wtTable.getRenderedColumnsCount(),n=this.wtTable.getRenderedRowsCount(),o=this.wot.getSetting("totalColumns"),i=this.wot.getSetting("totalRows"),r=!1;if((WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER))&&(this.columnHeaders=[],this.columnHeaderCount=0),o>=0&&(this.adjustAvailableNodes(),r=!0,this.renderColumnHeaders(),this.renderRows(i,n,t),this.wtTable.isWorkingOnClone()||(e=this.wot.wtViewport.getWorkspaceWidth(),this.wot.wtViewport.containerWidth=null),this.adjustColumnWidths(t),this.markOversizedColumnHeaders(),this.adjustColumnHeaderHeights()),r||this.adjustAvailableNodes(),this.removeRedundantRows(n),this.wtTable.isWorkingOnClone()&&!this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)||this.markOversizedRows(),this.wtTable.isWorkingOnClone())this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)&&this.wot.cloneSource.wtOverlays.adjustElementsSize();else{this.wot.wtViewport.createVisibleCalculators(),this.wot.wtOverlays.refresh(!1);var s=h(this.wtTable.hider),a=h(this.wtTable.TABLE);if(0!==s&&a!==s&&this.adjustColumnWidths(t),this.wot.wtOverlays.applyToDOM(),e!==this.wot.wtViewport.getWorkspaceWidth()){this.wot.wtViewport.containerWidth=null;var l=this.wtTable.getFirstRenderedColumn(),u=this.wtTable.getLastRenderedColumn(),c=this.wot.getSetting("rowHeaderWidth");if(null!=c)for(var d=0;d<this.rowHeaderCount;d++)this.COLGROUP.childNodes[d].style.width=(isNaN(c)?c[d]:c)+"px";for(var f=l;f<u;f++){var p=this.wtTable.getStretchedColumnWidth(f),g=this.columnFilter.sourceToRendered(f);this.COLGROUP.childNodes[g+this.rowHeaderCount].style.width=p+"px"}}this.wot.getSetting("onDraw",!0)}},removeRedundantRows:function(e){for(;this.wtTable.tbodyChildrenLength>e;)this.TBODY.removeChild(this.TBODY.lastChild),this.wtTable.tbodyChildrenLength--},renderRows:function(e,t,n){for(var o,i=0,r=this.rowFilter.renderedToSource(i),s=this.wtTable.isWorkingOnClone();r<e&&r>=0&&(!f&&i>1e3&&(f=!0,console.warn('Performance tip: Handsontable rendered more than 1000 visible rows. Consider limiting the number of rendered rows by specifying the table height and/or turning off the "renderAllRows" option.')),void 0===t||i!==t);){if(o=this.getOrCreateTrForRow(i,o),this.renderRowHeaders(r,o),this.adjustColumns(o,n+this.rowHeaderCount),this.renderCells(r,o,n),s&&!this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)||this.resetOversizedRow(r),o.firstChild){var a=this.wot.wtTable.getRowHeight(r);a?(a--,o.firstChild.style.height=a+"px"):o.firstChild.style.height=""}i++,r=this.rowFilter.renderedToSource(i)}},resetOversizedRow:function(e){this.wot.getSetting("externalRowCalculator")||this.wot.wtViewport.oversizedRows&&this.wot.wtViewport.oversizedRows[e]&&(this.wot.wtViewport.oversizedRows[e]=void 0)},markOversizedRows:function(){if(!this.wot.getSetting("externalRowCalculator")){var e,t,n,o,i,r=this.instance.wtTable.TBODY.childNodes.length,s=r*this.instance.wtSettings.settings.defaultRowHeight,a=d(this.instance.wtTable.TBODY)-1;if(this.instance.getSetting("totalRows"),s!==a||this.instance.getSetting("fixedRowsBottom"))for(;r;)r--,n=this.instance.wtTable.rowFilter.renderedToSource(r),e=this.instance.wtTable.getRowHeight(n),o=this.instance.wtTable.getTrForRow(n),i=o.querySelector("th"),t=i?d(i):d(o)-1,(!e&&this.instance.wtSettings.settings.defaultRowHeight<t||e<t)&&(this.instance.wtViewport.oversizedRows[n]=++t)}},markOversizedColumnHeaders:function(){var e=this.wot.getOverlayName();if(this.columnHeaderCount&&!this.wot.wtViewport.hasOversizedColumnHeadersMarked[e]&&!this.wtTable.isWorkingOnClone()){for(var t=this.wtTable.getRenderedColumnsCount(),n=0;n<this.columnHeaderCount;n++)for(var o=-1*this.rowHeaderCount;o<t;o++)this.markIfOversizedColumnHeader(o);this.wot.wtViewport.hasOversizedColumnHeadersMarked[e]=!0}},adjustColumnHeaderHeights:function(){for(var e=this.wot.getSetting("columnHeaders"),t=this.wot.wtTable.THEAD.childNodes,n=this.wot.wtViewport.oversizedColumnHeaders,o=0,i=e.length;o<i;o++)if(n[o]){if(0===t[o].childNodes.length)return;t[o].childNodes[0].style.height=n[o]+"px"}},markIfOversizedColumnHeader:function(e){for(var t,n,o,i=this.wot.wtTable.columnFilter.renderedToSource(e),r=this.columnHeaderCount,s=this.wot.wtSettings.settings.defaultRowHeight,a=this.wot.getSetting("columnHeaderHeight")||[];r;)r--,t=this.wot.wtTable.getColumnHeaderHeight(r),(n=this.wot.wtTable.getColumnHeader(i,r))&&(o=d(n),(!t&&s<o||t<o)&&(this.wot.wtViewport.oversizedColumnHeaders[r]=o),Array.isArray(a)?null!=a[r]&&(this.wot.wtViewport.oversizedColumnHeaders[r]=a[r]):isNaN(a)||(this.wot.wtViewport.oversizedColumnHeaders[r]=a),this.wot.wtViewport.oversizedColumnHeaders[r]<(a[r]||a)&&(this.wot.wtViewport.oversizedColumnHeaders[r]=a[r]||a))},renderCells:function(e,t,n){for(var o,r,s=0;s<n;s++)r=this.columnFilter.renderedToSource(s),o=0===s?t.childNodes[this.columnFilter.sourceColumnToVisibleRowHeadedColumn(r)]:o.nextSibling,"TH"==o.nodeName&&(o=i(o,t)),c(o,"hide")||(o.className=""),o.removeAttribute("style"),this.wot.wtSettings.settings.cellRenderer(e,r,o);return o},adjustColumnWidths:function(e){var t=0,n=this.wot.cloneSource?this.wot.cloneSource:this.wot,o=n.wtTable.holder;o.offsetHeight<o.scrollHeight&&(t=u()),this.wot.wtViewport.columnsRenderCalculator.refreshStretching(this.wot.wtViewport.getViewportWidth()-t);var i=this.wot.getSetting("rowHeaderWidth");if(null!=i)for(var r=0;r<this.rowHeaderCount;r++)this.COLGROUP.childNodes[r].style.width=(isNaN(i)?i[r]:i)+"px";for(var s=0;s<e;s++){var a=this.wtTable.getStretchedColumnWidth(this.columnFilter.renderedToSource(s));this.COLGROUP.childNodes[s+this.rowHeaderCount].style.width=a+"px"}},appendToTbody:function(e){this.TBODY.appendChild(e),this.wtTable.tbodyChildrenLength++},getOrCreateTrForRow:function(e,t){var n;return e>=this.wtTable.tbodyChildrenLength?(n=this.createRow(),this.appendToTbody(n)):n=0===e?this.TBODY.firstChild:t.nextSibling,n.className&&n.removeAttribute("class"),n},createRow:function(){for(var e=document.createElement("TR"),t=0;t<this.rowHeaderCount;t++)e.appendChild(document.createElement("TH"));return e},renderRowHeader:function(e,t,n){n.className="",n.removeAttribute("style"),this.rowHeaders[t](e,n,t)},renderRowHeaders:function(e,t){for(var n=t.firstChild,i=0;i<this.rowHeaderCount;i++)n?"TD"==n.nodeName&&(n=o(n,t)):(n=document.createElement("TH"),t.appendChild(n)),this.renderRowHeader(e,i,n),n=n.nextSibling},adjustAvailableNodes:function(){this.adjustColGroups(),this.adjustThead()},renderColumnHeaders:function(){if(this.columnHeaderCount)for(var e=this.wtTable.getRenderedColumnsCount(),t=0;t<this.columnHeaderCount;t++)for(var n=this.getTrForColumnHeaders(t),o=-1*this.rowHeaderCount;o<e;o++){var i=this.columnFilter.renderedToSource(o);this.renderColumnHeader(t,i,n.childNodes[o+this.rowHeaderCount])}},adjustColGroups:function(){for(var e=this.wtTable.getRenderedColumnsCount();this.wtTable.colgroupChildrenLength<e+this.rowHeaderCount;)this.COLGROUP.appendChild(document.createElement("COL")),this.wtTable.colgroupChildrenLength++;for(;this.wtTable.colgroupChildrenLength>e+this.rowHeaderCount;)this.COLGROUP.removeChild(this.COLGROUP.lastChild),this.wtTable.colgroupChildrenLength--;this.rowHeaderCount&&a(this.COLGROUP.childNodes[0],"rowHeader")},adjustThead:function(){var e=this.wtTable.getRenderedColumnsCount(),t=this.THEAD.firstChild;if(this.columnHeaders.length){for(var n=0,o=this.columnHeaders.length;n<o;n++){for(t=this.THEAD.childNodes[n],t||(t=document.createElement("TR"),this.THEAD.appendChild(t)),this.theadChildrenLength=t.childNodes.length;this.theadChildrenLength<e+this.rowHeaderCount;)t.appendChild(document.createElement("TH")),this.theadChildrenLength++;for(;this.theadChildrenLength>e+this.rowHeaderCount;)t.removeChild(t.lastChild),this.theadChildrenLength--}var i=this.THEAD.childNodes.length;if(i>this.columnHeaders.length)for(var r=this.columnHeaders.length;r<i;r++)this.THEAD.removeChild(this.THEAD.lastChild)}else t&&l(t)},getTrForColumnHeaders:function(e){return this.THEAD.childNodes[e]},renderColumnHeader:function(e,t,n){return n.className="",n.removeAttribute("style"),this.columnHeaders[e](t,n,e)},adjustColumns:function(e,t){for(var n=e.childNodes.length;n<t;){var o=document.createElement("TD");e.appendChild(o),n++}for(;n>t;)e.removeChild(e.lastChild),n--},removeRedundantColumns:function(e){for(;this.wtTable.tbodyChildrenLength>e;)this.TBODY.removeChild(this.TBODY.lastChild),this.wtTable.tbodyChildrenLength--}},{}),window.WalkontableTableRenderer=p},{"helpers/dom/element":47}],23:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableViewport:{get:function(){return w}},__esModule:{value:!0}});var o,i,r,s,a,l=((o=e("browser"))&&o.__esModule&&o||{default:o}).default,u=(i=e("helpers/dom/element"))&&i.__esModule&&i||{default:i},c=u.getScrollbarWidth,d=u.getStyle,h=u.offset,f=u.outerHeight,p=u.outerWidth,g=((r=e("eventManager"))&&r.__esModule&&r||{default:r}).EventManager,m=((s=e("calculator/viewportColumns"))&&s.__esModule&&s||{default:s}).WalkontableViewportColumnsCalculator,v=((a=e("calculator/viewportRows"))&&a.__esModule&&a||{default:a}).WalkontableViewportRowsCalculator,w=function(e){var t=this;this.wot=e,this.instance=this.wot,this.oversizedRows=[],this.oversizedColumnHeaders=[],this.hasOversizedColumnHeadersMarked={},this.clientHeight=0,this.containerWidth=NaN,this.rowHeaderWidth=NaN,this.rowsVisibleCalculator=null,this.columnsVisibleCalculator=null,this.eventManager=new g(this.wot),this.eventManager.addEventListener(window,"resize",function(){t.clientHeight=t.getWorkspaceHeight()})};$traceurRuntime.createClass(w,{getWorkspaceHeight:function(){var e,t=this.instance.wtOverlays.topOverlay.trimmingContainer,n=0;return t===window?n=document.documentElement.clientHeight:(e=f(t),n=e>0&&t.clientHeight>0?t.clientHeight:1/0),n},getWorkspaceWidth:function(){var e,t,n=this.wot.getSetting("totalColumns"),o=this.instance.wtOverlays.leftOverlay.trimmingContainer,i=this.wot.getSetting("stretchH"),r=document.documentElement.offsetWidth;return this.wot.getSetting("preventOverflow")?p(this.instance.wtTable.wtRootElement):(e=l.freezeOverlays?Math.min(r-this.getWorkspaceOffset().left,r):Math.min(this.getContainerFillWidth(),r-this.getWorkspaceOffset().left,r),o===window&&n>0&&this.sumColumnWidths(0,n-1)>e?document.documentElement.clientWidth:o===window||"scroll"!=(t=d(this.instance.wtOverlays.leftOverlay.trimmingContainer,"overflow"))&&"hidden"!=t&&"auto"!=t?"none"!==i&&i?e:Math.max(e,p(this.instance.wtTable.TABLE)):Math.max(e,o.clientWidth))},hasVerticalScroll:function(){return this.getWorkspaceActualHeight()>this.getWorkspaceHeight()},hasHorizontalScroll:function(){return this.getWorkspaceActualWidth()>this.getWorkspaceWidth()},sumColumnWidths:function(e,t){for(var n=0;e<t;)n+=this.wot.wtTable.getColumnWidth(e),e++;return n},getContainerFillWidth:function(){if(this.containerWidth)return this.containerWidth;var e,t,n=this.instance.wtTable.holder;return t=document.createElement("div"),t.style.width="100%",t.style.height="1px",n.appendChild(t),e=t.offsetWidth,this.containerWidth=e,n.removeChild(t),e},getWorkspaceOffset:function(){return h(this.wot.wtTable.TABLE)},getWorkspaceActualHeight:function(){return f(this.wot.wtTable.TABLE)},getWorkspaceActualWidth:function(){return p(this.wot.wtTable.TABLE)||p(this.wot.wtTable.TBODY)||p(this.wot.wtTable.THEAD)},getColumnHeaderHeight:function(){return isNaN(this.columnHeaderHeight)&&(this.columnHeaderHeight=f(this.wot.wtTable.THEAD)),this.columnHeaderHeight},getViewportHeight:function(){var e,t=this.getWorkspaceHeight();return t===1/0?t:(e=this.getColumnHeaderHeight(),e>0&&(t-=e),t)},getRowHeaderWidth:function(){var e=this.instance.getSetting("rowHeaderWidth"),t=this.instance.getSetting("rowHeaders");if(e){this.rowHeaderWidth=0;for(var n=0,o=t.length;n<o;n++)this.rowHeaderWidth+=e[n]||e}if(this.wot.cloneSource)return this.wot.cloneSource.wtViewport.getRowHeaderWidth();if(isNaN(this.rowHeaderWidth))if(t.length){var i=this.instance.wtTable.TABLE.querySelector("TH");this.rowHeaderWidth=0;for(var r=0,s=t.length;r<s;r++)i?(this.rowHeaderWidth+=p(i),i=i.nextSibling):this.rowHeaderWidth+=50}else this.rowHeaderWidth=0;return this.rowHeaderWidth},getViewportWidth:function(){var e,t=this.getWorkspaceWidth();return t===1/0?t:(e=this.getRowHeaderWidth(),e>0?t-e:t)},createRowsCalculator:function(){var e,t,n,o,i,r,s,a=void 0!==arguments[0]&&arguments[0],l=this;return this.rowHeaderWidth=NaN,e=this.wot.wtSettings.settings.renderAllRows?1/0:this.getViewportHeight(),t=this.wot.wtOverlays.topOverlay.getScrollPosition()-this.wot.wtOverlays.topOverlay.getTableParentOffset(),t<0&&(t=0),n=this.wot.getSetting("fixedRowsTop"),i=this.wot.getSetting("fixedRowsBottom"),s=this.wot.getSetting("totalRows"),n&&(r=this.wot.wtOverlays.topOverlay.sumCellSizes(0,n),t+=r,e-=r),i&&this.wot.wtOverlays.bottomOverlay.clone&&(r=this.wot.wtOverlays.bottomOverlay.sumCellSizes(s-i,s),e-=r),o=this.wot.wtTable.holder.clientHeight===this.wot.wtTable.holder.offsetHeight?0:c(),new v(e,t,this.wot.getSetting("totalRows"),function(e){return l.wot.wtTable.getRowHeight(e)},a?null:this.wot.wtSettings.settings.viewportRowCalculatorOverride,a,o)},createColumnsCalculator:function(){var e,t,n=void 0!==arguments[0]&&arguments[0],o=this,i=this.getViewportWidth();if(this.columnHeaderHeight=NaN,e=this.wot.wtOverlays.leftOverlay.getScrollPosition()-this.wot.wtOverlays.leftOverlay.getTableParentOffset(),e<0&&(e=0),t=this.wot.getSetting("fixedColumnsLeft")){var r=this.wot.wtOverlays.leftOverlay.sumCellSizes(0,t);e+=r,i-=r}return this.wot.wtTable.holder.clientWidth!==this.wot.wtTable.holder.offsetWidth&&(i-=c()),new m(i,e,this.wot.getSetting("totalColumns"),function(e){return o.wot.wtTable.getColumnWidth(e)},n?null:this.wot.wtSettings.settings.viewportColumnCalculatorOverride,n,this.wot.getSetting("stretchH"),function(e,t){return o.wot.getSetting("onBeforeStretchingColumnWidth",e,t)})},createRenderCalculators:function(){var e=void 0!==arguments[0]&&arguments[0];if(e){var t=this.createRowsCalculator(!0),n=this.createColumnsCalculator(!0);this.areAllProposedVisibleRowsAlreadyRendered(t)&&this.areAllProposedVisibleColumnsAlreadyRendered(n)||(e=!1)}return e||(this.rowsRenderCalculator=this.createRowsCalculator(),this.columnsRenderCalculator=this.createColumnsCalculator()),this.rowsVisibleCalculator=null,this.columnsVisibleCalculator=null,e},createVisibleCalculators:function(){this.rowsVisibleCalculator=this.createRowsCalculator(!0),this.columnsVisibleCalculator=this.createColumnsCalculator(!0)},areAllProposedVisibleRowsAlreadyRendered:function(e){return!(!this.rowsVisibleCalculator||e.startRow<this.rowsRenderCalculator.startRow||e.startRow===this.rowsRenderCalculator.startRow&&e.startRow>0||e.endRow>this.rowsRenderCalculator.endRow||e.endRow===this.rowsRenderCalculator.endRow&&e.endRow<this.wot.getSetting("totalRows")-1)},areAllProposedVisibleColumnsAlreadyRendered:function(e){return!(!this.columnsVisibleCalculator||e.startColumn<this.columnsRenderCalculator.startColumn||e.startColumn===this.columnsRenderCalculator.startColumn&&e.startColumn>0||e.endColumn>this.columnsRenderCalculator.endColumn||e.endColumn===this.columnsRenderCalculator.endColumn&&e.endColumn<this.wot.getSetting("totalColumns")-1)}},{}),window.WalkontableViewport=w},{browser:24,"calculator/viewportColumns":4,"calculator/viewportRows":5,eventManager:42,"helpers/dom/element":47}],24:[function(e,t,n){"use strict";function o(e,t){var n=new o.Core(e,t||{});return n.init(),n}var i,r,s,a,l,u,c,d,h,f,p,g,m,v,w,y,b,C,_,S,T,E,R,M;t.exports=o,o.utils={},i=e("shims/runtime"),i&&i.__esModule,(r=e("es6collections"))&&r.__esModule;var O=((s=e("pluginHooks"))&&s.__esModule&&s||{default:s}).Hooks,k=((a=e("numbro"))&&a.__esModule&&a||{default:a}).default,x=((l=e("moment"))&&l.__esModule&&l||{default:l}).default;"object"==typeof window&&(void 0===window.numbro&&(window.numbro=k),void 0===window.moment&&(window.moment=x)),o.hooks||(o.hooks=new O),o.utils.Hooks=O,u=e("core"),u&&u.__esModule,c=e("renderers/_cellDecorator"),c&&c.__esModule,d=e("cellTypes"),d&&d.__esModule,(h=e("plugins/jqueryHandsontable"))&&h.__esModule;var D=(f=e("helpers/array"))&&f.__esModule&&f||{default:f},A=(p=e("helpers/browser"))&&p.__esModule&&p||{default:p},P=(g=e("helpers/data"))&&g.__esModule&&g||{default:g},H=(m=e("helpers/date"))&&m.__esModule&&m||{default:m},N=(v=e("helpers/feature"))&&v.__esModule&&v||{default:v},L=(w=e("helpers/function"))&&w.__esModule&&w||{default:w},I=(y=e("helpers/mixed"))&&y.__esModule&&y||{default:y},W=(b=e("helpers/number"))&&b.__esModule&&b||{default:b},j=(C=e("helpers/object"))&&C.__esModule&&C||{default:C},B=(_=e("helpers/setting"))&&_.__esModule&&_||{default:_},F=(S=e("helpers/string"))&&S.__esModule&&S||{default:S},V=(T=e("helpers/unicode"))&&T.__esModule&&T||{default:T},z=(E=e("helpers/dom/element"))&&E.__esModule&&E||{default:E},Y=(R=e("helpers/dom/event"))&&R.__esModule&&R||{default:R},U=[D,A,P,H,N,L,I,W,j,B,F,V],G=[z,Y];o.buildDate="Wed Jul 27 2016 12:03:17 GMT+0200 (CEST)",o.packageName="handsontable",o.version="0.26.1";var $="@@baseVersion";/^@@/.test($)||(o.baseVersion=$),o.plugins={};var q=((M=e("plugins"))&&M.__esModule&&M||{default:M}).registerPlugin;o.plugins.registerPlugin=q,o.helper={},o.dom={},o.Dom=o.dom,D.arrayEach(U,function(e){D.arrayEach(Object.getOwnPropertyNames(e),function(t){"_"!==t.charAt(0)&&(o.helper[t]=e[t])})}),D.arrayEach(G,function(e){D.arrayEach(Object.getOwnPropertyNames(e),function(t){"_"!==t.charAt(0)&&(o.dom[t]=e[t])})})},{cellTypes:25,core:26,es6collections:"es6collections","helpers/array":43,"helpers/browser":44,"helpers/data":45,"helpers/date":46,"helpers/dom/element":47,"helpers/dom/event":48,"helpers/feature":49,"helpers/function":50,"helpers/mixed":51,"helpers/number":52,"helpers/object":53,"helpers/setting":54,"helpers/string":55,"helpers/unicode":56,moment:"moment",numbro:"numbro",pluginHooks:59,plugins:60,"plugins/jqueryHandsontable":2,"renderers/_cellDecorator":106,"shims/runtime":113}],25:[function(e,t,n){"use strict";var o,i,r,s,a,l,u,c,d,h,f,p,g,m,v,w,y,b,C,_,S,T,E,R,M=((o=e("helpers/browser"))&&o.__esModule&&o||{default:o}).isMobileBrowser,O=((i=e("editors"))&&i.__esModule&&i||{default:i}).getEditorConstructor,k=((r=e("renderers"))&&r.__esModule&&r||{default:r}).getRenderer,x=((s=e("editors/autocompleteEditor"))&&s.__esModule,(a=e("editors/checkboxEditor"))&&a.__esModule,(l=e("editors/dateEditor"))&&l.__esModule,(u=e("editors/dropdownEditor"))&&u.__esModule,(c=e("editors/handsontableEditor"))&&c.__esModule,(d=e("editors/mobileTextEditor"))&&d.__esModule,(h=e("editors/numericEditor"))&&h.__esModule,(f=e("editors/passwordEditor"))&&f.__esModule,(p=e("editors/selectEditor"))&&p.__esModule,(g=e("editors/textEditor"))&&g.__esModule,(m=e("renderers/autocompleteRenderer"))&&m.__esModule,(v=e("renderers/checkboxRenderer"))&&v.__esModule,(w=e("renderers/htmlRenderer"))&&w.__esModule,(y=e("renderers/numericRenderer"))&&y.__esModule,(b=e("renderers/passwordRenderer"))&&b.__esModule,(C=e("renderers/textRenderer"))&&C.__esModule,(_=e("validators/autocompleteValidator"))&&_.__esModule,(S=e("validators/dateValidator"))&&S.__esModule,(T=e("validators/timeValidator"))&&T.__esModule,(E=e("validators/numericValidator"))&&E.__esModule,((R=e("browser"))&&R.__esModule&&R||{default:R}).default);x.AutocompleteCell={editor:O("autocomplete"),renderer:k("autocomplete"),validator:x.AutocompleteValidator},x.CheckboxCell={editor:O("checkbox"),renderer:k("checkbox")},x.TextCell={editor:O(M()?"mobile":"text"),renderer:k("text")},x.NumericCell={editor:O("numeric"),renderer:k("numeric"),validator:x.NumericValidator,dataType:"number"},x.DateCell={editor:O("date"),validator:x.DateValidator,renderer:k("autocomplete")},x.TimeCell={editor:O("text"),validator:x.TimeValidator,renderer:k("text")},x.HandsontableCell={editor:O("handsontable"),renderer:k("autocomplete")},x.PasswordCell={editor:O("password"),renderer:k("password"),copyable:!1},x.DropdownCell={editor:O("dropdown"),renderer:k("autocomplete"),validator:x.AutocompleteValidator},x.cellTypes={text:x.TextCell,date:x.DateCell,time:x.TimeCell,numeric:x.NumericCell,checkbox:x.CheckboxCell,autocomplete:x.AutocompleteCell,handsontable:x.HandsontableCell,password:x.PasswordCell,dropdown:x.DropdownCell},x.cellLookup={validator:{numeric:x.NumericValidator,autocomplete:x.AutocompleteValidator}}},{browser:24,editors:30,"editors/autocompleteEditor":32,"editors/checkboxEditor":33,"editors/dateEditor":34,"editors/dropdownEditor":35,"editors/handsontableEditor":36,"editors/mobileTextEditor":37,"editors/numericEditor":38,"editors/passwordEditor":39,"editors/selectEditor":40,"editors/textEditor":41,"helpers/browser":44,renderers:105,"renderers/autocompleteRenderer":107,"renderers/checkboxRenderer":108,"renderers/htmlRenderer":109,"renderers/numericRenderer":110,"renderers/passwordRenderer":111,"renderers/textRenderer":112,"validators/autocompleteValidator":118,"validators/dateValidator":119,"validators/numericValidator":120,"validators/timeValidator":121}],26:[function(e,t,n){"use strict";var o,i,r,s,a,l,u,c,d,h,f,p,g,m,v,w,y,b,C,_,S,T,E=((o=e("browser"))&&o.__esModule&&o||{default:o}).default,R=((i=e("numbro"))&&i.__esModule&&i||{default:i}).default,M=(r=e("helpers/dom/element"))&&r.__esModule&&r||{default:r},O=M.addClass,k=M.empty,x=M.isChildOfWebComponentTable,D=M.removeClass,A=((s=e("helpers/setting"))&&s.__esModule&&s||{default:s}).columnFactory,P=((a=e("helpers/function"))&&a.__esModule&&a||{default:a}).isFunction,H=(l=e("helpers/mixed"))&&l.__esModule&&l||{default:l},N=H.isDefined,L=H.isUndefined,I=((u=e("helpers/browser"))&&u.__esModule&&u||{default:u}).isMobileBrowser,W=((c=e("dataMap"))&&c.__esModule&&c||{default:c}).DataMap,j=((d=e("editorManager"))&&d.__esModule&&d||{default:d}).EditorManager,B=((h=e("eventManager"))&&h.__esModule&&h||{default:h}).eventManager,F=(f=e("helpers/object"))&&f.__esModule&&f||{default:f},V=F.deepClone,z=F.duckSchema,Y=F.extend,U=F.isObject,G=F.isObjectEquals,$=F.deepObjectSize,q=(p=e("helpers/array"))&&p.__esModule&&p||{default:p},K=q.arrayFlatten,X=q.arrayMap,J=((g=e("plugins"))&&g.__esModule&&g||{default:g}).getPlugin,Z=((m=e("renderers"))&&m.__esModule&&m||{default:m}).getRenderer,Q=((v=e("helpers/string"))&&v.__esModule&&v||{default:v}).randomString,ee=((w=e("helpers/number"))&&w.__esModule&&w||{default:w}).rangeEach,te=((y=e("tableView"))&&y.__esModule&&y||{default:y}).TableView,ne=((b=e("dataSource"))&&b.__esModule&&b||{default:b}).DataSource,oe=(C=e("helpers/data"))&&C.__esModule&&C||{default:C},ie=oe.translateRowsToColumns,re=oe.cellMethodLookupFactory,se=oe.spreadsheetColumnLabel,ae=((_=e("3rdparty/walkontable/src/cell/coords"))&&_.__esModule&&_||{default:_}).WalkontableCellCoords,le=((S=e("3rdparty/walkontable/src/cell/range"))&&S.__esModule&&S||{default:S}).WalkontableCellRange,ue=((T=e("3rdparty/walkontable/src/calculator/viewportColumns"))&&T.__esModule&&T||{default:T}).WalkontableViewportColumnsCalculator;E.activeGuid=null,E.Core=function(e,t){function n(){var e=!1;return{validatorsInQueue:0,valid:!0,addValidatorToQueue:function(){this.validatorsInQueue++,e=!1},removeValidatorFormQueue:function(){this.validatorsInQueue=this.validatorsInQueue-1<0?0:this.validatorsInQueue-1,this.checkIfQueueIsEmpty()},onQueueEmpty:function(e){},checkIfQueueIsEmpty:function(){0==this.validatorsInQueue&&0==e&&(e=!0,this.onQueueEmpty(this.valid))}}}function o(e,t,o){function i(){var n;e.length&&(n=E.hooks.run(m,"beforeChange",e,t),P(n)?console.warn("Your beforeChange callback returns a function. It's not supported since Handsontable 0.12.1 (and the returned function will not be executed)."):!1===n&&e.splice(0,e.length)),o()}var r=new n;r.onQueueEmpty=i;for(var s=e.length-1;s>=0;s--)if(null===e[s])e.splice(s,1);else{var a=e[s][0],l=d.propToCol(e[s][1]),u=m.getCellMeta(a,l);if("numeric"===u.type&&"string"==typeof e[s][3]&&e[s][3].length>0&&(/^-?[\d\s]*(\.|\,)?\d*$/.test(e[s][3])||u.format)){var c=e[s][3].length;L(u.language)?R.culture("en-US"):e[s][3].indexOf(".")===c-3&&-1===e[s][3].indexOf(",")?R.culture("en-US"):R.culture(u.language);var h=R.cultureData(R.culture()).delimiters;new RegExp("^\\"+h.decimal+"[0-9]+$").test(e[s][3]+"")&&(e[s][3]="0"+e[s][3]),!R.validate(e[s][3])&&isNaN(parseFloat(e[s][3]))||(e[s][3]=R().unformat(e[s][3]))}m.getCellValidator(u)&&(r.addValidatorToQueue(),m.validateCell(e[s][3],u,function(t,n){return function(o){
diff --git a/en/maillist.html b/en/maillist.html
index 40d28db..8b7470b 100644
--- a/en/maillist.html
+++ b/en/maillist.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Mailing List - Apache ECharts (incubating)</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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Mailing List</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="maillist" class="page-content"><div class="container"><h2>About Mailing List</h2><p>Mailing list is where we discuss in public and keep everything tracked. You are welcomed to subscribe it if you wish:</p><ul><li>To be informed about bug reports or feature requests;</li><li>To discuss about developing plans or specific issues;</li><li>To offer helps to those who ask questions by email;</li><li>And etc.</li></ul><p>If you have a specific bug to report or feature request, we'd suggest you opening an issue with our <a href="https://ecomfe.github.io/echarts-issue-helper">issue helper tool</a>, which is a more efficient way to report the details.</p><p><a href="mailto:commits@echarts.incubator.apache.org">commits@echarts.incubator.apache.org</a> focuses on the commit logs, while <a href="mailto:dev@echarts.incubator.apache.org">dev@echarts.incubator.apache.org</a> holds other general discussions.</p><p>These two are public mailing list, and you can get access to them on Website <a href="https://lists.apache.org/list.html?commits@echarts.apache.org">https://lists.apache.org/list.html?commits@echarts.apache.org</a> and <a href="https://lists.apache.org/list.html?dev@echarts.apache.org">https://lists.apache.org/list.html?dev@echarts.apache.org</a> without subscribing.</p><h2>How To Subscribe</h2><p>Email <a href="mailto:commits-subscribe@echarts.incubator.apache.org">commits-subscribe@echarts.incubator.apache.org</a> or <a href="mailto:dev-subscribe@echarts.incubator.apache.org">dev-subscribe@echarts.incubator.apache.org</a> to subscribe commits@echarts.incubator.apache.org and dev@echarts.incubator.apache.org accordingly.</p><p>You should receive an email and please follow the instructions in that.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>Mailing List</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="maillist" class="page-content"><div class="container"><h2>About Mailing List</h2><p>Mailing list is where we discuss in public and keep everything tracked. You are welcomed to subscribe it if you wish:</p><ul><li>To be informed about bug reports or feature requests;</li><li>To discuss about developing plans or specific issues;</li><li>To offer helps to those who ask questions by email;</li><li>And etc.</li></ul><p>If you have a specific bug to report or feature request, we'd suggest you opening an issue with our <a href="https://ecomfe.github.io/echarts-issue-helper">issue helper tool</a>, which is a more efficient way to report the details.</p><p><a href="mailto:commits@echarts.incubator.apache.org">commits@echarts.incubator.apache.org</a> focuses on the commit logs, while <a href="mailto:dev@echarts.incubator.apache.org">dev@echarts.incubator.apache.org</a> holds other general discussions.</p><p>These two are public mailing list, and you can get access to them on Website <a href="https://lists.apache.org/list.html?commits@echarts.apache.org">https://lists.apache.org/list.html?commits@echarts.apache.org</a> and <a href="https://lists.apache.org/list.html?dev@echarts.apache.org">https://lists.apache.org/list.html?dev@echarts.apache.org</a> without subscribing.</p><h2>How To Subscribe</h2><p>Email <a href="mailto:commits-subscribe@echarts.incubator.apache.org">commits-subscribe@echarts.incubator.apache.org</a> or <a href="mailto:dev-subscribe@echarts.incubator.apache.org">dev-subscribe@echarts.incubator.apache.org</a> to subscribe commits@echarts.incubator.apache.org and dev@echarts.incubator.apache.org accordingly.</p><p>You should receive an email and please follow the instructions in that.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/option-gl.html b/en/option-gl.html
index 2ae1ad6..a732027 100644
--- a/en/option-gl.html
+++ b/en/option-gl.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-gl-parts',
     docType: 'option-gl',
@@ -19,7 +19,7 @@
 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">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/option.html b/en/option.html
index 3e4b7ec..825af4e 100644
--- a/en/option.html
+++ b/en/option.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-parts',
     docType: 'option',
@@ -19,7 +19,7 @@
 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">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/option3.html b/en/option3.html
index fef3ab5..d7d83b7 100644
--- a/en/option3.html
+++ b/en/option3.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><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="ECharts Configurations"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-info"><div class="container"><h1>ECharts Configurations v3</h1><p>Sorry. This page is currently not available. Please checkout <a href="./option.html">Configurations of v4</a>.</p></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
+<!--[if (gt IE 8)|!(IE)]><body class="ECharts Configurations"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-info"><div class="container"><h1>ECharts Configurations v3</h1><p>Sorry. This page is currently not available. Please checkout <a href="./option.html">Configurations of v4</a>.</p></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
 </script><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/en/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/en/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
diff --git a/en/resources.html b/en/resources.html
index 29561a8..ee8a272 100644
--- a/en/resources.html
+++ b/en/resources.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>More Resources - Apache ECharts (incubating)</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="More Resources"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>More Resources</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="page-nav"></div><div class="container"><p>Besides the official resources we provided in this Website, the community has also created abundant resources like the support of multiple programming languages, or an online platform to host ECharts works called <a target="_blank" href="https://gallery.echartsjs.com">Gallery</a>.</p><p><a target="_blank" href="https://github.com/ecomfe/awesome-echarts">github.com/ecomfe/awesome-echarts</a> project provides a full list of these resources. Please check it out and add more as you know.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="More Resources"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>More Resources</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="page-nav"></div><div class="container"><p>Besides the official resources we provided in this Website, the community has also created abundant resources like the support of multiple programming languages, or an online platform to host ECharts works called <a target="_blank" href="https://gallery.echartsjs.com">Gallery</a>.</p><p><a target="_blank" href="https://github.com/ecomfe/awesome-echarts">github.com/ecomfe/awesome-echarts</a> project provides a full list of these resources. Please check it out and add more as you know.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/security.html b/en/security.html
index c97634f..46c5c0e 100644
--- a/en/security.html
+++ b/en/security.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Security - Apache ECharts (incubating)</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="Security"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>Security</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="maillist" class="page-content"><div class="page-nav"></div><div class="container"><p>The Apache ECharts (incubating)<sup>TM</sup> takes a rigorous standpoint in annihilating the security issues in its software projects. Apache ECharts (incubating) is highly sensitive and forthcoming to issues pertaining to its features and functionality.</p><p>If you have apprehensions regarding ECharts's security or you discover vulnerability or potential threat, don't hesitate to get in touch with the <a href="http://www.apache.org/security/" target="_blank">Apache Security Team</a> by dropping a mail at <a href="mailto:security@apache.org">security@apache.org</a>. In the mail, specify the project name ECharts with the description of the issue or potential threat. You are also urged to recommend the way to reproduce and replicate the issue. The security team and the ECharts community will get back to you after assessing and analysing the findings.</p><p>PLEASE PAY ATTENTION to report the security issue on the security email before disclosing it on public domain.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-others').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="Security"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>Security</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="maillist" class="page-content"><div class="page-nav"></div><div class="container"><p>The Apache ECharts (incubating)<sup>TM</sup> takes a rigorous standpoint in annihilating the security issues in its software projects. Apache ECharts (incubating) is highly sensitive and forthcoming to issues pertaining to its features and functionality.</p><p>If you have apprehensions regarding ECharts's security or you discover vulnerability or potential threat, don't hesitate to get in touch with the <a href="http://www.apache.org/security/" target="_blank">Apache Security Team</a> by dropping a mail at <a href="mailto:security@apache.org">security@apache.org</a>. In the mail, specify the project name ECharts with the description of the issue or potential threat. You are also urged to recommend the way to reproduce and replicate the issue. The security team and the ECharts community will get back to you after assessing and analysing the findings.</p><p>PLEASE PAY ATTENTION to report the security issue on the security email before disclosing it on public domain.</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts.apache.org/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts.apache.org/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-others').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/spreadsheet.html b/en/spreadsheet.html
index a9fc945..ab861ad 100644
--- a/en/spreadsheet.html
+++ b/en/spreadsheet.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -6,13 +6,13 @@
         + '@font-face {font-family:"noto-light";src:local("Microsoft Yahei");}';
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
-</script><title>Spreadsheet Tool - Apache ECharts (incubating)</title><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/vendors/handsontable/0.26.1/dist/handsontable.full.min.css?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/spreadsheet.css?_v_=1598903776431"><script src="vendors/esl.js"></script><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="ecdoc-sprsht"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
+</script><title>Spreadsheet Tool - Apache ECharts (incubating)</title><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/vendors/handsontable/0.26.1/dist/handsontable.full.min.css?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/spreadsheet.css?_v_=1603774175523"><script src="vendors/esl.js"></script><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="ecdoc-sprsht"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
 
 var vendorPath = '../vendors';
 
 define('globalArgs', extend({
-    version: '1598903776431',
+    version: '1603774175523',
     basePath: './'
 }, window.globalArgsExtra || {}));
 
@@ -31,7 +31,7 @@
         numeral: vendorPath + '/numeral/1.4.7/numeral.min',
         immutable: vendorPath + '/immutable/3.7.4/dist/immutable'
     },
-    urlArgs: '_v_=1598903776431'
+    urlArgs: '_v_=1603774175523'
 });
 
 require(['spreadsheet/spreadsheet'], function (spreadsheet) {
diff --git a/en/theme-builder.html b/en/theme-builder.html
index 2e3ff3c..fc5a074 100644
--- a/en/theme-builder.html
+++ b/en/theme-builder.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -526,7 +526,7 @@
 <script src="//cdn.jsdelivr.net/npm/file-saver@2.0.2/dist/FileSaver.min.js"></script>
 
 <script src="./theme-builder/app.min.js"></script>
-</div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/en/tutorial.html b/en/tutorial.html
index 93e3a35..dc0f236 100644
--- a/en/tutorial.html
+++ b/en/tutorial.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/tutorial-parts',
     docType: 'tutorial',
@@ -19,7 +19,7 @@
 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">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/examples/en/editor.html b/examples/en/editor.html
index d6d1b2c..8298419 100644
--- a/examples/en/editor.html
+++ b/examples/en/editor.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts.apache.org/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/examples/stylesheets/main.css?_v_=1598903772045"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'en';
+<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts.apache.org/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/examples/stylesheets/main.css?_v_=1603774171032"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'en';
 </script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now for the latest information.</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><script type="text/javascript">var selector = window.EC_DEMO_LANG === 'en' ? 'nav-start' : 'nav-examples';
 var menu = document.getElementById(selector);
 if (menu) {
@@ -8,7 +8,7 @@
     var nav = document.getElementsByClassName('navbar')[0];
     nav.parentNode.removeChild(nav);
     document.getElementById('main-container').style.top = 0;
-}</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/common.js?_v_=1598903772045"></script><script type="text/javascript">function changeLang(lang) {
+}</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/common.js?_v_=1603774171032"></script><script type="text/javascript">function changeLang(lang) {
     if (lang === 'en') {
         if (location.hostname !== 'echarts.apache.org') {
             var re = new RegExp('/zh/', 'g');
@@ -42,7 +42,7 @@
 window.CDN_PAY_ROOT_PATH = 'https://echarts.apache.org/examples';
 window.CDN_PAY_VERSION = '20200710_1';
 window.CDN_THIRD_PARTY_ECHARTS_GL = 'https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js'
-</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.2.5/src-noconflict/ace.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.2.5/src-noconflict/ext-language_tools.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/editor.js?_v_=1598903772045"></script><script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1598903772045"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-min-noconflict/ace.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-min-noconflict/ext-language_tools.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/editor.js?_v_=1603774171032"></script><script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1603774171032"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/examples/en/index.html b/examples/en/index.html
index 9010b9e..f9370e8 100644
--- a/examples/en/index.html
+++ b/examples/en/index.html
@@ -1,10 +1,10 @@
-<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts.apache.org/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/examples/stylesheets/main.css?_v_=1598903772045"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'en';
+<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts.apache.org/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/examples/stylesheets/main.css?_v_=1603774171032"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'en';
 </script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now for the latest information.</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><script type="text/javascript">var selector = window.EC_DEMO_LANG === 'en' ? 'nav-start' : 'nav-examples';
 var menu = document.getElementById(selector);
 if (menu) {
     menu.className = 'active';
 }
-</script><div id="left-chart-nav"><ul></ul></div><div id="explore-container"><div id="toolbar"><div id="theme"><span>Theme:</span><a href="./index.html" title="default" data-theme="default" class="default"><span></span></a><a href="./index.html?theme=light" title="light" data-theme="light" class="light"><span></span></a><a href="./index.html?theme=dark" title="dark" data-theme="dark" class="dark"><span></span></a></div></div><div class="chart-list-panel"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/common.js?_v_=1598903772045"></script><script type="text/javascript">function changeLang(lang) {
+</script><div id="left-chart-nav"><ul></ul></div><div id="explore-container"><div id="toolbar"><div id="theme"><span>Theme:</span><a href="./index.html" title="default" data-theme="default" class="default"><span></span></a><a href="./index.html?theme=light" title="light" data-theme="light" class="light"><span></span></a><a href="./index.html?theme=dark" title="dark" data-theme="dark" class="dark"><span></span></a></div></div><div class="chart-list-panel"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/common.js?_v_=1603774171032"></script><script type="text/javascript">function changeLang(lang) {
     if (lang === 'en') {
         if (location.hostname !== 'echarts.apache.org') {
             var re = new RegExp('/zh/', 'g');
@@ -38,7 +38,7 @@
 window.CDN_PAY_ROOT_PATH = 'https://echarts.apache.org/examples';
 window.CDN_PAY_VERSION = '20200710_1';
 window.CDN_THIRD_PARTY_ECHARTS_GL = 'https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js'
-</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/waypoints@4.0.0/lib/jquery.waypoints.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-lazyload@1.9.7/jquery.lazyload.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/chart-list-data.js?_v_=1598903772045"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/chart-list-data-gl.js?_v_=1598903772045"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/chart-list.js?_v_=1598903772045"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/waypoints@4.0.0/lib/jquery.waypoints.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-lazyload@1.9.7/jquery.lazyload.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/chart-list-data.js?_v_=1603774171032"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/chart-list-data-gl.js?_v_=1603774171032"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/chart-list.js?_v_=1603774171032"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/examples/en/view.html b/examples/en/view.html
index 9f0b345..3dcb9ac 100644
--- a/examples/en/view.html
+++ b/examples/en/view.html
@@ -1,5 +1,5 @@
-<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts.apache.org/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/examples/stylesheets/main.css?_v_=1598903772045"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'en';
-</script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now for the latest information.</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="view-main"><div class="control-panel"></div><div id="view-chart" class="chart"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/common.js?_v_=1598903772045"></script><script type="text/javascript">function changeLang(lang) {
+<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts.apache.org/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/examples/stylesheets/main.css?_v_=1603774171032"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'en';
+</script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now for the latest information.</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>Visit Official Website</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="view-main"><div class="control-panel"></div><div id="view-chart" class="chart"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/common.js?_v_=1603774171032"></script><script type="text/javascript">function changeLang(lang) {
     if (lang === 'en') {
         if (location.hostname !== 'echarts.apache.org') {
             var re = new RegExp('/zh/', 'g');
@@ -33,7 +33,7 @@
 window.CDN_PAY_ROOT_PATH = 'https://echarts.apache.org/examples';
 window.CDN_PAY_VERSION = '20200710_1';
 window.CDN_THIRD_PARTY_ECHARTS_GL = 'https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js'
-</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1598903772045"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1598903772045"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1598903772045"></script><script id="echarts-js" type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1598903772045"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/view.js?_v_=1598903772045"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1603774171032"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1603774171032"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1603774171032"></script><script id="echarts-js" type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1603774171032"></script><script type="text/javascript" src="https://echarts.apache.org/examples/javascripts/view.js?_v_=1603774171032"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/examples/zh/editor.html b/examples/zh/editor.html
index 215e8e0..a8e301f 100644
--- a/examples/zh/editor.html
+++ b/examples/zh/editor.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/examples/stylesheets/main.css?_v_=1598903772045"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'zh';
+<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/examples/stylesheets/main.css?_v_=1603774171032"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'zh';
 </script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网以获取最新版的网站信息。</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>访问官网</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=20200710_1" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=20200710_1" width="18"></a></li></ul></div></div></nav><script type="text/javascript">var selector = window.EC_DEMO_LANG === 'en' ? 'nav-start' : 'nav-examples';
 var menu = document.getElementById(selector);
 if (menu) {
@@ -8,7 +8,7 @@
     var nav = document.getElementsByClassName('navbar')[0];
     nav.parentNode.removeChild(nav);
     document.getElementById('main-container').style.top = 0;
-}</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/common.js?_v_=1598903772045"></script><script type="text/javascript">function changeLang(lang) {
+}</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/common.js?_v_=1603774171032"></script><script type="text/javascript">function changeLang(lang) {
     if (lang === 'en') {
         if (location.hostname !== 'echarts.apache.org') {
             var re = new RegExp('/zh/', 'g');
@@ -42,7 +42,7 @@
 window.CDN_PAY_ROOT_PATH = 'https://echarts-www.cdn.bcebos.com/examples';
 window.CDN_PAY_VERSION = '20200710_1';
 window.CDN_THIRD_PARTY_ECHARTS_GL = 'https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js'
-</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-min-noconflict/ace.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-min-noconflict/ext-language_tools.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/editor.js?_v_=1598903772045"></script><script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1598903772045"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-min-noconflict/ace.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/ace-builds@1.4.12/src-min-noconflict/ext-language_tools.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/editor.js?_v_=1603774171032"></script><script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1603774171032"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
@@ -54,4 +54,4 @@
 </script><!-- Google Analytics--><script type="text/javascript" async src="https://www.googletagmanager.com/gtag/js?id=UA-141228404-1"></script><script type="text/javascript">window.dataLayer = window.dataLayer || [];
 function gtag(){dataLayer.push(arguments);}
 gtag('js', new Date());
-gtag('config', 'UA-141228404-1');</script></body></html>
+gtag('config', 'UA-141228404-1');</script></body></html>
\ No newline at end of file
diff --git a/examples/zh/index.html b/examples/zh/index.html
index da2471d..865d18d 100644
--- a/examples/zh/index.html
+++ b/examples/zh/index.html
@@ -1,10 +1,10 @@
-<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/examples/stylesheets/main.css?_v_=1598903772045"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'zh';
+<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/examples/stylesheets/main.css?_v_=1603774171032"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'zh';
 </script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网以获取最新版的网站信息。</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>访问官网</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><nav class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=20200710_1" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=20200710_1" width="18"></a></li></ul></div></div></nav><script type="text/javascript">var selector = window.EC_DEMO_LANG === 'en' ? 'nav-start' : 'nav-examples';
 var menu = document.getElementById(selector);
 if (menu) {
     menu.className = 'active';
 }
-</script><div id="left-chart-nav"><ul></ul></div><div id="explore-container"><div id="toolbar"><div id="theme"><span>Theme:</span><a href="./index.html" title="default" data-theme="default" class="default"><span></span></a><a href="./index.html?theme=light" title="light" data-theme="light" class="light"><span></span></a><a href="./index.html?theme=dark" title="dark" data-theme="dark" class="dark"><span></span></a></div></div><div class="chart-list-panel"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/common.js?_v_=1598903772045"></script><script type="text/javascript">function changeLang(lang) {
+</script><div id="left-chart-nav"><ul></ul></div><div id="explore-container"><div id="toolbar"><div id="theme"><span>Theme:</span><a href="./index.html" title="default" data-theme="default" class="default"><span></span></a><a href="./index.html?theme=light" title="light" data-theme="light" class="light"><span></span></a><a href="./index.html?theme=dark" title="dark" data-theme="dark" class="dark"><span></span></a></div></div><div class="chart-list-panel"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/common.js?_v_=1603774171032"></script><script type="text/javascript">function changeLang(lang) {
     if (lang === 'en') {
         if (location.hostname !== 'echarts.apache.org') {
             var re = new RegExp('/zh/', 'g');
@@ -38,7 +38,7 @@
 window.CDN_PAY_ROOT_PATH = 'https://echarts-www.cdn.bcebos.com/examples';
 window.CDN_PAY_VERSION = '20200710_1';
 window.CDN_THIRD_PARTY_ECHARTS_GL = 'https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js'
-</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/waypoints@4.0.0/lib/jquery.waypoints.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-lazyload@1.9.7/jquery.lazyload.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/chart-list-data.js?_v_=1598903772045"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/chart-list-data-gl.js?_v_=1598903772045"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/chart-list.js?_v_=1598903772045"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/waypoints@4.0.0/lib/jquery.waypoints.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-lazyload@1.9.7/jquery.lazyload.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/chart-list-data.js?_v_=1603774171032"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/chart-list-data-gl.js?_v_=1603774171032"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/chart-list.js?_v_=1603774171032"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/examples/zh/view.html b/examples/zh/view.html
index 784d879..4b2480c 100644
--- a/examples/zh/view.html
+++ b/examples/zh/view.html
@@ -1,5 +1,5 @@
-<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/examples/stylesheets/main.css?_v_=1598903772045"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'zh';
-</script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网以获取最新版的网站信息。</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>访问官网</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="view-main"><div class="control-panel"></div><div id="view-chart" class="chart"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/common.js?_v_=1598903772045"></script><script type="text/javascript">function changeLang(lang) {
+<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/examples/images/favicon.png?_v_=20200710_1"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/examples/stylesheets/main.css?_v_=1603774171032"><title>Examples - Apache ECharts (incubating)</title><script type="text/javascript">window.EC_DEMO_LANG = 'zh';
+</script></head><body><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网以获取最新版的网站信息。</p></div><a href="https://echarts.apache.org" target="_blank" onclick="logApache()" class="btn"><div>访问官网</div></a><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn">x</a></div><div id="view-main"><div class="control-panel"></div><div id="view-chart" class="chart"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/common.js?_v_=1603774171032"></script><script type="text/javascript">function changeLang(lang) {
     if (lang === 'en') {
         if (location.hostname !== 'echarts.apache.org') {
             var re = new RegExp('/zh/', 'g');
@@ -33,7 +33,7 @@
 window.CDN_PAY_ROOT_PATH = 'https://echarts-www.cdn.bcebos.com/examples';
 window.CDN_PAY_VERSION = '20200710_1';
 window.CDN_THIRD_PARTY_ECHARTS_GL = 'https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js'
-</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1598903772045"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1598903772045"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1598903772045"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1598903772045"></script><script id="echarts-js" type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1598903772045"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/view.js?_v_=1598903772045"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dat.gui@0.6.5/build/dat.gui.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1603774171032"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts-stat/dist/ecStat.min.js"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1603774171032"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/world.js?_v_=1603774171032"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/dataTool.js?_v_=1603774171032"></script><script id="echarts-js" type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&amp;ak=KOmVjPVUAey1G2E8zNhPiuQ6QiEmAwZu&amp;__ec_v__=20190126"></script><script id="echarts-js" type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1603774171032"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/examples/javascripts/view.js?_v_=1603774171032"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/layouts/basic.html b/layouts/basic.html
index be52bcc..050364f 100644
--- a/layouts/basic.html
+++ b/layouts/basic.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/layouts/doc-old.html b/layouts/doc-old.html
index ff42876..0219728 100644
--- a/layouts/doc-old.html
+++ b/layouts/doc-old.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -6,13 +6,13 @@
         + '@font-face {font-family:"noto-light";src:local("Microsoft Yahei");}';
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
-</script><title>ECharts Documentation</title><link rel="stylesheet" type="text/css" href="css/ecOption.css?_v_=1598903776431"><link rel="stylesheet" type="text/css" href="vendors/prettify/prettify.css"><link rel="stylesheet" type="text/css" href="vendors/perfect-scrollbar/0.6.8/css/perfect-scrollbar.min.css"><link rel="stylesheet" type="text/css" href="vendors/jquery-autocomplete/jquery.auto-complete.css"><link rel="stylesheet" type="text/css" href="vendors/twentytwenty/twentytwenty.css"><script src="vendors/prettify/prettify.js"></script><script src="vendors/prettify/lang-css.js"></script><script src="vendors/esl.js"></script><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="ecdoc-apidoc"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="vendors/twentytwenty/jquery.event.move.js"></script><script src="vendors/twentytwenty/jquery.twentytwenty.js"></script><script src="vendors/jquery-autocomplete/jquery.auto-complete.min.js"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
+</script><title>ECharts Documentation</title><link rel="stylesheet" type="text/css" href="css/ecOption.css?_v_=1603774175523"><link rel="stylesheet" type="text/css" href="vendors/prettify/prettify.css"><link rel="stylesheet" type="text/css" href="vendors/perfect-scrollbar/0.6.8/css/perfect-scrollbar.min.css"><link rel="stylesheet" type="text/css" href="vendors/jquery-autocomplete/jquery.auto-complete.css"><link rel="stylesheet" type="text/css" href="vendors/twentytwenty/twentytwenty.css"><script src="vendors/prettify/prettify.js"></script><script src="vendors/prettify/lang-css.js"></script><script src="vendors/esl.js"></script><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="ecdoc-apidoc"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="vendors/twentytwenty/jquery.event.move.js"></script><script src="vendors/twentytwenty/jquery.twentytwenty.js"></script><script src="vendors/jquery-autocomplete/jquery.auto-complete.min.js"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
 
 var vendorPath = '../vendors';
 
 define('globalArgs', extend({
-    version: '1598903776431',
+    version: '1603774175523',
     basePath: './',
     // Schema url is added by each doc page
     schemaUrl: '',
@@ -39,7 +39,7 @@
         hasher: vendorPath + '/hasher/1.2.0/hasher.min',
         perfectScrollbar: vendorPath + '/perfect-scrollbar/0.6.8/js/perfect-scrollbar'
     },
-    urlArgs: '_v_=1598903776431'
+    urlArgs: '_v_=1603774175523'
 });
 
 require(['docTool/main'], function (main) {
diff --git a/layouts/doc.html b/layouts/doc.html
index 31ef191..6d90408 100644
--- a/layouts/doc.html
+++ b/layouts/doc.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,10 +9,10 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/zh/css/doc-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/zh/css/doc-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/layouts/next-doc.html b/layouts/next-doc.html
index ab608e0..4a8c585 100644
--- a/layouts/next-doc.html
+++ b/layouts/next-doc.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,10 +9,10 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/layouts/next-example-simple.html b/layouts/next-example-simple.html
index 460b519..e3a6b76 100644
--- a/layouts/next-example-simple.html
+++ b/layouts/next-example-simple.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,9 +9,9 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"><div id="ec-example-main"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
-</script><script type="text/javascript">window.globalArgsExtra.version = '1598903776431';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"><div id="ec-example-main"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+</script><script type="text/javascript">window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);
 
diff --git a/layouts/next-example.html b/layouts/next-example.html
index 35f3c6b..856f4db 100644
--- a/layouts/next-example.html
+++ b/layouts/next-example.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,10 +9,10 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
diff --git a/next/en/api.html b/next/en/api.html
index 9af9da3..6a77848 100644
--- a/next/en/api.html
+++ b/next/en/api.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/api-parts',
     docType: 'api',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/en/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/next/en/option-gl.html b/next/en/option-gl.html
index 649fbf0..cc8bbf3 100644
--- a/next/en/option-gl.html
+++ b/next/en/option-gl.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-gl-parts',
     docType: 'option-gl',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/en/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/next/en/option.html b/next/en/option.html
index 1176e1c..0a09228 100644
--- a/next/en/option.html
+++ b/next/en/option.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-parts',
     docType: 'option',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/en/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/next/en/tutorial.html b/next/en/tutorial.html
index d0eb42b..b7fe6ae 100644
--- a/next/en/tutorial.html
+++ b/next/en/tutorial.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/en/css/doc-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/en/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/tutorial-parts',
     docType: 'tutorial',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/en/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/next/examples/en/editor.html b/next/examples/en/editor.html
index 70ac4e0..423a020 100644
--- a/next/examples/en/editor.html
+++ b/next/examples/en/editor.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,13 +9,13 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     page: 'editor',
     locale: 'en'
 };</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
diff --git a/next/examples/en/index.html b/next/examples/en/index.html
index 0a56ff0..d47cc14 100644
--- a/next/examples/en/index.html
+++ b/next/examples/en/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,13 +9,13 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><nav id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/en/index.html" class="navbar-brand"><img src="https://echarts.apache.org/en/images/logo.png" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/en/index.html">Home</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Docs<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/feature.html">Features</a></li><li><a href="https://echarts.apache.org/en/tutorial.html">Tutorials</a></li><li><a href="https://echarts.apache.org/en/api.html">API</a></li><li><a href="https://echarts.apache.org/en/option.html">Chart Configuration</a></li><li><a href="https://echarts.apache.org/en/changelog.html">Changelog</a></li><li><a href="https://echarts.apache.org/en/faq.html">FAQ</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Download<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/download.html">Download</a></li><li><a href="https://echarts.apache.org/en/download-theme.html">Download Themes</a></li><li><a href="https://echarts.apache.org/en/download-extension.html">Download Extensions</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/en/index.html">Examples</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Resources<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/spreadsheet.html">Spread Sheet Tool</a></li><li><a href="https://echarts.apache.org/en/theme-builder.html">Theme Builder</a></li><li><a href="https://echarts.apache.org/en/cheat-sheet.html">Cheat Sheet</a></li><li><a href="https://echarts.apache.org/en/resources.html">More Resources</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Community<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/en/committers.html">Committers</a></li><li><a href="https://echarts.apache.org/en/maillist.html">Mailing List</a></li><li><a href="https://echarts.apache.org/en/contributing.html">How to Contribute</a></li><li><a href="https://echarts.apache.org/en/dependencies.html">Dependencies</a></li><li><a href="https://echarts.apache.org/en/coding-standard.html">Code Standard</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">Source Code (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues (GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Others<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/en/security.html">Security</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">Licenses<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">Sponsorship<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">Thanks<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('zh')">中文</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/en/images/apache-incubator-white.png" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     page: 'explore',
     locale: 'en'
 };</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
diff --git a/next/examples/en/view.html b/next/examples/en/view.html
index 739543a..ec12cbf 100644
--- a/next/examples/en/view.html
+++ b/next/examples/en/view.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'en';
+<!DOCTYPE html><html lang="en-US"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/en/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/en/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'en';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,12 +9,12 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><div id="ec-example-main"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator.</p><p>We are working on redirecting this Website to <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a>. You may visit our new official Website now.</p></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="main"><div id="ec-example-main"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/en/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     page: 'view',
     locale: 'en'
-};</script><script type="text/javascript">window.globalArgsExtra.version = '1598903776431';
+};</script><script type="text/javascript">window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);
 
diff --git a/next/examples/zh/editor.html b/next/examples/zh/editor.html
index 7108296..3b0851d 100644
--- a/next/examples/zh/editor.html
+++ b/next/examples/zh/editor.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,13 +9,13 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     page: 'editor',
     locale: 'zh'
 };</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
diff --git a/next/examples/zh/index.html b/next/examples/zh/index.html
index 9480e60..045b0f0 100644
--- a/next/examples/zh/index.html
+++ b/next/examples/zh/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,13 +9,13 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-example-nav" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-example-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     page: 'explore',
     locale: 'zh'
 };</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
diff --git a/next/examples/zh/view.html b/next/examples/zh/view.html
index 63e8079..5596d90 100644
--- a/next/examples/zh/view.html
+++ b/next/examples/zh/view.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,12 +9,12 @@
 </script><title>Examples - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"><div id="ec-example-main"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/examples/css/example-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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"><div id="ec-example-main"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://echarts.apache.org/next/examples/js/example-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     page: 'view',
     locale: 'zh'
-};</script><script type="text/javascript">window.globalArgsExtra.version = '1598903776431';
+};</script><script type="text/javascript">window.globalArgsExtra.version = '1603774175523';
 window.globalArgsExtra.cdnRoot = EC_WWW_CDN_PAY_ROOT + '/next/examples';
 echartsExample.init('#ec-example-main', window.globalArgsExtra);
 
diff --git a/next/zh/api.html b/next/zh/api.html
index b7ec7e4..d0a68e1 100644
--- a/next/zh/api.html
+++ b/next/zh/api.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/api-parts',
     docType: 'api',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/next/zh/option-gl.html b/next/zh/option-gl.html
index 7c950d2..4647f14 100644
--- a/next/zh/option-gl.html
+++ b/next/zh/option-gl.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-gl-parts',
     docType: 'option-gl',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/next/zh/option.html b/next/zh/option.html
index 526cfb7..34134e8 100644
--- a/next/zh/option.html
+++ b/next/zh/option.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-parts',
     docType: 'option',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/next/zh/tutorial.html b/next/zh/tutorial.html
index ec0b5a0..1843d00 100644
--- a/next/zh/tutorial.html
+++ b/next/zh/tutorial.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts.apache.org/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts.apache.org/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1598903776431"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts.apache.org/next/zh/css/doc-bundle.css?_v_=1603774175523"><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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts.apache.org/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts.apache.org/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts.apache.org/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts.apache.org/next/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts.apache.org';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/tutorial-parts',
     docType: 'tutorial',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/next/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/zh/404.html b/zh/404.html
index e0cc323..f6723f5 100644
--- a/zh/404.html
+++ b/zh/404.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="not-found"><img src="https://echarts-www.cdn.bcebos.com/zh/images/404.png?_v_=20200710_1" alt="404"><div class="text">非常抱歉,您所访问的网页找不到了!您可以选择<a href="./index.html" class="link">返回首页</a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="not-found"><img src="https://echarts-www.cdn.bcebos.com/zh/images/404.png?_v_=20200710_1" alt="404"><div class="text">非常抱歉,您所访问的网页找不到了!您可以选择<a href="./index.html" class="link">返回首页</a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/api.html b/zh/api.html
index d95c68a..92f095d 100644
--- a/zh/api.html
+++ b/zh/api.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1598903776431"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1603774175523"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/api-parts',
     docType: 'api',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/zh/builder.html b/zh/builder.html
index 84a99f8..15ee46e 100644
--- a/zh/builder.html
+++ b/zh/builder.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>在线定制</h1><p>可自由选择所需图表、坐标系、组件进行打包下载,并且可对渲染引擎、兼容及压缩问题进行设置</p><div class="download-version">(version: 4.9.0)</div></div></div><div class="page-content"><div id="configuration" class="container"><a href="builder3.html" style="float: right">前往定制 3.x 版本</a><section id="charts"><h3>图表<span>chart</span></h3><p class="desc">选择要打包的图表<span class="warn">(注:开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示)</span></p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5>柱状图 <div>Bar</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5>折线图 <div>Line</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5>饼图 <div>Pie</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5>散点图 <div>Scatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5>涟漪散点图 <div>EffectScatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5>K线图 <div>Candlestick</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5>雷达图 <div>Radar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5>热力图 <div>Heatmap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5>树图 <div>Tree</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5>矩形树图 <div>Treemap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5>旭日图 <div>Sunburst</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5>地图 <div>Map</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5>线图 <div>Lines</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5>关系图 <div>Graph</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5>箱线图 <div>Boxplot</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5>平行坐标 <div>Parallel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5>仪表盘 <div>Gauge</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5>漏斗图 <div>Funnel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5>桑基图 <div>Sankey</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5>主题河流图 <div>ThemeRiver</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5>象形柱图 <div>PictorialBar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5>自定义系列 <div>Custom</div></h5></li></ul></section><section id="coords"><h3>坐标系<span>coordinate systems</span></h3><p class="desc">选择要打包的坐标系,有些图表像散点图,折线图可以被应用到多个坐标系上</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5>直角坐标系 <div>Grid</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5>极坐标系 <div>Polar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5>地理坐标系 <div>Geo</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5>单轴 <div>SingleAxis</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5>日历 <div>Calendar</div></h5></li></ul></section><section id="components"><h3>组件<span>component</span></h3><p class="desc">选择要打包的组件</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5>标题 <div>Title</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5>图例 <div>Legend</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5>提示框 <div>Tooltip</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5>标注 <div>MarkPoint</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5>标线 <div>MarkLine</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5>标域 <div>MarkArea</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5>时间轴 <div>Timeline</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5>数据区域缩放 <div>DataZoom</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5>刷选 <div>Brush</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5>视觉映射 <div>VisualMap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5>工具栏 <div>Toolbox</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5>自定义图形 <div>Graphic</div></h5></li></ul></section><section id="other"><h3>其它选项<span>others</span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG 渲染</label><p class="desc">是否包括 SVG 渲染器,从而能支持使用 SVG 来绘制图表</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">兼容 IE8</label><p class="desc">是否包括对 IE8 的兼容代码</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">工具集</label><p class="desc">是否在 echarts 对象上挂载常用工具集。一般都会挂载,除非对生成的文件的体积有苛求,并且不需要用这些工具集。</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">代码压缩</label><p class="desc">是否使用 UglifyJS 压缩后的代码,开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示。</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">下载</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script>function updateCheckbox() {
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>在线定制</h1><p>可自由选择所需图表、坐标系、组件进行打包下载,并且可对渲染引擎、兼容及压缩问题进行设置</p><div class="download-version">(version: 4.9.0)</div></div></div><div class="page-content"><div id="configuration" class="container"><a href="builder3.html" style="float: right">前往定制 3.x 版本</a><section id="charts"><h3>图表<span>chart</span></h3><p class="desc">选择要打包的图表<span class="warn">(注:开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示)</span></p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5>柱状图 <div>Bar</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5>折线图 <div>Line</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5>饼图 <div>Pie</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5>散点图 <div>Scatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5>涟漪散点图 <div>EffectScatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5>K线图 <div>Candlestick</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5>雷达图 <div>Radar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5>热力图 <div>Heatmap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5>树图 <div>Tree</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5>矩形树图 <div>Treemap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5>旭日图 <div>Sunburst</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5>地图 <div>Map</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5>线图 <div>Lines</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5>关系图 <div>Graph</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5>箱线图 <div>Boxplot</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5>平行坐标 <div>Parallel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5>仪表盘 <div>Gauge</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5>漏斗图 <div>Funnel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5>桑基图 <div>Sankey</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5>主题河流图 <div>ThemeRiver</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5>象形柱图 <div>PictorialBar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5>自定义系列 <div>Custom</div></h5></li></ul></section><section id="coords"><h3>坐标系<span>coordinate systems</span></h3><p class="desc">选择要打包的坐标系,有些图表像散点图,折线图可以被应用到多个坐标系上</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5>直角坐标系 <div>Grid</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5>极坐标系 <div>Polar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5>地理坐标系 <div>Geo</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5>单轴 <div>SingleAxis</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5>日历 <div>Calendar</div></h5></li></ul></section><section id="components"><h3>组件<span>component</span></h3><p class="desc">选择要打包的组件</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5>标题 <div>Title</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5>图例 <div>Legend</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5>提示框 <div>Tooltip</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5>标注 <div>MarkPoint</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5>标线 <div>MarkLine</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5>标域 <div>MarkArea</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5>时间轴 <div>Timeline</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5>数据区域缩放 <div>DataZoom</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5>刷选 <div>Brush</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5>视觉映射 <div>VisualMap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5>工具栏 <div>Toolbox</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5>自定义图形 <div>Graphic</div></h5></li></ul></section><section id="other"><h3>其它选项<span>others</span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG 渲染</label><p class="desc">是否包括 SVG 渲染器,从而能支持使用 SVG 来绘制图表</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">兼容 IE8</label><p class="desc">是否包括对 IE8 的兼容代码</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">工具集</label><p class="desc">是否在 echarts 对象上挂载常用工具集。一般都会挂载,除非对生成的文件的体积有苛求,并且不需要用这些工具集。</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">代码压缩</label><p class="desc">是否使用 UglifyJS 压缩后的代码,开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示。</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">下载</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script>function updateCheckbox() {
     $('#charts input, #components input, #coords input').each(function () {
         $(this).attr('checked', $(this).parent().hasClass('checked'));
     });
diff --git a/zh/builder/echarts.html b/zh/builder/echarts.html
index 1e7d04a..91ec95b 100644
--- a/zh/builder/echarts.html
+++ b/zh/builder/echarts.html
@@ -56,7 +56,7 @@
                 'esprima': 'lib/esprima',
                 'estraverse': 'lib/estraverse'
             },
-            urlArgs: 'v=1598903776431'
+            urlArgs: 'v=1603774175523'
         });
 
         require(['build']);
diff --git a/zh/builder3.html b/zh/builder3.html
index aaea345..4e05f8f 100644
--- a/zh/builder3.html
+++ b/zh/builder3.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>在线定制</h1><p>可自由选择所需图表、坐标系、组件进行打包下载,并且可对渲染引擎、兼容及压缩问题进行设置</p><div class="download-version">(version: 3.8.4)</div></div></div><div class="page-content"><div id="configuration" class="container"><a href="builder.html" style="float: right">前往定制 4.x 版本</a><section id="charts"><h3>图表<span>chart</span></h3><p class="desc">选择要打包的图表<span class="warn">(注:开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示)</span></p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5>柱状图 <div>Bar</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5>折线图 <div>Line</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5>饼图 <div>Pie</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5>散点图 <div>Scatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5>涟漪散点图 <div>EffectScatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5>K线图 <div>Candlestick</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5>雷达图 <div>Radar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5>热力图 <div>Heatmap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5>树图 <div>Tree</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5>矩形树图 <div>Treemap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5>旭日图 <div>Sunburst</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5>地图 <div>Map</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5>线图 <div>Lines</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5>关系图 <div>Graph</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5>箱线图 <div>Boxplot</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5>平行坐标 <div>Parallel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5>仪表盘 <div>Gauge</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5>漏斗图 <div>Funnel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5>桑基图 <div>Sankey</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5>主题河流图 <div>ThemeRiver</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5>象形柱图 <div>PictorialBar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5>自定义系列 <div>Custom</div></h5></li></ul></section><section id="coords"><h3>坐标系<span>coordinate systems</span></h3><p class="desc">选择要打包的坐标系,有些图表像散点图,折线图可以被应用到多个坐标系上</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5>直角坐标系 <div>Grid</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5>极坐标系 <div>Polar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5>地理坐标系 <div>Geo</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5>单轴 <div>SingleAxis</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5>日历 <div>Calendar</div></h5></li></ul></section><section id="components"><h3>组件<span>component</span></h3><p class="desc">选择要打包的组件</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5>标题 <div>Title</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5>图例 <div>Legend</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5>提示框 <div>Tooltip</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5>标注 <div>MarkPoint</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5>标线 <div>MarkLine</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5>标域 <div>MarkArea</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5>时间轴 <div>Timeline</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5>数据区域缩放 <div>DataZoom</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5>刷选 <div>Brush</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5>视觉映射 <div>VisualMap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5>工具栏 <div>Toolbox</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5>自定义图形 <div>Graphic</div></h5></li></ul></section><section id="other"><h3>其它选项<span>others</span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG 渲染</label><p class="desc">是否包括 SVG 渲染器,从而能支持使用 SVG 来绘制图表</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">兼容 IE8</label><p class="desc">是否包括对 IE8 的兼容代码</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">工具集</label><p class="desc">是否在 echarts 对象上挂载常用工具集。一般都会挂载,除非对生成的文件的体积有苛求,并且不需要用这些工具集。</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">代码压缩</label><p class="desc">是否使用 UglifyJS 压缩后的代码,开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示。</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">下载</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script>function updateCheckbox() {
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="builder"><div class="page-info"><div id="title" class="container"><h1>在线定制</h1><p>可自由选择所需图表、坐标系、组件进行打包下载,并且可对渲染引擎、兼容及压缩问题进行设置</p><div class="download-version">(version: 3.8.4)</div></div></div><div class="page-content"><div id="configuration" class="container"><a href="builder.html" style="float: right">前往定制 4.x 版本</a><section id="charts"><h3>图表<span>chart</span></h3><p class="desc">选择要打包的图表<span class="warn">(注:开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示)</span></p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="bar"><h5>柱状图 <div>Bar</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><input type="checkbox" name="line"><h5>折线图 <div>Line</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pie"><h5>饼图 <div>Pie</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="scatter"><h5>散点图 <div>Scatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><input type="checkbox" name="effectScatter"><h5>涟漪散点图 <div>EffectScatter</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><input type="checkbox" name="candlestick"><h5>K线图 <div>Candlestick</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="radar"><h5>雷达图 <div>Radar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="heatmap"><h5>热力图 <div>Heatmap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tree"><h5>树图 <div>Tree</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="treemap"><h5>矩形树图 <div>Treemap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sunburst"><h5>旭日图 <div>Sunburst</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><input type="checkbox" name="map"><h5>地图 <div>Map</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><input type="checkbox" name="lines"><h5>线图 <div>Lines</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graph"><h5>关系图 <div>Graph</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><input type="checkbox" name="boxplot"><h5>箱线图 <div>Boxplot</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="parallel"><h5>平行坐标 <div>Parallel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gauge"><h5>仪表盘 <div>Gauge</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><input type="checkbox" name="funnel"><h5>漏斗图 <div>Funnel</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><input type="checkbox" name="sankey"><h5>桑基图 <div>Sankey</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><input type="checkbox" name="themeRiver"><h5>主题河流图 <div>ThemeRiver</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="pictorialBar"><h5>象形柱图 <div>PictorialBar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="custom"><h5>自定义系列 <div>Custom</div></h5></li></ul></section><section id="coords"><h3>坐标系<span>coordinate systems</span></h3><p class="desc">选择要打包的坐标系,有些图表像散点图,折线图可以被应用到多个坐标系上</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><input type="checkbox" name="gridSimple"><h5>直角坐标系 <div>Grid</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="polar"><h5>极坐标系 <div>Polar</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><input type="checkbox" name="geo"><h5>地理坐标系 <div>Geo</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><input type="checkbox" name="singleAxis"><h5>单轴 <div>SingleAxis</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><input type="checkbox" name="calendar"><h5>日历 <div>Calendar</div></h5></li></ul></section><section id="components"><h3>组件<span>component</span></h3><p class="desc">选择要打包的组件</p><ul><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><input type="checkbox" name="title"><h5>标题 <div>Title</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><input type="checkbox" name="legendScroll"><h5>图例 <div>Legend</div></h5></li><li class="checked"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><input type="checkbox" name="tooltip"><h5>提示框 <div>Tooltip</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markPoint"><h5>标注 <div>MarkPoint</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markLine"><h5>标线 <div>MarkLine</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><input type="checkbox" name="markArea"><h5>标域 <div>MarkArea</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><input type="checkbox" name="timeline"><h5>时间轴 <div>Timeline</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><input type="checkbox" name="dataZoom"><h5>数据区域缩放 <div>DataZoom</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><input type="checkbox" name="brush"><h5>刷选 <div>Brush</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><input type="checkbox" name="visualMap"><h5>视觉映射 <div>VisualMap</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><input type="checkbox" name="toolbox"><h5>工具栏 <div>Toolbox</div></h5></li><li><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><input type="checkbox" name="graphic"><h5>自定义图形 <div>Graphic</div></h5></li></ul></section><section id="other"><h3>其它选项<span>others</span></h3><div class="other-option"><input type="checkbox" id="svg" name="svg"><label for="svg">SVG 渲染</label><p class="desc">是否包括 SVG 渲染器,从而能支持使用 SVG 来绘制图表</p></div><div class="other-option"><input type="checkbox" id="vml" name="vml"><label for="vml">兼容 IE8</label><p class="desc">是否包括对 IE8 的兼容代码</p></div><div class="other-option"><input type="checkbox" id="api" name="api" checked="checked"><label for="api">工具集</label><p class="desc">是否在 echarts 对象上挂载常用工具集。一般都会挂载,除非对生成的文件的体积有苛求,并且不需要用这些工具集。</p></div><div class="other-option"><input type="checkbox" id="compress" name="compress" checked="checked"><label for="compress">代码压缩</label><p class="desc">是否使用 UglifyJS 压缩后的代码,开发环境建议不压缩代码,代码压缩会去掉大部分常见的警告和错误提示。</p></div></section></div><div id="action"><a id="build" href="javascript:;" class="btn btn-main btn-thirdary">下载</a></div></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script>function updateCheckbox() {
     $('#charts input, #components input, #coords input').each(function () {
         $(this).attr('checked', $(this).parent().hasClass('checked'));
     });
diff --git a/zh/changelog.html b/zh/changelog.html
index a0a3349..2b9c9a0 100644
--- a/zh/changelog.html
+++ b/zh/changelog.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -1806,7 +1806,7 @@
 <ul>
 <li>The new echarts</li>
 </ul>
-<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/cheat-sheet.html b/zh/cheat-sheet.html
index f6444a5..b8d08b3 100644
--- a/zh/cheat-sheet.html
+++ b/zh/cheat-sheet.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,8 +7,8 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>术语速查手册 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>术语速查手册</h1><p>快速了解功能名称,帮助定位到配置项手册</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content container page-cheatsheet"><h2>常用组件说明</h2><div id="cheat-chart-container"><div class="row"><div class="col-lg-9"><div id="cheat-chart"></div></div><div class="col-lg-3"><div id="cheat-detail"></div></div></div></div><h2>系列类型文档速查</h2><ul><li class="cheat-chart-item"><a href="option.html#series-bar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><h5>柱状图<div>Bar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><h5>折线图<div>Line</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pie" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><h5>饼图<div>Pie</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-scatter" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><h5>散点图<div>Scatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-effectScatter" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><h5>涟漪散点图<div>EffectScatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-candlestick" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><h5>K线图<div>Candlestick</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-radar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><h5>雷达图<div>Radar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-heatmap" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><h5>热力图<div>Heatmap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-tree" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><h5>树图<div>Tree</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-treemap" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><h5>矩形树图<div>Treemap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sunburst" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><h5>旭日图<div>Sunburst</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-map" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><h5>地图<div>Map</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-lines" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><h5>线图<div>Lines</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-graph" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><h5>关系图<div>Graph</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-boxplot" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><h5>箱线图<div>Boxplot</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-parallel" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><h5>平行坐标<div>Parallel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-gauge" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><h5>仪表盘<div>Gauge</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-funnel" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><h5>漏斗图<div>Funnel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sankey" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><h5>桑基图<div>Sankey</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-themeRiver" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><h5>主题河流图<div>ThemeRiver</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pictorialBar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><h5>象形柱图<div>PictorialBar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-custom" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><h5>自定义系列<div>Custom</div></h5></a></li></ul><h2>坐标系文档速查</h2><ul><li class="cheat-chart-item"><a href="option.html#grid" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><h5>直角坐标系<div>Grid</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#polar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><h5>极坐标系<div>Polar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#geo" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><h5>地理坐标系<div>Geo</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#singleAxis" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><h5>单轴<div>SingleAxis</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#calendar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><h5>日历<div>Calendar</div></h5></a></li></ul><h2>组件文档速查</h2><ul><li class="cheat-chart-item"><a href="option.html#title" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><h5>标题<div>Title</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#legend" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><h5>图例<div>Legend</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#tooltip" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><h5>提示框<div>Tooltip</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markPoint" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><h5>标注<div>MarkPoint</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markLine" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><h5>标线<div>MarkLine</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markArea" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><h5>标域<div>MarkArea</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#timeline" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><h5>时间轴<div>Timeline</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#dataZoom" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><h5>数据区域缩放<div>DataZoom</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#brush" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><h5>刷选<div>Brush</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#visualMap" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><h5>视觉映射<div>VisualMap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#toolbox" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><h5>工具栏<div>Toolbox</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#graphic" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><h5>自定义图形<div>Graphic</div></h5></a></li></ul></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
-</script><script src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/cheat-sheet.js?_v_=1598903776431"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>术语速查手册</h1><p>快速了解功能名称,帮助定位到配置项手册</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content container page-cheatsheet"><h2>常用组件说明</h2><div id="cheat-chart-container"><div class="row"><div class="col-lg-9"><div id="cheat-chart"></div></div><div class="col-lg-3"><div id="cheat-detail"></div></div></div></div><h2>系列类型文档速查</h2><ul><li class="cheat-chart-item"><a href="option.html#series-bar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/bar.svg?_v_=20200710_1" alt=""><h5>柱状图<div>Bar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/line.svg?_v_=20200710_1" alt=""><h5>折线图<div>Line</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pie" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pie.svg?_v_=20200710_1" alt=""><h5>饼图<div>Pie</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-scatter" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/scatter.svg?_v_=20200710_1" alt=""><h5>散点图<div>Scatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-effectScatter" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/effectScatter.svg?_v_=20200710_1" alt=""><h5>涟漪散点图<div>EffectScatter</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-candlestick" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/candlestick.svg?_v_=20200710_1" alt=""><h5>K线图<div>Candlestick</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-radar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/radar.svg?_v_=20200710_1" alt=""><h5>雷达图<div>Radar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-heatmap" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/heatmap.svg?_v_=20200710_1" alt=""><h5>热力图<div>Heatmap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-tree" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/tree.svg?_v_=20200710_1" alt=""><h5>树图<div>Tree</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-treemap" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/treemap.svg?_v_=20200710_1" alt=""><h5>矩形树图<div>Treemap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sunburst" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sunburst.svg?_v_=20200710_1" alt=""><h5>旭日图<div>Sunburst</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-map" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/map.svg?_v_=20200710_1" alt=""><h5>地图<div>Map</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-lines" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/lines.svg?_v_=20200710_1" alt=""><h5>线图<div>Lines</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-graph" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/graph.svg?_v_=20200710_1" alt=""><h5>关系图<div>Graph</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-boxplot" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/boxplot.svg?_v_=20200710_1" alt=""><h5>箱线图<div>Boxplot</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-parallel" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/parallel.svg?_v_=20200710_1" alt=""><h5>平行坐标<div>Parallel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-gauge" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/gauge.svg?_v_=20200710_1" alt=""><h5>仪表盘<div>Gauge</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-funnel" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/funnel.svg?_v_=20200710_1" alt=""><h5>漏斗图<div>Funnel</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-sankey" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/sankey.svg?_v_=20200710_1" alt=""><h5>桑基图<div>Sankey</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-themeRiver" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/themeRiver.svg?_v_=20200710_1" alt=""><h5>主题河流图<div>ThemeRiver</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-pictorialBar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/pictorialBar.svg?_v_=20200710_1" alt=""><h5>象形柱图<div>PictorialBar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-custom" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/chart/custom.svg?_v_=20200710_1" alt=""><h5>自定义系列<div>Custom</div></h5></a></li></ul><h2>坐标系文档速查</h2><ul><li class="cheat-chart-item"><a href="option.html#grid" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/gridSimple.svg?_v_=20200710_1" alt=""><h5>直角坐标系<div>Grid</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#polar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/polar.svg?_v_=20200710_1" alt=""><h5>极坐标系<div>Polar</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#geo" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/geo.svg?_v_=20200710_1" alt=""><h5>地理坐标系<div>Geo</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#singleAxis" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/singleAxis.svg?_v_=20200710_1" alt=""><h5>单轴<div>SingleAxis</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#calendar" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/calendar.svg?_v_=20200710_1" alt=""><h5>日历<div>Calendar</div></h5></a></li></ul><h2>组件文档速查</h2><ul><li class="cheat-chart-item"><a href="option.html#title" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/title.svg?_v_=20200710_1" alt=""><h5>标题<div>Title</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#legend" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/legend.svg?_v_=20200710_1" alt=""><h5>图例<div>Legend</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#tooltip" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/tooltip.svg?_v_=20200710_1" alt=""><h5>提示框<div>Tooltip</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markPoint" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markPoint.svg?_v_=20200710_1" alt=""><h5>标注<div>MarkPoint</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markLine" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markLine.svg?_v_=20200710_1" alt=""><h5>标线<div>MarkLine</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#series-line.markArea" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/markArea.svg?_v_=20200710_1" alt=""><h5>标域<div>MarkArea</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#timeline" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/timeline.svg?_v_=20200710_1" alt=""><h5>时间轴<div>Timeline</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#dataZoom" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/dataZoom.svg?_v_=20200710_1" alt=""><h5>数据区域缩放<div>DataZoom</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#brush" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/brush.svg?_v_=20200710_1" alt=""><h5>刷选<div>Brush</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#visualMap" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/visualMap.svg?_v_=20200710_1" alt=""><h5>视觉映射<div>VisualMap</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#toolbox" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/toolbox.svg?_v_=20200710_1" alt=""><h5>工具栏<div>Toolbox</div></h5></a></li><li class="cheat-chart-item"><a href="option.html#graphic" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/builder/component/graphic.svg?_v_=20200710_1" alt=""><h5>自定义图形<div>Graphic</div></h5></a></li></ul></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
+</script><script src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/cheat-sheet.js?_v_=1603774175523"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/coding-standard.html b/zh/coding-standard.html
index 4e08516..a666b3b 100644
--- a/zh/coding-standard.html
+++ b/zh/coding-standard.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -573,7 +573,7 @@
 <p><strong>[强制]</strong> 不要使用 <code>for in</code> 语句对数组进行遍历。</p>
 <h3 id="其他">其他</h3>
 <p><strong>[强制]</strong> 不要使用 <code>eval</code> 和 <code>with</code>。允许使用<code>new Function</code>。</p>
-<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';
+<footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';
 
 var $list = $('#standard-nav');
 $('.page-detail h2, .page-detail h3, .page-detail h4')
diff --git a/zh/committers.html b/zh/committers.html
index eb37a2c..c943c0d 100644
--- a/zh/committers.html
+++ b/zh/committers.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>Committers - Apache ECharts (incubating)</title></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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>贡献者列表</h1><p>ECharts 的发展离不开其背后很多人的卓越贡献,他们有着不同的技能,甚至来自不同的岗位和公司</p><p>感谢每一个人的帮助与支持,更希望以后能有更多的人助力 ECharts 的成长</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="about-page"><section class="container contributor"><h4 class="group mentors">Apache Mentors</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/dave.jpg?_v_=20200710_1"><h5 class="about-name">Dave Fisher</h5><div class="about-desc">美国 · 旧金山</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/kevin.jpg?_v_=20200710_1"><h5 class="about-name">Kevin A. McGrail</h5><div class="about-desc">美国 · 华盛顿</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/shengwu.jpg?_v_=20200710_1"><h5 class="about-name">吴晟</h5><div class="about-desc">北京 · 中国</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/tedliu.jpg?_v_=20200710_1"><h5 class="about-name">Ted Liu</h5><div class="about-desc">北京 · 中国</div></div></div></div><h4 class="group code">PPMC</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/pissang" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/沈毅.jpg?_v_=20200710_1"></a><h5 class="about-name">沈毅</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/100pah" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/宿爽.jpg?_v_=20200710_1"></a><h5 class="about-name">宿爽</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/Ovilia" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/羡辙.jpg?_v_=20200710_1"></a><h5 class="about-name">羡辙</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/deqingli" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/德清.jpg?_v_=20200710_1"></a><h5 class="about-name">德清</h5><div class="about-desc">阿里巴巴</div><div class="about-desc">中国 · 杭州</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://www.behance.net/wjtjiayouac8aa" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/王俊婷.jpg"></a><h5 class="about-name">王俊婷</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/kener" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/林峰.jpg?_v_=20200710_1"></a><h5 class="about-name">林峰</h5><div class="about-desc">阿里巴巴</div><div class="about-desc">中国 · 杭州</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/erik168" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/erik.jpg?_v_=20200710_1"></a><h5 class="about-name">董睿</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chriswong" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/大佛.jpg?_v_=20200710_1"></a><h5 class="about-name">黄后锦</h5><div class="about-desc">跟谁学</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/susiwen8" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/苏思文.jpg?_v_=20200710_1"></a><h5 class="about-name">苏思文</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/plainheart" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/plainheart.jpg?_v_=20200710_1"></a><h5 class="about-name">王忠祥</h5><div class="about-desc">中国 · 河南</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/wf123537200" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/zakwu.jpg?_v_=20200710_1"></a><h5 class="about-name">巫枫</h5><div class="about-desc">腾讯</div><div class="about-desc">中国 · 深圳</div></div></div></div><h4 class="group code">Committers</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/cuijian-dexter" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/崔健.jpg?_v_=20200710_1"></a><h5 class="about-name">崔健</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/ClemMakesApps" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/clement.jpg?_v_=20200710_1"></a><h5 class="about-name">Clement Ho</h5><div class="about-desc">GitLab</div><div class="about-desc">美国 · 得克萨斯州</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/yufeng04" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/禹峰.jpg?_v_=20200710_1"></a><h5 class="about-name">禹峰</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/SnailSword" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/韩天.jpg?_v_=20200710_1"></a><h5 class="about-name">韩天</h5><div class="about-desc">学生</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/alex2wong" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/黄益修.jpg?_v_=20200710_1"></a><h5 class="about-name">黄益修</h5><div class="about-desc">字节跳动</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chfw" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/chfw.jpg?_v_=20200710_1"></a><h5 class="about-name">chfw</h5><div class="about-desc">英国</div></div></div></div><h4 class="group contributor">Contributors</h4><div class="row"><p></p><p>在 <a href="https://github.com/apache/incubator-echarts/graphs/contributors">ECharts 贡献者列表</a>中,记录了更多为 ECharts 做出过贡献的人 。</p><p>感谢所有贡献者,一起助力 ECharts 更好地成长。</p></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>贡献者列表</h1><p>ECharts 的发展离不开其背后很多人的卓越贡献,他们有着不同的技能,甚至来自不同的岗位和公司</p><p>感谢每一个人的帮助与支持,更希望以后能有更多的人助力 ECharts 的成长</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="about-page"><section class="container contributor"><h4 class="group mentors">Apache Mentors</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/dave.jpg?_v_=20200710_1"><h5 class="about-name">Dave Fisher</h5><div class="about-desc">美国 · 旧金山</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/kevin.jpg?_v_=20200710_1"><h5 class="about-name">Kevin A. McGrail</h5><div class="about-desc">美国 · 华盛顿</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/shengwu.jpg?_v_=20200710_1"><h5 class="about-name">吴晟</h5><div class="about-desc">北京 · 中国</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/tedliu.jpg?_v_=20200710_1"><h5 class="about-name">Ted Liu</h5><div class="about-desc">北京 · 中国</div></div></div></div><h4 class="group code">PPMC</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/pissang" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/沈毅.jpg?_v_=20200710_1"></a><h5 class="about-name">沈毅</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/100pah" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/宿爽.jpg?_v_=20200710_1"></a><h5 class="about-name">宿爽</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/Ovilia" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/羡辙.jpg?_v_=20200710_1"></a><h5 class="about-name">羡辙</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/deqingli" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/德清.jpg?_v_=20200710_1"></a><h5 class="about-name">德清</h5><div class="about-desc">阿里巴巴</div><div class="about-desc">中国 · 杭州</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://www.behance.net/wjtjiayouac8aa" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/王俊婷.jpg"></a><h5 class="about-name">王俊婷</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/kener" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/林峰.jpg?_v_=20200710_1"></a><h5 class="about-name">林峰</h5><div class="about-desc">阿里巴巴</div><div class="about-desc">中国 · 杭州</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/erik168" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/erik.jpg?_v_=20200710_1"></a><h5 class="about-name">董睿</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chriswong" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/大佛.jpg?_v_=20200710_1"></a><h5 class="about-name">黄后锦</h5><div class="about-desc">跟谁学</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/susiwen8" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/苏思文.jpg?_v_=20200710_1"></a><h5 class="about-name">苏思文</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/plainheart" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/plainheart.jpg?_v_=20200710_1"></a><h5 class="about-name">王忠祥</h5><div class="about-desc">中国 · 河南</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/wf123537200" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/zakwu.jpg?_v_=20200710_1"></a><h5 class="about-name">巫枫</h5><div class="about-desc">腾讯</div><div class="about-desc">中国 · 深圳</div></div></div></div><h4 class="group code">Committers</h4><div class="row"><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/cuijian-dexter" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/崔健.jpg?_v_=20200710_1"></a><h5 class="about-name">崔健</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/ClemMakesApps" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/clement.jpg?_v_=20200710_1"></a><h5 class="about-name">Clement Ho</h5><div class="about-desc">GitLab</div><div class="about-desc">美国 · 得克萨斯州</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/yufeng04" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/禹峰.jpg?_v_=20200710_1"></a><h5 class="about-name">禹峰</h5><div class="about-desc">百度</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/SnailSword" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/韩天.jpg?_v_=20200710_1"></a><h5 class="about-name">韩天</h5><div class="about-desc">学生</div><div class="about-desc">中国 · 北京</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/alex2wong" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/黄益修.jpg?_v_=20200710_1"></a><h5 class="about-name">黄益修</h5><div class="about-desc">字节跳动</div><div class="about-desc">中国 · 上海</div></div></div><div class="col-md-3 col-sm-4 col-xs-6"><div class="about-person"><a href="https://github.com/chfw" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/people/chfw.jpg?_v_=20200710_1"></a><h5 class="about-name">chfw</h5><div class="about-desc">英国</div></div></div></div><h4 class="group contributor">Contributors</h4><div class="row"><p></p><p>在 <a href="https://github.com/apache/incubator-echarts/graphs/contributors">ECharts 贡献者列表</a>中,记录了更多为 ECharts 做出过贡献的人 。</p><p>感谢所有贡献者,一起助力 ECharts 更好地成长。</p></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';
 
 var recommendId = 3;
 setInterval(function () {
diff --git a/zh/contributing.html b/zh/contributing.html
index 95455a0..bac03e8 100644
--- a/zh/contributing.html
+++ b/zh/contributing.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>如何贡献 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/zh/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
-<!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>如何贡献</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="container"><h2>如何为 Apache ECharts (incubating) 项目贡献一份力量</h2><p>ECharts 欢迎各种形式的贡献!</p><h3>Issues</h3><p>查看 <a href="https://github.com/apache/incubator-echarts/issues" target="_blank">issue</a> 中是否有可以提供帮助的问题。</p><ul><li>如果是一个报 bug 或者提问如何使用 ECharts 的 issue,可以帮忙提醒创建者提供一个可复现的在线例子。例子可以通过 <a href="https://codepen.io/Ovilia/pen/dyYWXWM" target="_blank">Codepen</a> 或者 <a href="https://gallery.echartsjs.com/editor.html" target="_blank">ECharts Gallery</a> 创建。</li><li>如果是一个提新需求的 issue,可以帮忙确保创建者对预期的效果有清晰的表述。很多情况下,一个简单的设计图对清晰地表达需求是有必要的。</li><li>帮助复现问题,并根据<a href="https://echarts.apache.org/zh/option.html" target="_blank">文档</a>判断这是否是一个 bug。</li><li>没有标记 "pending" 标签的 issue,是我们明确是 bug 或新需求的 issue。欢迎提 pull request 帮忙修复这些问题。</li></ul><h3>Pull Requests</h3><p>我们非常欢迎社区贡献者以 PR 的形式作贡献!</p><p>在开始之前,请先阅读我们的<a href="./coding-standard.html">代码规范</a>以及<a href="https://www.apache.org/foundation/policies/conduct.html" target="_blank">Apache 行为规范</a>。</p><p>具体操作请参考 <a href="https://github.com/apache/incubator-echarts/wiki/How-to-setup-the-dev-environment" target="_blank">How to setup the dev environment</a> 以及 <a href="https://github.com/apache/incubator-echarts/wiki/How-to-make-a-pull-request" target="_blank">How to make a pull request</a>。</p><p>如果在提 PR 过程中碰到问题,欢迎在 issue 或 PR 中评论,或者给 <a href="mailto:dev@echarts.apache.org">dev@echarts.apache.org</a> 发邮件咨询。</p><h3>邮件组</h3><p>欢迎订阅<a href="./maillist.html">邮件组</a>参与我们的讨论。</p><h3>文档</h3><p>文档的修缮可能是 Apache ECharts (incubating) 最需要帮助的地方。如果你对此感兴趣,无论是对某个页面文字的小修改,还是纠正一个链接或者其他的小改动,我们都非常欢迎!</p><p>文档的源代码可以在 <a href="https://github.com/apache/incubator-echarts-doc" target="_blank">GitHub</a> 找到。如果想要知道应该修改项目中的哪个文件,通常最简单的方式是在项目中搜索关键字。</p><p>在 issue 列表中,<a href="https://github.com/apache/incubator-echarts/labels/doc" target="_blank">"doc"</a> 标签表示相关文档需要修改。我们非常欢迎提 PR 修改这些问题!</p><h2>成为 PPMC 成员或 Committer!</h2><p>正如上面所说,我们非常欢迎社区以任何形式为 ECharts 项目作贡献。当我们发现社区中长期持续贡献的伙伴,会邀请他们成为 PPMC 成员或者 Committer。</p><p>成为 Committer 意味着你拥有对 ECharts 项目的“写”权限,可以更方便高效地为项目贡献。</p><p>PPMC(Podling Project Management Committee)是孵化项目管理委员会的意思。PPMC 成员帮助 ECharts 项目在孵化期间学习自我管理。更多详细信息请参考 <a href="https://incubator.apache.org/guides/ppmc.html">Podling Project Management Committee</a>。</p><p>成为 PPMC 成员和 Committer 没有唯一固定的标准,因为我们鼓励不同形式的贡献。通常来说,现在的 PPMC 成员会考察社区贡献者的表现,在发现有符合标准的人选后,会在内部发起讨论和投票,投票通过后将邀请其成为 PPMC 成员或 Committer。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>如何贡献</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="container"><h2>如何为 Apache ECharts (incubating) 项目贡献一份力量</h2><p>ECharts 欢迎各种形式的贡献!</p><h3>Issues</h3><p>查看 <a href="https://github.com/apache/incubator-echarts/issues" target="_blank">issue</a> 中是否有可以提供帮助的问题。</p><ul><li>如果是一个报 bug 或者提问如何使用 ECharts 的 issue,可以帮忙提醒创建者提供一个可复现的在线例子。例子可以通过 <a href="https://codepen.io/Ovilia/pen/dyYWXWM" target="_blank">Codepen</a> 或者 <a href="https://gallery.echartsjs.com/editor.html" target="_blank">ECharts Gallery</a> 创建。</li><li>如果是一个提新需求的 issue,可以帮忙确保创建者对预期的效果有清晰的表述。很多情况下,一个简单的设计图对清晰地表达需求是有必要的。</li><li>帮助复现问题,并根据<a href="https://echarts.apache.org/zh/option.html" target="_blank">文档</a>判断这是否是一个 bug。</li><li>没有标记 "pending" 标签的 issue,是我们明确是 bug 或新需求的 issue。欢迎提 pull request 帮忙修复这些问题。</li></ul><h3>Pull Requests</h3><p>我们非常欢迎社区贡献者以 PR 的形式作贡献!</p><p>在开始之前,请先阅读我们的<a href="./coding-standard.html">代码规范</a>以及<a href="https://www.apache.org/foundation/policies/conduct.html" target="_blank">Apache 行为规范</a>。</p><p>具体操作请参考 <a href="https://github.com/apache/incubator-echarts/wiki/How-to-setup-the-dev-environment" target="_blank">How to setup the dev environment</a> 以及 <a href="https://github.com/apache/incubator-echarts/wiki/How-to-make-a-pull-request" target="_blank">How to make a pull request</a>。</p><p>如果在提 PR 过程中碰到问题,欢迎在 issue 或 PR 中评论,或者给 <a href="mailto:dev@echarts.apache.org">dev@echarts.apache.org</a> 发邮件咨询。</p><h3>邮件组</h3><p>欢迎订阅<a href="./maillist.html">邮件组</a>参与我们的讨论。</p><h3>文档</h3><p>文档的修缮可能是 Apache ECharts (incubating) 最需要帮助的地方。如果你对此感兴趣,无论是对某个页面文字的小修改,还是纠正一个链接或者其他的小改动,我们都非常欢迎!</p><p>文档的源代码可以在 <a href="https://github.com/apache/incubator-echarts-doc" target="_blank">GitHub</a> 找到。如果想要知道应该修改项目中的哪个文件,通常最简单的方式是在项目中搜索关键字。</p><p>在 issue 列表中,<a href="https://github.com/apache/incubator-echarts/labels/doc" target="_blank">"doc"</a> 标签表示相关文档需要修改。我们非常欢迎提 PR 修改这些问题!</p><h2>成为 PPMC 成员或 Committer!</h2><p>正如上面所说,我们非常欢迎社区以任何形式为 ECharts 项目作贡献。当我们发现社区中长期持续贡献的伙伴,会邀请他们成为 PPMC 成员或者 Committer。</p><p>成为 Committer 意味着你拥有对 ECharts 项目的“写”权限,可以更方便高效地为项目贡献。</p><p>PPMC(Podling Project Management Committee)是孵化项目管理委员会的意思。PPMC 成员帮助 ECharts 项目在孵化期间学习自我管理。更多详细信息请参考 <a href="https://incubator.apache.org/guides/ppmc.html">Podling Project Management Committee</a>。</p><p>成为 PPMC 成员和 Committer 没有唯一固定的标准,因为我们鼓励不同形式的贡献。通常来说,现在的 PPMC 成员会考察社区贡献者的表现,在发现有符合标准的人选后,会在内部发起讨论和投票,投票通过后将邀请其成为 PPMC 成员或 Committer。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/css/main.css b/zh/css/main.css
index 89caec4..842037b 100644
--- a/zh/css/main.css
+++ b/zh/css/main.css
@@ -1 +1 @@
-@font-face{font-family:'iconfont';src:url("font/iconfont.eot");src:url("font/iconfont.eot?#iefix") format("embedded-opentype"),url("font/iconfont.woff") format("woff"),url("font/iconfont.ttf") format("truetype"),url("font/iconfont.svg#iconfont") format("svg")}.iconfont{font-family:"iconfont" !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{height:100%}body{font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif}#lowie-main{display:none}.lower-ie #main{display:none}.lower-ie #lowie-main{display:block;height:100%;width:100%;padding:200px 0 100px;background-color:#2a3c54}.lower-ie #lowie-main img{display:block;width:60%;margin:0 auto}.navbar-default{border:none;background-color:#293c55;z-index:10000;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;height:50px}.navbar-default .navbar-nav{-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear}.navbar-default .navbar-nav li{position:relative}.navbar-default .navbar-nav li a{color:rgba(255,255,255,0.45);background-color:none !important;padding:15px 20px;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color;font-size:14px}.navbar-default .navbar-nav li a:before{content:'';position:absolute;left:50%;right:50%;top:0;background:#a9334c;height:4px;-webkit-transition-property:'left, right';-o-transition-property:'left, right';transition-property:'left, right';-webkit-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-nav li a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li a:hover:before,.navbar-default .navbar-nav li a:focus:before{left:0;right:0}.navbar-default .navbar-nav li a .iconfont{font-size:12px}.navbar-default .navbar-nav li a .new{display:inline-block;padding:2px 5px;background-color:#a9334c;color:#fff;font-size:12px;border-radius:3px;-webkit-transform:scale(0.65);-ms-transform:scale(0.65);transform:scale(0.65)}.navbar-default .navbar-nav li.open{background-color:#162436;color:#fff}.navbar-default .navbar-nav li.open>a:focus,.navbar-default .navbar-nav li.open>a:hover{color:#eee;background-color:#162436}.navbar-default .navbar-nav li.active>a{padding-top:11px;border-top:4px solid #a9334c;color:#fff;background-color:#0e151f;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color}.navbar-default .navbar-nav li.active>a:before{display:none}.navbar-default .navbar-nav li.active>a:hover,.navbar-default .navbar-nav li.active>a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li .dropdown-menu{width:250px;padding:0;background-color:#162436;-webkit-box-shadow:none;box-shadow:none;border:none}.navbar-default .navbar-nav li .dropdown-menu li{background-color:#162436;border-top:none;padding:5px 0}.navbar-default .navbar-nav li .dropdown-menu li a{padding:8px 20px}.navbar-default .navbar-nav li .dropdown-menu li:hover,.navbar-default .navbar-nav li .dropdown-menu li:focus{background-color:#a9334c}.navbar-default .navbar-nav li .dropdown-menu li:hover a,.navbar-default .navbar-nav li .dropdown-menu li:focus a{background-color:#a9334c}.navbar-default .navbar-nav li ul a:before{display:none}.navbar-default .navbar-logo{height:32px;margin-top:-6px;margin-left:-2px}.navbar-default .navbar-collapse{border-top:none}.navbar-default .navbar-toggle{padding:1px 5px;margin:7px 16px 0 0;border-color:#384E6B;background-color:#384E6B}.navbar-default .navbar-toggle .icon-bar{margin:7px 0 !important;height:1px;background-color:#fff}.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{border-color:#384E6B;background-color:#384E6B}.container-fluid{padding-left:25px}#menu-btn{display:none;float:right;height:45px;line-height:45px;margin:5px 20px 0 0;font-size:30px;color:#fff;cursor:pointer}.navbar-bg{background-color:rgba(41,60,85,0.3);-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-property:background-color, opacity;-o-transition-property:background-color, opacity;transition-property:background-color, opacity}.navbar-bg:hover{background-color:rgba(41,60,85,0.8)}.navbar-bg .navbar-nav li a{color:#fff}.navbar-bg .navbar-nav li.active a{color:#fff;background-color:transparent}.navbar-bg .navbar-nav #nav-apache{opacity:1}#nav-apache{margin-left:10px;margin-right:10px;opacity:0.6}#nav-apache:hover{opacity:1}#nav-apache a{padding:10px 15px}#nav-apache a img{width:127px;height:30px}.icon-external-link{position:relative;top:2px;left:5px;opacity:0.5}@media (max-width: 768px){.navbar-default .navbar-nav{background-color:#293c55;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;margin-top:0;margin-bottom:0}.navbar-default .navbar-nav .open .dropdown-menu{padding:0}.navbar-default .navbar-nav .open .dropdown-menu li a{color:#fff}.navbar-default .navbar-nav li.active>a{border-left:4px solid #a9334c;border-top:none;padding:10px 15px 10px 11px}#menu-btn{display:block}#nav-download{display:none}}@media (max-width: 992px) and (min-width: 768px){.navbar-default .navbar-nav li a{padding:15px 15px}}.page-main{position:absolute;left:0;right:0;top:50px;bottom:0;overflow-y:auto}.doc-version-change{position:absolute;top:70px;right:50px;z-index:100}.doc-version-change a{display:inline-block;margin-left:20px}.section-bg{background:#F4F7FC;padding:10px 0}.d-section.last-section{margin-bottom:30px;border-bottom:0}.page-info{margin-bottom:30px;text-align:center;padding:40px;color:#4e6167;background:#F4F7FC}.page-info h1{margin-bottom:5px;font-size:40px;font-weight:bold;color:#333}.page-info p{font-size:16px}.page-info-echarts{font-size:12px;margin-top:15px;color:#8E99AB}.page-content{min-height:300px;padding-bottom:40px;font-size:16px;line-height:22px}.page-content h2{color:#a9334c;padding-bottom:15px;border-bottom:1px solid #ddd;margin-top:40px;margin-bottom:20px}.page-content h2:first-child{margin-top:0}.page-content h3{margin:30px 0 10px 0}.page-content p{margin:10px 0}.page-content section{padding:40px 0;text-align:center}.page-content ul{padding-left:30px}.page-content li{margin:5px 0;list-style:disc}.page-nav{position:fixed;overflow:auto;width:200px;top:260px;bottom:0;margin:0 0 0 30px;padding:0 0 20px 0}.page-nav h4{margin:10px 0;color:#666;font-size:14px;padding-left:10px}.page-nav h4:first-child{margin-top:0}.page-nav h4.inner{margin:0;padding-left:0;font-size:18px}.page-nav a{border-left:1px solid rgba(78,97,103,0.25);color:#999;padding:7px 10px;display:block;position:relative}.page-nav a:before{content:'';position:absolute;top:50%;bottom:50%;background:#a9334c;width:3px;left:-1px;-webkit-transition-property:'top, bottom';-o-transition-property:'top, bottom';transition-property:'top, bottom';-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.page-nav a:hover{text-decoration:none;color:#333}.page-nav a:hover:before{top:0;bottom:0}.page-nav a.active{color:#a9334c}.page-nav .slide-btn{display:none}.page-detail{margin-left:220px;margin-bottom:20px;padding:0 40px 0 40px;overflow-x:hidden}.page-detail h2{margin:10px 0;padding-top:20px;font-size:22px}.page-detail h2:first-child{margin-top:0;padding-top:0}.page-detail h2+h3{margin-top:20px}.page-detail h3{margin:40px 0 15px 0;font-size:18px}.page-detail p{margin:15px 0}.page-detail li{padding-left:0}.page-detail li li{padding-left:20px;margin:5px 0}.page-detail .time{float:right;position:relative;top:-35px}@media screen and (max-device-width: 600px){.page-content.single-page{position:static}.page-content.slide-up .page-nav ul{display:none}.page-info{text-align:left;padding:15px;margin-bottom:10px}.page-info h1{margin-bottom:10px}.page-nav{position:static}.page-nav .slide-btn{display:block;color:#e43c59;position:absolute;right:20px;margin-top:10px}.page-detail{position:static;margin-left:0;padding:0 15px}.page-detail h2{padding-top:20px}.page-detail h2:first-child{padding-top:0}}#download-extension-container{max-width:800px}#download-extension-container .row{margin-top:40px;margin-bottom:40px}#reference{padding:90px 0 140px 0;text-align:center}footer{min-height:236px;background-color:#293c55;color:#808795;font-size:14px}footer.inner-footer{background-color:transparent;border-top:1px solid #eee;margin-top:40px;color:#aaa;font-size:12px}footer.inner-footer .container{padding:0}footer.inner-footer p{line-height:20px}footer.inner-footer .row{margin-top:20px !important}footer.inner-footer #footer-icon-panel{text-align:left}footer.inner-footer #footer-icon-panel img{margin-top:20px;width:250px}footer .row{margin-top:50px !important;margin-bottom:0 !important}footer .logo img{display:block;margin-bottom:20px;width:109px}footer .footer-apache-logo{width:300px;max-width:80%;margin:0 0 10px 0}footer #efe-product li{width:50%;display:inline-block}footer #echarts-copyright{color:rgba(255,255,255,0.4);margin:65px 0 20px 0;font-size:1.2rem}footer h3{color:#fff;font-size:1.5rem;margin:10px 0}footer ul{height:150px}footer ul dt{width:50%;float:left;font-weight:300}footer ul li{font-weight:300}footer ul a{color:rgba(255,255,255,0.4);font-size:1.2rem;margin:5px 0}footer ul a:hover{color:rgba(255,255,255,0.8)}footer #footer-icon-panel{text-align:right;font-weight:300;float:right}footer .footer-icon{display:inline-block;width:40px;height:40px;border-radius:50px;margin:5px 0 5px 10px;padding:8px 10px;border:1px solid white}@media (max-width: 992px){footer .footer-apache-logo{margin:10px -30px 0 0}footer .icon-panel{margin:-20px -50px 20px 0;text-align:center}footer #echarts-copyright{margin:20px 0;text-align:center}footer .footer-icon{margin:30px 5px 5px 5px}}@media (max-width: 768px){footer .logo img{margin:0 auto}footer #footer-icon-panel{text-align:center}footer #echarts-copyright{text-align:center}}html{overflow-x:hidden}body{width:100%;overflow-x:hidden;background-color:#fff}#page-index{top:0}#main-content{color:#9297A3;font-weight:300}#main-content h1,#main-content h2,#main-content h3,#main-content h4,#main-content h5,#main-content h6{color:#333743;font-weight:400}#main-content p{font-weight:300}#main-content footer{font-weight:400 !important}#main-content footer h3{color:white}#main-content #home-section{position:relative;background-color:white}#main-content #home-section .btn{letter-spacing:10px;-webkit-box-shadow:2px 4px 4px rgba(0,0,0,0.2);box-shadow:2px 4px 4px rgba(0,0,0,0.2);text-shadow:0 2px 4px rgba(0,0,0,0.5)}#main-content #home-section .btn:hover{text-shadow:none}#main-content #video-index{width:100%}#main-content #home-logo{width:1000px;max-width:95%}#main-content .video-btn{width:60px;height:60px;position:absolute;padding-top:18px;border-radius:50%;background-color:#fff;text-align:center;cursor:pointer;z-index:100}#main-content .video-index-btn{bottom:55px;left:70px}#main-content .video-play-btn{padding-left:4px}#main-content .video-pause-btn{display:none}@-webkit-keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}@keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}#main-content #video-index-play:before{-webkit-animation:fx-plyr-play-button 1.5s ease-out infinite;animation:fx-plyr-play-button 1.5s ease-out infinite;border:4px solid #fff;border-radius:150%;-webkit-box-shadow:0 0 5px #fff;box-shadow:0 0 5px #fff;-webkit-box-sizing:border-box;box-sizing:border-box;content:"";height:150%;left:-25%;position:absolute;top:-25%;width:150%}#main-content .feature-play-btn{-webkit-transform:scale(0.7);-ms-transform:scale(0.7);transform:scale(0.7)}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:5%;bottom:6%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:25%}#main-content .main-bg{width:100%;position:absolute;z-index:10;top:0;bottom:5px}#main-content .banner-section{position:relative;margin-top:-5px}#main-content .banner-section a{display:block;text-align:center}#main-content .banner-img{width:100%}#main-content h2{margin:35px 0 5px 0}#main-content .feature-btn{margin-top:40px}#main-content .feature-btn a{color:#40A7DC}#main-content .feature-btn .more-icon{display:inline-block;margin-left:8px;padding-top:2px}#main-content .row{margin:40px 0}#main-content .right-column{text-align:right}#main-content section.normal{padding-top:50px;padding-bottom:50px;text-align:center}#main-content .btn-panel{margin-top:30px;text-align:center}#main-content .btn-panel .btn{width:140px;padding:9px;margin-left:0;margin-right:36px;border-radius:25px;text-indent:10px}#efe-more{margin-top:-10px}#reference{font-size:1.6rem;font-weight:400;line-height:2.4rem;text-align:center;background-image:url("../images/map.png");background-repeat:no-repeat;background-position:center center;background-size:contain;color:#333}#reference #recommends{height:160px;position:relative;max-width:90%;width:600px;margin:0 auto;text-align:center}#reference .recommend{display:none;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;position:absolute;bottom:0;width:100%}#reference .recommend.active{display:block}#reference .recommend p{margin:10px auto;font-size:20px;font-weight:400;color:#333}#reference .recommend p:before{display:inline-block;content:'';width:41px;height:37px;background-image:url("../images/yinhao.png");background-size:100%;margin-right:20px}#reference .person{margin:10px 0 20px 0;color:#9297A3}#reference .person .name{margin-top:-5px}#reference .people{height:100px}#reference .people img{width:70px;border-radius:50%;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;border-color:white;opacity:0.5;display:inline-block;margin:15px 10px}#reference .people img.active{width:100px;margin:0;-webkit-box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);border:4px solid white;opacity:1}#main-content #reference{margin-top:100px}.companies{overflow-x:hidden;overflow-y:hidden;width:100%;height:80px;white-space:nowrap;background:white;margin:69px 0 90px 0;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.companies img{padding:15px;height:100%}#home-section{position:relative;overflow:hidden}#home-section .description{position:absolute;top:50%;left:50%;width:1000px;height:200px;margin-top:-100px;margin-left:-500px;z-index:20;color:white;text-align:center}#home-section .description h1{font-size:80px;text-shadow:0 2px 4px rgba(0,0,0,0.5)}#home-section .description p{font-size:15px;color:#eee;text-shadow:1px 1px 2px #333}#feature-section{padding-top:50px}#feature-section .container{max-width:1000px}#feature-section .features{margin-top:20px;margin-bottom:90px;text-align:center}#feature-section .features h3{font-size:22px}#feature-section .features p{margin-top:11px}#feature-section .feature-detail{margin-bottom:20px;position:relative;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}#feature-section .feature-detail>.col{position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}#feature-section .feature-detail::before,#feature-section .feature-detail::after{content:" ";display:table}#feature-section .feature-detail::after{clear:both}#feature-section .feature-detail h2{font-size:35px;margin-bottom:12px}#feature-section .feature-detail h3{font-size:18px;font-weight:300;color:#9297A3;margin-top:30px}#feature-section .feature-detail h3 ~ h3{margin-top:18px}#feature-section .feature-detail p{font-weight:300;margin-top:8px}#feature-section .feature-detail #col-analysis h2{margin-top:-45px}#feature-section .feature-detail #col-data h2{margin-top:100px}.feature-icon-panel{width:90px;height:90px;margin:0 auto;margin-bottom:22px;padding:27px;border-radius:50%;border:1px solid #F2F2F2}.feature-icon{width:36px}#video-feature-4{width:100%;-webkit-box-shadow:3px 5px 10px rgba(0,0,0,0.43);box-shadow:3px 5px 10px rgba(0,0,0,0.43);border-radius:10px;border:2px solid #000}#video-feature-4 h2 div{margin-bottom:10px}#feature-dimension{top:50px}#video-feature-1{position:absolute;left:13.8%;width:66%;top:7.5%}#publication{margin-top:50px;padding:50px 0;background-color:#f5f7fd}#publication h2{margin-top:10px;font-weight:normal;font-size:28px;line-height:36px}#publication .container{max-width:1000px}#publication p.note{margin-top:10px}#publication p.link{color:#555;margin-top:20px;font-size:18px}#publication p.link a{margin-left:10px}#publication .img-container{padding:50px 10px;background-color:#fff;-webkit-box-shadow:3px 3px 11px #ccc;box-shadow:3px 3px 11px #ccc}#about-section{padding-top:40px;padding-bottom:90px;background-color:#fff}#about-section p{margin-top:12px}#about-section .btn-panel .btn{margin:0 25px;margin-top:10px;margin-bottom:10px}#about-section .btn-panel .btn-red{padding-left:10px}#gongzhonghao{margin:40px 0}#gongzhonghao img{width:150px;-webkit-box-shadow:0px 6px 12px 0 #eee;box-shadow:0px 6px 12px 0 #eee}#about-section a{color:#fff;position:relative;background-color:transparent;width:140px;height:40px;display:inline-block;margin:0 15px}#about-section a:hover{text-decoration:none}.btn-content{border-radius:25px;width:100%;height:100%;padding:10px;padding-left:8px;text-indent:10px;position:relative;z-index:100;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}.btn-content img{margin-right:10px;position:relative;top:-2px}.btn-shadow{display:block;width:136px;height:37px;border-radius:19px;position:absolute;top:2px;left:1px;-webkit-box-shadow:1px 0 9px rgba(187,37,48,0.6);box-shadow:1px 0 9px rgba(187,37,48,0.6);-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}#btn-github .btn-content{background-color:#4D62F6}#btn-github .btn-content:hover{background-color:#7086FF;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content:active{background-color:#4151CA;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content img{width:20px;top:-3px}#btn-github .btn-shadow{-webkit-box-shadow:1px 0 9px rgba(52,57,107,0.6);box-shadow:1px 0 9px rgba(52,57,107,0.6)}#btn-github:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(52,57,107,0.7);box-shadow:1px 3px 9px rgba(52,57,107,0.7)}#btn-weibo .btn-content{background-color:#FF414F}#btn-weibo .btn-content:hover{background-color:#FF6060;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content:active{background-color:#D72D3A;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content.zh{letter-spacing:5px}#btn-weibo .btn-content img{width:22px}#btn-weibo .btn-shadow{-webkit-box-shadow:1px 2px 7px rgba(187,37,48,0.5);box-shadow:1px 2px 7px rgba(187,37,48,0.5)}#btn-weibo:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(187,37,48,0.7);box-shadow:1px 3px 9px rgba(187,37,48,0.7)}#btn-twitter .btn-content{background-color:#00ACED}#btn-twitter .btn-content:hover{background-color:#67CFF6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content:active{background-color:#019CD6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content img{width:22px}#btn-twitter .btn-shadow{-webkit-box-shadow:1px 0 7px rgba(11,126,170,0.4);box-shadow:1px 0 7px rgba(11,126,170,0.4)}#btn-twitter:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(11,126,170,0.7);box-shadow:1px 3px 9px rgba(11,126,170,0.7)}@media (max-width: 992px){#home-section .description{width:80%;left:0;margin-left:10%}#feature-section .feature-detail h2{font-size:30px;margin-top:-15px}#feature-section .feature-detail h3{margin-top:15px}#feature-section .feature-detail p{margin-top:8px}#main-content .feature-btn{margin-top:15px}#col-desktop>*{margin-left:0}#col-data{padding-top:100px}#video-feature-1{width:64%;left:15%}}.mobile{display:none}@media (max-width: 768px){#main-content h2{font-size:24px}#main-content .feature-btn{margin:0 auto;margin-top:50px;text-align:center}.features{margin-bottom:0}.features p{margin-bottom:70px}#feature-section .feature-detail{-webkit-transform:none;-ms-transform:none;transform:none}#feature-section .feature-detail>.col{top:0;-webkit-transform:none;-ms-transform:none;transform:none;text-align:center}#feature-section .feature-detail .col-sm-4{margin-bottom:80px;padding-top:0}#reference{background-size:cover}#reference .people{height:180px}.pc{display:none}.mobile{display:block}}@media (max-width: 480px){#home-section .description{text-align:center;top:40%}#home-section .description .btn{display:block;margin:25px auto}#main-content #home-logo{margin-bottom:20px}#main-content #index-play-btn{display:block;width:120px;height:120px;margin:0 auto}#main-content #home-section .btn{background-color:white;color:#333743;text-shadow:none}#main-content h2{margin-top:20px}#main-content .video-index-btn{left:50%;margin-left:-30px;bottom:40px}#main-content #video-index-play:before{display:none}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:9%;bottom:10%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:20%}#about-section .btn-panel a{display:block;margin:20px auto}}.ch-main{position:relative;margin-top:100px;margin-left:100px}.ch-pc-chart{width:90%;height:280px;border-radius:12px;-webkit-box-shadow:6px 6px 22px #ccc;box-shadow:6px 6px 22px #ccc}.ch-pc-chart div{z-index:50 !important}.ch-mobile{position:absolute;right:0;width:180px;top:-30px;z-index:300}.ch-mobile-box{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ch-mobile-content{position:absolute;overflow:hidden;border-bottom-left-radius:5px;border-bottom-right-radius:5px;left:12%;right:12%;top:16%;bottom:15.5%;background:#333;z-index:300;padding:0;margin:0}.ch-mobile-chart{width:200%;height:200%;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scale(0.5);-ms-transform:scale(0.5);transform:scale(0.5);padding:0;margin:0}.ch-mobile-chart div div{z-index:50 !important}.ch-on-touch .ch-pc-chart{width:auto}.ch-on-touch .ch-mobile{display:none}@media (max-width: 768px){.ch-main{margin-left:0}}@media (max-width: 480px){.ch-main{margin-top:0}}#ec-example-main #left-container{top:71px}h1,h2,h3,h4,h5,h6,h7,p{font-weight:400;margin:0;padding:0}ul{list-style:none;padding:0;margin:0}img{max-width:100%}.clear :after{display:block;content:'';clear:both}iframe{border:1px solid #ccc}#download-table{margin:20px 0}#download-table td{padding:8px;text-align:left}#download-main{max-width:800px}#download-main .d-section{margin-top:20px;padding-top:20px}#download-main h2{font-size:25px;border-bottom:0;text-align:center;color:#293c55;text-align:left}#download-main h3{margin-top:40px;font-size:18px;font-weight:bold;text-align:left}#download-main h3.first{margin-top:-20px}#download-main p{text-align:left}#download-main .center{text-align:center}#download-main h4{margin:10px auto;margin-top:20px;font-size:16px;font-weight:bold;text-align:left}#download-main h4 .warn{color:#A9334C}#download-main .list-wrap{margin:20px 0 0 0}#download-main .d-section-version h2{margin-top:-30px}#download-main .checksum{text-align:left;margin:20px 0;border-left:0;padding:0}#download-main .checksum p,#download-main .checksum li{font-size:14px}#download-main li{list-style:inherit;margin:5px 0}.download-note{margin-top:12px;line-height:20px;font-size:14px;color:#999;text-align:left}.paper-desc{text-align:left;margin:20px -20px;padding:20px;background-color:#f5f7fd}.paper-desc .paper-title{font-size:16px;margin-top:5px;font-weight:bold}.paper-desc .paper-author{font-size:12px;margin:10px 0px;color:#999}.paper-desc .paper-journal{font-size:14px}#download-row{text-align:center}.d-section{padding-top:50px;padding-bottom:25px;text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);color:#6b7a89}.d-section{*zoom:1}.d-section:before,.d-section:after{display:table;line-height:0;content:""}.d-section:after{clear:both}.download-theme img{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.download-theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-main .d-section-version a,#download-main .d-section-gl a{text-decoration:none}#download-main .d-section-version a:hover .circle-wrap,#download-main .d-section-gl a:hover .circle-wrap{color:#fff;background-color:#45B4E8;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version a:active .circle-wrap,#download-main .d-section-version a:focus .circle-wrap,#download-main .d-section-gl a:active .circle-wrap,#download-main .d-section-gl a:focus .circle-wrap{color:#fff;background-color:#2997D6;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version .mode,#download-main .d-section-gl .mode{display:block;margin:38px 0 2px;font-size:17px}#download-main .d-section-version .text,#download-main .d-section-gl .text{margin-left:-10px;text-align:center;color:#333}#download-main .d-section-version .text span,#download-main .d-section-gl .text span{color:#333;opacity:0.7}.d-section-version{padding-bottom:50px}.d-section-version .row>div{height:220px}#download-main .circle-wrap{width:120px;height:120px;border-radius:50%;background-color:white;border:1px solid rgba(78,97,118,0.2);margin:0 auto;margin-bottom:15px;color:#293c55;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}.more-btn{position:relative;display:block;margin:20px auto;margin-bottom:10px}.more-btn:after{display:block;content:'';width:19px;height:18px;background-image:url("../images/btn-arrow.png");background-size:80% 80%;position:absolute;background-repeat:no-repeat;right:20px;top:13px}.more-btn+p{color:#6b7a89}.btn-two{margin-left:15px;margin-right:15px;margin-bottom:10px;position:relative;text-align:left;padding-left:45px !important}.d-section-map ul,.d-section-theme ul{*zoom:1}.d-section-map ul:before,.d-section-map ul:after,.d-section-theme ul:before,.d-section-theme ul:after{display:table;line-height:0;content:""}.d-section-map ul:after,.d-section-theme ul:after{clear:both}.d-section-map li,.d-section-theme li{float:left;width:260px}.d-section-map .first-item,.d-section-theme .first-item{margin-right:160px}.hover-shadow{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out}.hover-shadow:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-extension-container h2{color:#293c55;margin-bottom:5px}#download-extension-container p{margin:5px 0}#builder .warn{color:#e43c59;margin-top:10px;font-size:16px;line-height:25px}#builder ul{margin:0px;padding:0px}#builder li{list-style:none}#title h1 span{margin-left:20px;font-size:34px;color:#888;font-weight:100}#title .download-version{margin:5px;font-size:18px;font-weight:bold}#configuration{width:1000px;margin:0 auto}#configuration p.desc{color:#6b7a89;font-size:16px}#configuration h3{font-family:noto-thin;margin:26px 0}#configuration>section{border-bottom:1px solid #e5e5e5;text-align:left}#configuration>section p{margin:20px 0}#configuration h3{margin:10px 0;color:#3c485c;font-size:26px;font-weight:normal}#configuration h3 span{font-size:16px;margin-left:5px}#configuration ul{margin:10px}#configuration li{display:inline-block;vertical-align:top;margin:20px 18px;text-align:center;width:120px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}#configuration li input{display:none}#configuration li img{margin-top:5px;width:90px;height:90px;padding:5px 10px}#configuration li h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#configuration li h5 span{font-size:12px;margin-left:3px}#configuration li:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}#configuration li.checked{-webkit-box-shadow:0px 0px 15px #293c55;box-shadow:0px 0px 15px #293c55;border:1px solid rgba(41,60,85,0.6)}#configuration li.checked h5::before{content:'';width:15px;height:15px;background-size:15px 15px;background-image:url(../images/builder/checked.png);display:inline-block;position:absolute;right:0;top:-105px}#other input{margin:0 10px 0 0;vertical-align:middle}#other label{font-size:16px}#other p.desc{font-size:14px;padding-left:10px}#other a{color:black}#other .other-option{margin-left:15px}#action{margin-top:50px;margin-bottom:100px;text-align:center}#email{border:1px solid #ccc;border-radius:20px;line-height:2em;width:250px;padding:5px 20px;outline:none;margin-top:20px}#build{margin-top:20px}.clear{clear:both}#about-page{margin-top:60px;text-align:center}#about-page section{padding:40px 15px}#about-page .contributor{max-width:800px}#about-page h3{margin-bottom:20px}#about-page p{color:#888;margin:5px 0}#about-page h4.group{text-align:left;border-left:4px solid;padding-left:15px}#about-page h4.group.mentors{margin:0px 0 10px 0;border-color:#E86C4B}#about-page h4.group.code{margin:40px 0 10px 0;border-color:#40A7DC}#about-page h4.group.contributor{margin:40px 0 40px 0;border-color:#40A7DC}#about-page h4.group.companie{margin:40px 0 40px 0;border-color:#58A77C}#about-page h5{margin:5px 0;font-weight:bold}#about-page .about-person{margin:20px 0;height:150px}#about-page .about-person>a{display:inline-block;height:90px}#about-page .about-person>a img{height:88px}#about-page .about-person>a:hover img{-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);border-color:white}#about-page .about-person img{display:block;margin:0 auto;margin-bottom:10px;width:90px;border-radius:50%;border:4px solid white;border-color:transparent;-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0);box-shadow:0 4px 9px 0 rgba(46,37,37,0);-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s;-webkit-transition-timing-function:ease-in-out;-o-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}#about-page .about-person .about-desc{color:#888}#about-page .about-person.wait-for-you img{border:1px solid #ececec;padding:10px;margin-bottom:20px}#about-page .company{border-top:1px solid rgba(78,97,118,0.25);max-width:800px}#about-page .company h3{margin-bottom:40px}#about-page .company .col-md-3{height:80px}#about-send-logo{margin:20px 0 50px 0}#about-send-logo p{margin-top:10px}.not-found{padding:150px 0 160px;height:100%;background-color:#2a3c54;overflow:hidden}.not-found img{display:block;width:60%;margin:0 auto}.not-found .text{margin-top:50px;text-align:center;font-size:20px;color:#fff}.not-found .link{margin-left:10px;color:#3183c6}@media (max-width: 768px){.not-found .text{padding:0 15px;font-size:14px}}#maps .links{text-align:center}#maps .links a{display:inline-block;margin:0 5px}#maps h3{margin-top:20px}#maps h3 span{font-size:0.7em;display:inline-block;margin:0 4px}#maps h5{text-align:center}#maps .province{margin-top:10px;margin-bottom:10px}#maps #map-list{padding-bottom:40px}#maps section p{margin-bottom:0;color:#6b7a89}#map-example{margin-top:30px;margin-bottom:100px;line-height:2em;font-size:14px}#map-example h4{margin:20px 0 10px 0}#map-example .prettyprint{padding:10px;border:#ccc 1px solid}#themes{max-width:800px}#themes p.desc{color:#888}#themes h1{text-align:center}#themes h3 span{font-size:16px;margin-left:5px}#themes .theme{text-align:center}#themes .theme img{margin-top:20px;width:285px;-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out;cursor:pointer}#themes .theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#theme-configure-section{margin-top:40px}#theme-example{margin:50px 0 80px 0;line-height:2em;font-size:14px}#theme-example h4{margin:20px 0 10px 0}#theme-example .prettyprint{padding:10px;border:#ccc 1px solid}#theme-builder{margin:30px 0;text-align:center}#changelog{width:700px;margin:0 auto;margin-top:100px;margin-bottom:100px;font-family:'Microsoft Yahei'}#changelog p.desc{margin:10px 0}#changelog p{font-weight:normal}#changelog .time{color:#888;float:right;margin-top:-35px;margin-right:10px}#changelog h2{margin-top:50px;border-bottom:1px solid #ccc;padding-bottom:5px;margin-bottom:10px}#changelog strong{color:#c12c2c}#changelog strong a{color:#3cafa4}#changelog>ul{margin-left:-10px}#changelog li{margin:10px 0;padding:0 20px}#changelog pre{margin:10px 20px;border:none}#ec-doc-main{position:absolute;left:0;right:0;top:0;bottom:0}@media (max-width: 600px){#ec-doc-main{-webkit-overflow-scrolling:touch;position:static}#ec-doc-nav{position:static;margin-bottom:0}}#extension{margin-bottom:-40px}#extension .nav-container{text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);height:43px}#extension .nav-tabs{display:inline-block;border-bottom:none}#extension .nav-tabs li>a{border:none;color:#293c55}#extension .nav-tabs li>a:hover{background:transparent}#extension .nav-tabs li.active>a{color:#a9334c;border-bottom:4px solid #a9334c}#extension .tab-content{margin:40px 0}.extension{margin:10px 0 40px 0}.extension-content{-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.1);border-radius:4px}.extension-head{display:block}.extension-img{width:100%}.extension-info{padding:10px 15px;height:132px;overflow:hidden}@media (min-width: 992px){.extension-info:lang(en){height:195px}.extension-info:lang(zh){height:155px}}@media (min-width: 768px){.extension-info:lang(en){height:215px}}.extension-name{font-size:18px}.extension-author{margin-bottom:5px}.extension-author-name{display:inline-block;margin-right:5px}.extension-author-name+.extension-author-name{opacity:0.5}#submit-extension{text-align:center;padding-top:60px;padding-bottom:40px;background:#F4F7FC}#submit-extension h3{margin-bottom:10px}#submit-extension p{margin:2px 0;color:#6b7a89}#submit-extension a.btn{margin:20px 0 5px 0}#faq-page .page-detail li{margin:10px 0;list-style:circle}#maillist ul{list-style:circle;font-size:16px;padding-left:40px}#maillist li{margin:10px 0}#cheat-selector{margin-bottom:20px}#cheat-selector .selected .btn{background-color:#293c55;border-color:#162436;color:white}#cheat-chart{width:100%;height:400px}#cheat-detail{min-height:100px}#cheat-detail .desc{margin:10px 0 20px 0;font-size:14px;color:#555}.page-cheatsheet h2{font-size:22px;margin-top:30px;margin-bottom:10px}.page-cheatsheet h2:first-child{margin-top:0}.cheat-chart-item{display:inline-block;vertical-align:top;margin:20px 11px;text-align:center;width:120.5px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}.cheat-chart-item:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}.cheat-chart-item a{text-decoration:none}.cheat-chart-item img{margin-top:5px;width:90px;height:90px;padding:5px 10px}.cheat-chart-item h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#apache-banner{position:fixed;left:0;right:0;bottom:0;padding:20px 40px 0;z-index:10000;background-color:rgba(0,0,0,0.6);color:#fff;display:none}#apache-banner .txt{width:80%;height:100%;display:inline-block}#apache-banner p{margin:5px 0}#apache-banner p a{color:#fff;text-decoration:underline}#apache-banner .btn{position:relative;bottom:20px;width:20%;height:100%;display:inline-block;background-color:#a9334c;border-radius:6px;color:#fff;padding:10px}#apache-banner .btn:hover{-webkit-box-shadow:none;box-shadow:none}#apache-banner .close-btn{position:absolute;padding:5px;right:15px;top:15px;color:#fff}#apache-banner .close-btn:hover{text-decoration:none}@media (max-width: 768px){#apache-banner{padding:15px}#apache-banner .txt{width:100%;height:auto;display:block;margin-top:20px}#apache-banner .btn{width:100%;height:auto;display:block;top:0}#apache-banner .close-btn{top:10px}}.pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pace-inactive{display:none}.pace .pace-progress{background:#e43c59;position:fixed;z-index:100000;top:0;right:100%;width:100%;height:2px}.pace .pace-progress-inner{display:block;position:absolute;right:0px;width:100px;height:100%;-webkit-box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;opacity:1.0;-webkit-transform:rotate(3deg) translate(0px, -4px);-ms-transform:rotate(3deg) translate(0px, -4px);transform:rotate(3deg) translate(0px, -4px)}.btn-main{border-radius:20px;padding:8px 50px;-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s}.btn-main+.btn{margin-left:15px}.btn-main img{width:20px;margin-right:10px;margin-top:-2px;margin-left:-5px}.btn-main:hover{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-main:focus,.btn-main:active{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-thirdary{width:180px;-webkit-box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);background-color:#3FA5DC;padding:9px 10px;color:white;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.btn-thirdary:hover{color:white;background-color:#45B4E8}.btn-thirdary:focus,.btn-thirdary:active{color:white;background-color:#2997D6}.btn-blue{background-color:#47ACE3;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4)}.btn-blue:hover{background-color:#46B5F1;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-blue:focus{background-color:#2E9FDC;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-red{background-color:#FF424F;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4);box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4)}.btn-red:hover{background-color:#FF4F4B;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-red:focus{background-color:#EE2A38;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-green{background-color:#80BB6A;color:white}.btn-green:hover,.btn-green:focus{background-color:#95CC81;color:white;-webkit-box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4);box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4)}.btn-index-home{background-color:transparent;border:1px solid white;color:white}.btn-index-home:hover,.btn-index-home:focus{background-color:white;color:#333743;-webkit-box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3);box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3)}.btn-default{background-color:white;color:#40A7DC;border:1px solid #40A7DC}.btn-default:hover,.btn-default:focus{background-color:#40A7DC;color:white;border:1px solid #40A7DC}.btn-group{margin:0 5px}.btn-group .caret{margin-left:5px}::-webkit-scrollbar{height:8px;width:8px;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-button{display:none}::-webkit-scrollbar-thumb{width:8px;min-height:15px;background:rgba(50,50,50,0.3) !important;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.5) !important}
+@font-face{font-family:'iconfont';src:url("font/iconfont.eot");src:url("font/iconfont.eot?#iefix") format("embedded-opentype"),url("font/iconfont.woff") format("woff"),url("font/iconfont.ttf") format("truetype"),url("font/iconfont.svg#iconfont") format("svg")}.iconfont{font-family:"iconfont" !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{height:100%}body{font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif}#lowie-main{display:none}.lower-ie #main{display:none}.lower-ie #lowie-main{display:block;height:100%;width:100%;padding:200px 0 100px;background-color:#2a3c54}.lower-ie #lowie-main img{display:block;width:60%;margin:0 auto}.navbar-default{border:none;background-color:#293c55;z-index:10000;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;height:50px}.navbar-default .navbar-nav{-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear}.navbar-default .navbar-nav li{position:relative}.navbar-default .navbar-nav li a{color:rgba(255,255,255,0.45);background-color:none !important;padding:15px 20px;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color;font-size:14px}.navbar-default .navbar-nav li a:before{content:'';position:absolute;left:50%;right:50%;top:0;background:#a9334c;height:4px;-webkit-transition-property:'left, right';-o-transition-property:'left, right';transition-property:'left, right';-webkit-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.navbar-default .navbar-nav li a:hover,.navbar-default .navbar-nav li a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li a:hover:before,.navbar-default .navbar-nav li a:focus:before{left:0;right:0}.navbar-default .navbar-nav li a .iconfont{font-size:12px}.navbar-default .navbar-nav li a .new{display:inline-block;padding:2px 5px;background-color:#a9334c;color:#fff;font-size:12px;border-radius:3px;-webkit-transform:scale(0.65);-ms-transform:scale(0.65);transform:scale(0.65)}.navbar-default .navbar-nav li.open{background-color:#162436;color:#fff}.navbar-default .navbar-nav li.open>a:focus,.navbar-default .navbar-nav li.open>a:hover{color:#eee;background-color:#162436}.navbar-default .navbar-nav li.active>a{padding-top:11px;border-top:4px solid #a9334c;color:#fff;background-color:#0e151f;-webkit-transition:0.5s background-color;-o-transition:0.5s background-color;transition:0.5s background-color}.navbar-default .navbar-nav li.active>a:before{display:none}.navbar-default .navbar-nav li.active>a:hover,.navbar-default .navbar-nav li.active>a:focus{color:#f9f9f9;background-color:#162436}.navbar-default .navbar-nav li .dropdown-menu{width:250px;padding:0;background-color:#162436;-webkit-box-shadow:none;box-shadow:none;border:none}.navbar-default .navbar-nav li .dropdown-menu li{background-color:#162436;border-top:none;padding:5px 0}.navbar-default .navbar-nav li .dropdown-menu li a{padding:8px 20px}.navbar-default .navbar-nav li .dropdown-menu li:hover,.navbar-default .navbar-nav li .dropdown-menu li:focus{background-color:#a9334c}.navbar-default .navbar-nav li .dropdown-menu li:hover a,.navbar-default .navbar-nav li .dropdown-menu li:focus a{background-color:#a9334c}.navbar-default .navbar-nav li ul a:before{display:none}.navbar-default .navbar-logo{height:32px;margin-top:-6px;margin-left:-2px}.navbar-default .navbar-collapse{border-top:none}.navbar-default .navbar-toggle{padding:1px 5px;margin:7px 16px 0 0;border-color:#384E6B;background-color:#384E6B}.navbar-default .navbar-toggle .icon-bar{margin:7px 0 !important;height:1px;background-color:#fff}.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{border-color:#384E6B;background-color:#384E6B}.container-fluid{padding-left:25px}#menu-btn{display:none;float:right;height:45px;line-height:45px;margin:5px 20px 0 0;font-size:30px;color:#fff;cursor:pointer}.navbar-bg{background-color:rgba(41,60,85,0.3);-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-property:background-color, opacity;-o-transition-property:background-color, opacity;transition-property:background-color, opacity}.navbar-bg:hover{background-color:rgba(41,60,85,0.8)}.navbar-bg .navbar-nav li a{color:#fff}.navbar-bg .navbar-nav li.active a{color:#fff;background-color:transparent}.navbar-bg .navbar-nav #nav-apache{opacity:1}#nav-apache{margin-left:10px;margin-right:10px;opacity:0.6}#nav-apache:hover{opacity:1}#nav-apache a{padding:10px 15px}#nav-apache a img{width:127px;height:30px}.icon-external-link{position:relative;top:2px;left:5px;opacity:0.5}@media (max-width: 768px){.navbar-default .navbar-nav{background-color:#293c55;-webkit-transition:background-color 0.5s linear;-o-transition:background-color 0.5s linear;transition:background-color 0.5s linear;margin-top:0;margin-bottom:0}.navbar-default .navbar-nav .open .dropdown-menu{padding:0}.navbar-default .navbar-nav .open .dropdown-menu li a{color:#fff}.navbar-default .navbar-nav li.active>a{border-left:4px solid #a9334c;border-top:none;padding:10px 15px 10px 11px}#menu-btn{display:block}#nav-download{display:none}}@media (max-width: 992px) and (min-width: 768px){.navbar-default .navbar-nav li a{padding:15px 15px}}.page-main{position:absolute;left:0;right:0;top:50px;bottom:0;overflow-y:auto}.doc-version-change{position:absolute;top:70px;right:50px;z-index:100}.doc-version-change a{display:inline-block;margin-left:20px}.section-bg{background:#F4F7FC;padding:10px 0}.d-section.last-section{margin-bottom:30px;border-bottom:0}.page-info{margin-bottom:30px;text-align:center;padding:40px;color:#4e6167;background:#F4F7FC}.page-info h1{margin-bottom:5px;font-size:40px;font-weight:bold;color:#333}.page-info p{font-size:16px}.page-info-echarts{font-size:12px;margin-top:15px;color:#8E99AB}.page-content{min-height:300px;padding-bottom:40px;font-size:16px;line-height:22px}.page-content h2{color:#a9334c;padding-bottom:15px;border-bottom:1px solid #ddd;margin-top:40px;margin-bottom:20px}.page-content h2:first-child{margin-top:0}.page-content h3{margin:30px 0 10px 0}.page-content p{margin:10px 0}.page-content section{padding:40px 0;text-align:center}.page-content ul{padding-left:30px}.page-content li{margin:5px 0;list-style:disc}.page-nav{position:fixed;overflow:auto;width:200px;top:260px;bottom:0;margin:0 0 0 30px;padding:0 0 20px 0}.page-nav h4{margin:10px 0;color:#666;font-size:14px;padding-left:10px}.page-nav h4:first-child{margin-top:0}.page-nav h4.inner{margin:0;padding-left:0;font-size:18px}.page-nav a{border-left:1px solid rgba(78,97,103,0.25);color:#999;padding:7px 10px;display:block;position:relative}.page-nav a:before{content:'';position:absolute;top:50%;bottom:50%;background:#a9334c;width:3px;left:-1px;-webkit-transition-property:'top, bottom';-o-transition-property:'top, bottom';transition-property:'top, bottom';-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.page-nav a:hover{text-decoration:none;color:#333}.page-nav a:hover:before{top:0;bottom:0}.page-nav a.active{color:#a9334c}.page-nav .slide-btn{display:none}.page-detail{margin-left:220px;margin-bottom:20px;padding:0 40px 0 40px;overflow-x:hidden}.page-detail h2{margin:10px 0;padding-top:20px;font-size:22px}.page-detail h2:first-child{margin-top:0;padding-top:0}.page-detail h2+h3{margin-top:20px}.page-detail h3{margin:40px 0 15px 0;font-size:18px}.page-detail p{margin:15px 0}.page-detail li{padding-left:0}.page-detail li li{padding-left:20px;margin:5px 0}.page-detail .time{float:right;position:relative;top:-35px}@media screen and (max-device-width: 600px){.page-content.single-page{position:static}.page-content.slide-up .page-nav ul{display:none}.page-info{text-align:left;padding:15px;margin-bottom:10px}.page-info h1{margin-bottom:10px}.page-nav{position:static}.page-nav .slide-btn{display:block;color:#e43c59;position:absolute;right:20px;margin-top:10px}.page-detail{position:static;margin-left:0;padding:0 15px}.page-detail h2{padding-top:20px}.page-detail h2:first-child{padding-top:0}}#download-extension-container{max-width:800px}#download-extension-container .row{margin-top:40px;margin-bottom:40px}#reference{padding:90px 0 140px 0;text-align:center}footer{min-height:236px;background-color:#293c55;color:#808795;font-size:14px}footer.inner-footer{background-color:transparent;border-top:1px solid #eee;margin-top:40px;color:#aaa;font-size:12px}footer.inner-footer .container{padding:0}footer.inner-footer p{line-height:20px}footer.inner-footer .row{margin-top:20px !important}footer.inner-footer #footer-icon-panel{text-align:left}footer.inner-footer #footer-icon-panel img{margin-top:20px;width:250px}footer .row{margin-top:50px !important;margin-bottom:0 !important}footer .logo img{display:block;margin-bottom:20px;width:109px}footer .footer-apache-logo{width:300px;max-width:80%;margin:0 0 10px 0}footer #efe-product li{width:50%;display:inline-block}footer #echarts-copyright{color:rgba(255,255,255,0.4);margin:65px 0 20px 0;font-size:1.2rem}footer h3{color:#fff;font-size:1.5rem;margin:10px 0}footer ul{height:150px}footer ul dt{width:50%;float:left;font-weight:300}footer ul li{font-weight:300}footer ul a{color:rgba(255,255,255,0.4);font-size:1.2rem;margin:5px 0}footer ul a:hover{color:rgba(255,255,255,0.8)}footer #footer-icon-panel{text-align:right;font-weight:300;float:right}footer .footer-icon{display:inline-block;width:40px;height:40px;border-radius:50px;margin:5px 0 5px 10px;padding:8px 10px;border:1px solid white}@media (max-width: 992px){footer .footer-apache-logo{margin:10px -30px 0 0}footer .icon-panel{margin:-20px -50px 20px 0;text-align:center}footer #echarts-copyright{margin:20px 0;text-align:center}footer .footer-icon{margin:30px 5px 5px 5px}}@media (max-width: 768px){footer .logo img{margin:0 auto}footer #footer-icon-panel{text-align:center}footer #echarts-copyright{text-align:center}}html{overflow-x:hidden}body{width:100%;overflow-x:hidden;background-color:#fff}#page-index{top:0}#main-content{color:#9297A3;font-weight:300}#main-content h1,#main-content h2,#main-content h3,#main-content h4,#main-content h5,#main-content h6{color:#333743;font-weight:400}#main-content p{font-weight:300}#main-content footer{font-weight:400 !important}#main-content footer h3{color:white}#main-content #home-section{position:relative;background-color:white}#main-content #home-section .btn{letter-spacing:10px;-webkit-box-shadow:2px 4px 4px rgba(0,0,0,0.2);box-shadow:2px 4px 4px rgba(0,0,0,0.2);text-shadow:0 2px 4px rgba(0,0,0,0.5)}#main-content #home-section .btn:hover{text-shadow:none}#main-content #video-index{width:100%}#main-content #home-logo{width:1000px;max-width:95%}#main-content .video-btn{width:60px;height:60px;position:absolute;padding-top:18px;border-radius:50%;background-color:#fff;text-align:center;cursor:pointer;z-index:100}#main-content .video-index-btn{bottom:55px;left:70px}#main-content .video-play-btn{padding-left:4px}#main-content .video-pause-btn{display:none}@-webkit-keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}@keyframes fx-plyr-play-button{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}to{opacity:0}}#main-content #video-index-play:before{-webkit-animation:fx-plyr-play-button 1.5s ease-out infinite;animation:fx-plyr-play-button 1.5s ease-out infinite;border:4px solid #fff;border-radius:150%;-webkit-box-shadow:0 0 5px #fff;box-shadow:0 0 5px #fff;-webkit-box-sizing:border-box;box-sizing:border-box;content:"";height:150%;left:-25%;position:absolute;top:-25%;width:150%}#main-content .feature-play-btn{-webkit-transform:scale(0.7);-ms-transform:scale(0.7);transform:scale(0.7)}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:5%;bottom:6%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:25%}#main-content .main-bg{width:100%;position:absolute;z-index:10;top:0;bottom:5px}#main-content .banner-section{position:relative;margin-top:-5px}#main-content .banner-section a{display:block;text-align:center}#main-content .banner-img{width:100%}#main-content h2{margin:35px 0 5px 0}#main-content .feature-btn{margin-top:40px}#main-content .feature-btn a{color:#40A7DC}#main-content .feature-btn .more-icon{display:inline-block;margin-left:8px;padding-top:2px}#main-content .row{margin:40px 0}#main-content .right-column{text-align:right}#main-content section.normal{padding-top:50px;padding-bottom:50px;text-align:center}#main-content .btn-panel{margin-top:30px;text-align:center}#main-content .btn-panel .btn{width:140px;padding:9px;margin-left:0;margin-right:36px;border-radius:25px;text-indent:10px}#efe-more{margin-top:-10px}#reference{font-size:1.6rem;font-weight:400;line-height:2.4rem;text-align:center;background-image:url("../images/map.png");background-repeat:no-repeat;background-position:center center;background-size:contain;color:#333}#reference #recommends{height:160px;position:relative;max-width:90%;width:600px;margin:0 auto;text-align:center}#reference .recommend{display:none;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;position:absolute;bottom:0;width:100%}#reference .recommend.active{display:block}#reference .recommend p{margin:10px auto;font-size:20px;font-weight:400;color:#333}#reference .recommend p:before{display:inline-block;content:'';width:41px;height:37px;background-image:url("../images/yinhao.png");background-size:100%;margin-right:20px}#reference .person{margin:10px 0 20px 0;color:#9297A3}#reference .person .name{margin-top:-5px}#reference .people{height:100px}#reference .people img{width:70px;border-radius:50%;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;border-color:white;opacity:0.5;display:inline-block;margin:15px 10px}#reference .people img.active{width:100px;margin:0;-webkit-box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);box-shadow:1px 4px 8px 0 rgba(46,37,37,0.3);border:4px solid white;opacity:1}#main-content #reference{margin-top:100px}.companies{overflow-x:hidden;overflow-y:hidden;width:100%;height:80px;white-space:nowrap;background:white;margin:69px 0 90px 0;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.companies img{padding:15px;height:100%}#home-section{position:relative;overflow:hidden}#home-section .description{position:absolute;top:50%;left:50%;width:1000px;height:200px;margin-top:-100px;margin-left:-500px;z-index:20;color:white;text-align:center}#home-section .description h1{font-size:80px;text-shadow:0 2px 4px rgba(0,0,0,0.5)}#home-section .description p{font-size:15px;color:#eee;text-shadow:1px 1px 2px #333}#feature-section{padding-top:50px}#feature-section .container{max-width:1000px}#feature-section .features{margin-top:20px;margin-bottom:90px;text-align:center}#feature-section .features h3{font-size:22px}#feature-section .features p{margin-top:11px}#feature-section .feature-detail{margin-bottom:20px;position:relative;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}#feature-section .feature-detail>.col{position:relative;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}#feature-section .feature-detail::before,#feature-section .feature-detail::after{content:" ";display:table}#feature-section .feature-detail::after{clear:both}#feature-section .feature-detail h2{font-size:35px;margin-bottom:12px}#feature-section .feature-detail h3{font-size:18px;font-weight:300;color:#9297A3;margin-top:30px}#feature-section .feature-detail h3 ~ h3{margin-top:18px}#feature-section .feature-detail p{font-weight:300;margin-top:8px}#feature-section .feature-detail #col-analysis h2{margin-top:-45px}#feature-section .feature-detail #col-data h2{margin-top:100px}.feature-icon-panel{width:90px;height:90px;margin:0 auto;margin-bottom:22px;padding:27px;border-radius:50%;border:1px solid #F2F2F2}.feature-icon{width:36px}#video-feature-4{width:100%;-webkit-box-shadow:3px 5px 10px rgba(0,0,0,0.43);box-shadow:3px 5px 10px rgba(0,0,0,0.43);border-radius:10px;border:2px solid #000}#video-feature-4 h2 div{margin-bottom:10px}#feature-dimension{top:50px}#video-feature-1{position:absolute;left:13.8%;width:66%;top:7.5%}#publication{margin-top:50px;padding:50px 0;background-color:#f5f7fd}#publication h2{margin-top:10px;font-weight:normal;font-size:28px;line-height:36px}#publication .container{max-width:1000px}#publication p.note{margin-top:10px}#publication p.link{color:#555;margin-top:20px;font-size:18px}#publication p.link a{margin-left:10px}#publication .img-container{padding:50px 10px;background-color:#fff;-webkit-box-shadow:3px 3px 11px #ccc;box-shadow:3px 3px 11px #ccc}#about-section{padding-top:40px;padding-bottom:90px;background-color:#fff}#about-section p{margin-top:12px}#about-section .btn-panel .btn{margin:0 25px;margin-top:10px;margin-bottom:10px}#about-section .btn-panel .btn-red{padding-left:10px}#gongzhonghao{margin:40px 0}#gongzhonghao img{width:150px;-webkit-box-shadow:0px 6px 12px 0 #eee;box-shadow:0px 6px 12px 0 #eee}#about-section a{color:#fff;position:relative;background-color:transparent;width:140px;height:40px;display:inline-block;margin:0 15px}#about-section a:hover{text-decoration:none}.btn-content{border-radius:25px;width:100%;height:100%;padding:10px;padding-left:8px;text-indent:10px;position:relative;z-index:100;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}.btn-content img{margin-right:10px;position:relative;top:-2px}.btn-shadow{display:block;width:136px;height:37px;border-radius:19px;position:absolute;top:2px;left:1px;-webkit-box-shadow:1px 0 9px rgba(187,37,48,0.6);box-shadow:1px 0 9px rgba(187,37,48,0.6);-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}#btn-github .btn-content{background-color:#4D62F6}#btn-github .btn-content:hover{background-color:#7086FF;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content:active{background-color:#4151CA;-webkit-box-shadow:none;box-shadow:none}#btn-github .btn-content img{width:20px;top:-3px}#btn-github .btn-shadow{-webkit-box-shadow:1px 0 9px rgba(52,57,107,0.6);box-shadow:1px 0 9px rgba(52,57,107,0.6)}#btn-github:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(52,57,107,0.7);box-shadow:1px 3px 9px rgba(52,57,107,0.7)}#btn-weibo .btn-content{background-color:#FF414F}#btn-weibo .btn-content:hover{background-color:#FF6060;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content:active{background-color:#D72D3A;-webkit-box-shadow:none;box-shadow:none}#btn-weibo .btn-content.zh{letter-spacing:5px}#btn-weibo .btn-content img{width:22px}#btn-weibo .btn-shadow{-webkit-box-shadow:1px 2px 7px rgba(187,37,48,0.5);box-shadow:1px 2px 7px rgba(187,37,48,0.5)}#btn-weibo:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(187,37,48,0.7);box-shadow:1px 3px 9px rgba(187,37,48,0.7)}#btn-twitter .btn-content{background-color:#00ACED}#btn-twitter .btn-content:hover{background-color:#67CFF6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content:active{background-color:#019CD6;-webkit-box-shadow:none;box-shadow:none}#btn-twitter .btn-content img{width:22px}#btn-twitter .btn-shadow{-webkit-box-shadow:1px 0 7px rgba(11,126,170,0.4);box-shadow:1px 0 7px rgba(11,126,170,0.4)}#btn-twitter:hover .btn-shadow{-webkit-box-shadow:1px 3px 9px rgba(11,126,170,0.7);box-shadow:1px 3px 9px rgba(11,126,170,0.7)}@media (max-width: 992px){#home-section .description{width:80%;left:0;margin-left:10%}#feature-section .feature-detail h2{font-size:30px;margin-top:-15px}#feature-section .feature-detail h3{margin-top:15px}#feature-section .feature-detail p{margin-top:8px}#main-content .feature-btn{margin-top:15px}#col-desktop>*{margin-left:0}#col-data{padding-top:100px}#video-feature-1{width:64%;left:15%}}.mobile{display:none}@media (max-width: 768px){#main-content h2{font-size:24px}#main-content .feature-btn{margin:0 auto;margin-top:50px;text-align:center}.features{margin-bottom:0}.features p{margin-bottom:70px}#feature-section .feature-detail{-webkit-transform:none;-ms-transform:none;transform:none}#feature-section .feature-detail>.col{top:0;-webkit-transform:none;-ms-transform:none;transform:none;text-align:center}#feature-section .feature-detail .col-sm-4{margin-bottom:80px;padding-top:0}#reference{background-size:cover}#reference .people{height:180px}.pc{display:none}.mobile{display:block}}@media (max-width: 480px){#home-section .description{text-align:center;top:40%}#home-section .description .btn{display:block;margin:25px auto}#main-content #home-logo{margin-bottom:20px}#main-content #index-play-btn{display:block;width:120px;height:120px;margin:0 auto}#main-content #home-section .btn{background-color:white;color:#333743;text-shadow:none}#main-content h2{margin-top:20px}#main-content .video-index-btn{left:50%;margin-left:-30px;bottom:40px}#main-content #video-index-play:before{display:none}#main-content #video-feature-4-play,#main-content #video-feature-4-pause{left:9%;bottom:10%}#main-content #video-feature-1-play,#main-content #video-feature-1-pause{left:15%;bottom:20%}#about-section .btn-panel a{display:block;margin:20px auto}}.ch-main{position:relative;margin-top:100px;margin-left:100px}.ch-pc-chart{width:90%;height:280px;border-radius:12px;-webkit-box-shadow:6px 6px 22px #ccc;box-shadow:6px 6px 22px #ccc}.ch-pc-chart div{z-index:50 !important}.ch-mobile{position:absolute;right:0;width:180px;top:-30px;z-index:300}.ch-mobile-box{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ch-mobile-content{position:absolute;overflow:hidden;border-bottom-left-radius:5px;border-bottom-right-radius:5px;left:12%;right:12%;top:16%;bottom:15.5%;background:#333;z-index:300;padding:0;margin:0}.ch-mobile-chart{width:200%;height:200%;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scale(0.5);-ms-transform:scale(0.5);transform:scale(0.5);padding:0;margin:0}.ch-mobile-chart div div{z-index:50 !important}.ch-on-touch .ch-pc-chart{width:auto}.ch-on-touch .ch-mobile{display:none}@media (max-width: 768px){.ch-main{margin-left:0}}@media (max-width: 480px){.ch-main{margin-top:0}}#ec-example-main #left-container{top:71px}h1,h2,h3,h4,h5,h6,h7,p{font-weight:400;margin:0;padding:0}ul{list-style:none;padding:0;margin:0}img{max-width:100%}.clear :after{display:block;content:'';clear:both}iframe{border:1px solid #ccc}#download-table{margin:20px 0}#download-table td{padding:8px;text-align:left}#download-main{max-width:800px}#download-main .d-section{margin-top:20px;padding-top:20px}#download-main h2{font-size:25px;border-bottom:0;text-align:center;color:#293c55;text-align:left}#download-main h3{margin-top:40px;font-size:18px;font-weight:bold;text-align:left}#download-main h3.first{margin-top:-20px}#download-main p{text-align:left}#download-main .center{text-align:center}#download-main h4{margin:10px auto;margin-top:20px;font-size:16px;font-weight:bold;text-align:left}#download-main h4 .warn{color:#A9334C}#download-main .list-wrap{margin:20px 0 0 0}#download-main .d-section-version h2{margin-top:-30px}#download-main .checksum{text-align:left;margin:20px 0;border-left:0;padding:0}#download-main .checksum p,#download-main .checksum li{font-size:14px}#download-main li{list-style:inherit;margin:5px 0}.download-note{margin-top:12px;line-height:20px;font-size:14px;color:#999;text-align:left}.paper-desc{text-align:left;margin:20px -20px;padding:20px;background-color:#f5f7fd}.paper-desc .paper-title{font-size:16px;margin-top:5px;font-weight:bold}.paper-desc .paper-author{font-size:12px;margin:10px 0px;color:#999}.paper-desc .paper-journal{font-size:14px}#download-row{text-align:center}.d-section{padding-top:50px;padding-bottom:25px;text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);color:#6b7a89}.d-section{*zoom:1}.d-section:before,.d-section:after{display:table;line-height:0;content:""}.d-section:after{clear:both}.download-theme img{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.download-theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-main .d-section-version a,#download-main .d-section-gl a{text-decoration:none}#download-main .d-section-version a:hover .circle-wrap,#download-main .d-section-gl a:hover .circle-wrap{color:#fff;background-color:#45B4E8;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version a:active .circle-wrap,#download-main .d-section-version a:focus .circle-wrap,#download-main .d-section-gl a:active .circle-wrap,#download-main .d-section-gl a:focus .circle-wrap{color:#fff;background-color:#2997D6;-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);border-color:transparent}#download-main .d-section-version .mode,#download-main .d-section-gl .mode{display:block;margin:38px 0 2px;font-size:17px}#download-main .d-section-version .text,#download-main .d-section-gl .text{margin-left:-10px;text-align:center;color:#333}#download-main .d-section-version .text span,#download-main .d-section-gl .text span{color:#333;opacity:0.7}.d-section-version{padding-bottom:50px}.d-section-version .row>div{height:220px}#download-main .circle-wrap{width:120px;height:120px;border-radius:50%;background-color:white;border:1px solid rgba(78,97,118,0.2);margin:0 auto;margin-bottom:15px;color:#293c55;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}.more-btn{position:relative;display:block;margin:20px auto;margin-bottom:10px}.more-btn:after{display:block;content:'';width:19px;height:18px;background-image:url("../images/btn-arrow.png");background-size:80% 80%;position:absolute;background-repeat:no-repeat;right:20px;top:13px}.more-btn+p{color:#6b7a89}.btn-two{margin-left:15px;margin-right:15px;margin-bottom:10px;position:relative;text-align:left;padding-left:45px !important}.d-section-map ul,.d-section-theme ul{*zoom:1}.d-section-map ul:before,.d-section-map ul:after,.d-section-theme ul:before,.d-section-theme ul:after{display:table;line-height:0;content:""}.d-section-map ul:after,.d-section-theme ul:after{clear:both}.d-section-map li,.d-section-theme li{float:left;width:260px}.d-section-map .first-item,.d-section-theme .first-item{margin-right:160px}.hover-shadow{-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out}.hover-shadow:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#download-extension-container h2{color:#293c55;margin-bottom:5px}#download-extension-container p{margin:5px 0}#builder .warn{color:#e43c59;margin-top:10px;font-size:16px;line-height:25px}#builder ul{margin:0px;padding:0px}#builder li{list-style:none}#title h1 span{margin-left:20px;font-size:34px;color:#888;font-weight:100}#title .download-version{margin:5px;font-size:18px;font-weight:bold}#configuration{width:1000px;margin:0 auto}#configuration p.desc{color:#6b7a89;font-size:16px}#configuration h3{font-family:noto-thin;margin:26px 0}#configuration>section{border-bottom:1px solid #e5e5e5;text-align:left}#configuration>section p{margin:20px 0}#configuration h3{margin:10px 0;color:#3c485c;font-size:26px;font-weight:normal}#configuration h3 span{font-size:16px;margin-left:5px}#configuration ul{margin:10px}#configuration li{display:inline-block;vertical-align:top;margin:20px 18px;text-align:center;width:120px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}#configuration li input{display:none}#configuration li img{margin-top:5px;width:90px;height:90px;padding:5px 10px}#configuration li h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#configuration li h5 span{font-size:12px;margin-left:3px}#configuration li:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}#configuration li.checked{-webkit-box-shadow:0px 0px 15px #293c55;box-shadow:0px 0px 15px #293c55;border:1px solid rgba(41,60,85,0.6)}#configuration li.checked h5::before{content:'';width:15px;height:15px;background-size:15px 15px;background-image:url(../images/builder/checked.png);display:inline-block;position:absolute;right:0;top:-105px}#other input{margin:0 10px 0 0;vertical-align:middle}#other label{font-size:16px}#other p.desc{font-size:14px;padding-left:10px}#other a{color:black}#other .other-option{margin-left:15px}#action{margin-top:50px;margin-bottom:100px;text-align:center}#email{border:1px solid #ccc;border-radius:20px;line-height:2em;width:250px;padding:5px 20px;outline:none;margin-top:20px}#build{margin-top:20px}.clear{clear:both}#about-page{margin-top:60px;text-align:center}#about-page section{padding:40px 15px}#about-page .contributor{max-width:800px}#about-page h3{margin-bottom:20px}#about-page p{color:#888;margin:5px 0}#about-page h4.group{text-align:left;border-left:4px solid;padding-left:15px}#about-page h4.group.mentors{margin:0px 0 10px 0;border-color:#E86C4B}#about-page h4.group.code{margin:40px 0 10px 0;border-color:#40A7DC}#about-page h4.group.contributor{margin:40px 0 40px 0;border-color:#40A7DC}#about-page h4.group.companie{margin:40px 0 40px 0;border-color:#58A77C}#about-page h5{margin:5px 0;font-weight:bold}#about-page .about-person{margin:20px 0;height:150px}#about-page .about-person>a{display:inline-block;height:90px}#about-page .about-person>a img{height:88px}#about-page .about-person>a:hover img{-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);box-shadow:0 4px 9px 0 rgba(46,37,37,0.3);border-color:white}#about-page .about-person img{display:block;margin:0 auto;margin-bottom:10px;width:90px;border-radius:50%;border:4px solid white;border-color:transparent;-webkit-box-shadow:0 4px 9px 0 rgba(46,37,37,0);box-shadow:0 4px 9px 0 rgba(46,37,37,0);-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s;-webkit-transition-timing-function:ease-in-out;-o-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}#about-page .about-person .about-desc{color:#888}#about-page .about-person.wait-for-you img{border:1px solid #ececec;padding:10px;margin-bottom:20px}#about-page .company{border-top:1px solid rgba(78,97,118,0.25);max-width:800px}#about-page .company h3{margin-bottom:40px}#about-page .company .col-md-3{height:80px}#about-send-logo{margin:20px 0 50px 0}#about-send-logo p{margin-top:10px}.not-found{padding:150px 0 160px;height:100%;background-color:#2a3c54;overflow:hidden}.not-found img{display:block;width:60%;margin:0 auto}.not-found .text{margin-top:50px;text-align:center;font-size:20px;color:#fff}.not-found .link{margin-left:10px;color:#3183c6}@media (max-width: 768px){.not-found .text{padding:0 15px;font-size:14px}}#maps .links{text-align:center}#maps .links a{display:inline-block;margin:0 5px}#maps h3{margin-top:20px}#maps h3 span{font-size:0.7em;display:inline-block;margin:0 4px}#maps h5{text-align:center}#maps .province{margin-top:10px;margin-bottom:10px}#maps #map-list{padding-bottom:40px}#maps section p{margin-bottom:0;color:#6b7a89}#map-example{margin-top:30px;margin-bottom:100px;line-height:2em;font-size:14px}#map-example h4{margin:20px 0 10px 0}#map-example .prettyprint{padding:10px;border:#ccc 1px solid}#themes{max-width:800px}#themes p.desc{color:#888}#themes h1{text-align:center}#themes h3 span{font-size:16px;margin-left:5px}#themes .theme{text-align:center}#themes .theme img{margin-top:20px;width:285px;-webkit-box-shadow:0 0 1px rgba(0,0,0,0.3);box-shadow:0 0 1px rgba(0,0,0,0.3);-webkit-transition:0.5s ease-out;-o-transition:0.5s ease-out;transition:0.5s ease-out;cursor:pointer}#themes .theme img:hover{-webkit-box-shadow:0 0 20px rgba(0,0,0,0.3);box-shadow:0 0 20px rgba(0,0,0,0.3)}#theme-configure-section{margin-top:40px}#theme-example{margin:50px 0 80px 0;line-height:2em;font-size:14px}#theme-example h4{margin:20px 0 10px 0}#theme-example .prettyprint{padding:10px;border:#ccc 1px solid}#theme-builder{margin:30px 0;text-align:center}#changelog{width:700px;margin:0 auto;margin-top:100px;margin-bottom:100px;font-family:'Microsoft Yahei'}#changelog p.desc{margin:10px 0}#changelog p{font-weight:normal}#changelog .time{color:#888;float:right;margin-top:-35px;margin-right:10px}#changelog h2{margin-top:50px;border-bottom:1px solid #ccc;padding-bottom:5px;margin-bottom:10px}#changelog strong{color:#c12c2c}#changelog strong a{color:#3cafa4}#changelog>ul{margin-left:-10px}#changelog li{margin:10px 0;padding:0 20px}#changelog pre{margin:10px 20px;border:none}#ec-doc-main{position:absolute;left:0;right:0;top:0;bottom:0}@media (max-width: 600px){#ec-doc-main{-webkit-overflow-scrolling:touch;position:static}#ec-doc-nav{position:static;margin-bottom:0}}#extension{margin-bottom:-40px}#extension .nav-container{text-align:center;border-bottom:1px solid rgba(78,97,118,0.25);height:52px}#extension .nav-tabs{display:inline-block;border-bottom:none}#extension .nav-tabs li>a{border:none;color:#293c55}#extension .nav-tabs li>a:hover{background:transparent}#extension .nav-tabs li.active>a{color:#a9334c;border-bottom:4px solid #a9334c}#extension .tab-content{margin:40px 0}.extension{margin:10px 0 40px 0}.extension-content{-webkit-box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);box-shadow:0 1px 4px 0 rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.1);border-radius:4px}.extension-head{display:block}.extension-img{width:100%}.extension-info{padding:10px 15px;height:132px;overflow:hidden}@media (min-width: 992px){.extension-info:lang(en){height:195px}.extension-info:lang(zh){height:155px}}@media (min-width: 768px){.extension-info:lang(en){height:215px}}.extension-name{font-size:18px}.extension-author{margin-bottom:5px}.extension-author-name{display:inline-block;margin-right:5px}.extension-author-name+.extension-author-name{opacity:0.5}#submit-extension{text-align:center;padding-top:60px;padding-bottom:40px;background:#F4F7FC}#submit-extension h3{margin-bottom:10px}#submit-extension p{margin:2px 0;color:#6b7a89}#submit-extension a.btn{margin:20px 0 5px 0}#faq-page .page-detail li{margin:10px 0;list-style:circle}#maillist ul{list-style:circle;font-size:16px;padding-left:40px}#maillist li{margin:10px 0}#cheat-selector{margin-bottom:20px}#cheat-selector .selected .btn{background-color:#293c55;border-color:#162436;color:white}#cheat-chart{width:100%;height:400px}#cheat-detail{min-height:100px}#cheat-detail .desc{margin:10px 0 20px 0;font-size:14px;color:#555}.page-cheatsheet h2{font-size:22px;margin-top:30px;margin-bottom:10px}.page-cheatsheet h2:first-child{margin-top:0}.cheat-chart-item{display:inline-block;vertical-align:top;margin:20px 11px;text-align:center;width:120.5px;border:2px solid rgba(0,0,0,0);cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}.cheat-chart-item:hover{-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);box-shadow:0px 0px 10px rgba(0,0,0,0.2)}.cheat-chart-item a{text-decoration:none}.cheat-chart-item img{margin-top:5px;width:90px;height:90px;padding:5px 10px}.cheat-chart-item h5{color:#000;font-weight:normal;margin:10px 0;padding:0;line-height:18px;position:relative}#apache-banner{position:fixed;left:0;right:0;bottom:0;padding:20px 40px 0;z-index:10000;background-color:rgba(0,0,0,0.6);color:#fff;display:none}#apache-banner .txt{width:80%;height:100%;display:inline-block}#apache-banner p{margin:5px 0}#apache-banner p a{color:#fff;text-decoration:underline}#apache-banner .btn{position:relative;bottom:20px;width:20%;height:100%;display:inline-block;background-color:#a9334c;border-radius:6px;color:#fff;padding:10px}#apache-banner .btn:hover{-webkit-box-shadow:none;box-shadow:none}#apache-banner .close-btn{position:absolute;padding:5px;right:15px;top:15px;color:#fff}#apache-banner .close-btn:hover{text-decoration:none}@media (max-width: 768px){#apache-banner{padding:15px}#apache-banner .txt{width:100%;height:auto;display:block;margin-top:20px}#apache-banner .btn{width:100%;height:auto;display:block;top:0}#apache-banner .close-btn{top:10px}}.pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.pace-inactive{display:none}.pace .pace-progress{background:#e43c59;position:fixed;z-index:100000;top:0;right:100%;width:100%;height:2px}.pace .pace-progress-inner{display:block;position:absolute;right:0px;width:100px;height:100%;-webkit-box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;box-shadow:0 0 10px #e43c59,0 0 5px #e43c59;opacity:1.0;-webkit-transform:rotate(3deg) translate(0px, -4px);-ms-transform:rotate(3deg) translate(0px, -4px);transform:rotate(3deg) translate(0px, -4px)}.btn-main{border-radius:20px;padding:8px 50px;-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;transition-duration:0.5s}.btn-main+.btn{margin-left:15px}.btn-main img{width:20px;margin-right:10px;margin-top:-2px;margin-left:-5px}.btn-main:hover{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-main:focus,.btn-main:active{-webkit-box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 12px 0 rgba(25,119,173,0.5)}.btn-thirdary{width:180px;-webkit-box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 3px 8px 0 rgba(25,119,173,0.4);background-color:#3FA5DC;padding:9px 10px;color:white;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s}.btn-thirdary:hover{color:white;background-color:#45B4E8}.btn-thirdary:focus,.btn-thirdary:active{color:white;background-color:#2997D6}.btn-blue{background-color:#47ACE3;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4);box-shadow:1px 4px 8px 0 rgba(25,119,173,0.4)}.btn-blue:hover{background-color:#46B5F1;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-blue:focus{background-color:#2E9FDC;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5);box-shadow:1px 4px 11px 0 rgba(25,119,173,0.5)}.btn-red{background-color:#FF424F;color:white;-webkit-box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4);box-shadow:1px 4px 8px 0 rgba(174,44,53,0.4)}.btn-red:hover{background-color:#FF4F4B;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-red:focus{background-color:#EE2A38;color:white;-webkit-box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5);box-shadow:1px 4px 11px 0 rgba(174,44,53,0.5)}.btn-green{background-color:#80BB6A;color:white}.btn-green:hover,.btn-green:focus{background-color:#95CC81;color:white;-webkit-box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4);box-shadow:1px 3px 8px 0 rgba(76,151,47,0.4)}.btn-index-home{background-color:transparent;border:1px solid white;color:white}.btn-index-home:hover,.btn-index-home:focus{background-color:white;color:#333743;-webkit-box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3);box-shadow:6px 14px 31px 0 rgba(0,0,0,0.3)}.btn-default{background-color:white;color:#40A7DC;border:1px solid #40A7DC}.btn-default:hover,.btn-default:focus{background-color:#40A7DC;color:white;border:1px solid #40A7DC}.btn-group{margin:0 5px}.btn-group .caret{margin-left:5px}::-webkit-scrollbar{height:8px;width:8px;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-button{display:none}::-webkit-scrollbar-thumb{width:8px;min-height:15px;background:rgba(50,50,50,0.3) !important;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;border-radius:2px}::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,0.5) !important}
diff --git a/zh/css/only_for_cdn_ready_check.css b/zh/css/only_for_cdn_ready_check.css
index 577791e..a82e31a 100644
--- a/zh/css/only_for_cdn_ready_check.css
+++ b/zh/css/only_for_cdn_ready_check.css
@@ -1 +1 @@
-/* 1598903776431 OK */
\ No newline at end of file
+/* 1603774175523 OK */
\ No newline at end of file
diff --git a/zh/demo.html b/zh/demo.html
index a119359..1671033 100644
--- a/zh/demo.html
+++ b/zh/demo.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -8,11 +8,11 @@
 }
 </script><title>Examples - Apache ECharts (incubating)</title><script>var chartId = location.hash.slice(1);
 window.location ='./examples/editor.html?c=' + chartId;</script><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/perfect-scrollbar@0.6.8/dist/css/perfect-scrollbar.min.css"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div id="left-chart-nav"><ul></ul></div><div id="nav-mask"></div><div id="nav-layer"><ul class="chart-list"></ul></div><div id="chart-demo"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/perfect-scrollbar@0.6.8/dist/js/min/perfect-scrollbar.min.js"></script><script type="text/javascript">var GALLERY_PATH = 'https://www.echartsjs.com/gallery/';
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div id="left-chart-nav"><ul></ul></div><div id="nav-mask"></div><div id="nav-layer"><ul class="chart-list"></ul></div><div id="chart-demo"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lodash@3.10.1/index.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/perfect-scrollbar@0.6.8/dist/js/min/perfect-scrollbar.min.js"></script><script type="text/javascript">var GALLERY_PATH = 'https://www.echartsjs.com/gallery/';
 var GALLERY_EDITOR_PATH = GALLERY_PATH + 'editor.html?c=';
 var GALLERY_VIEW_PATH = GALLERY_PATH + 'view.html?c=';
 var GALLERY_THUMB_PATH = GALLERY_PATH + 'data/thumb/';
-</script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/config.js?_v_=1598903776431"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/examples-nav.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';
+</script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/config.js?_v_=1603774175523"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/examples-nav.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';
 function encodeHTML(source) {
     return String(source)
         .replace(/&/g, '&amp;')
diff --git a/zh/dependencies.html b/zh/dependencies.html
index f65fb6a..d228b9c 100644
--- a/zh/dependencies.html
+++ b/zh/dependencies.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>依赖项 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/zh/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
-<!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>依赖项</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content"><div class="container"><h2>ZRender</h2><p>Apache ECharts (incubating)<sup>TM</sup> 底层依赖 <a href="https://github.com/ecomfe/zrender">ZRender</a>,一个轻量级的二维绘制库。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>依赖项</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div class="page-content"><div class="container"><h2>ZRender</h2><p>Apache ECharts (incubating)<sup>TM</sup> 底层依赖 <a href="https://github.com/ecomfe/zrender">ZRender</a>,一个轻量级的二维绘制库。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/documents/tutorial-parts/tutorial.js b/zh/documents/tutorial-parts/tutorial.js
index d98256a..b22c35a 100644
--- a/zh/documents/tutorial-parts/tutorial.js
+++ b/zh/documents/tutorial-parts/tutorial.js
@@ -6,7 +6,7 @@
     "desc": "<p>一般来说,可以直接从 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> 中获取构建后的 Apache ECharts (incubating)<sup>TM</sup>,也可以从 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a> 中的 <code class=\"codespan\">echarts/dist</code> 文件夹中获取构建好的 echarts,这都可以直接在浏览器端项目中使用。这些构建好的 echarts 提供了下面这几种定制:</p>\n<ul>\n<li>完全版:<code class=\"codespan\">echarts/dist/echarts.js</code>,体积最大,包含所有的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.all.js</code>。</li>\n<li>常用版:<code class=\"codespan\">echarts/dist/echarts.common.js</code>,体积适中,包含常见的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.common.js</code>。</li>\n<li>精简版:<code class=\"codespan\">echarts/dist/echarts.simple.js</code>,体积较小,仅包含最常用的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.simple.js</code>。</li>\n</ul>\n<p>我们也可以自己构建 echarts,能够仅仅包括自己所需要的图表和组件。可以用这几种方式自定义构建:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/zh/builder.html\" target=\"_blank\">在线自定义构建</a>:比较方便。</li>\n<li>使用 <code class=\"codespan\">echarts/build/build.js</code> 脚本自定义构建:比在线构建更灵活一点,并且支持多语言。</li>\n<li>直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自己构建:也是一种选择。</li>\n</ul>\n<p>下面我们举些小例子,介绍后两种方式。</p>\n<h2 id=\"-echarts\">准备工作:创建自己的工程和安装 echarts</h2>\n<p>使用命令行,创建自己的工程:</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>在 <code class=\"codespan\">myProject</code> 目录下使用命令行,初始化工程的 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> 环境并安装 echarts(这里前提是您已经安装了 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a>):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>通过 npm 安装的 echarts 会出现在 <code class=\"codespan\">myProject/node_modules</code> 目录下,从而可以直接在项目代码中得到 echarts,例如:</p>\n<p>使用 ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>使用 CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>下面仅以使用 ES Module 的方式来举例。</p>\n<h2 id=\"-echarts-\">使用 echarts 提供的构建脚本自定义构建</h2>\n<p>在这个例子中,我们要创建一个饼图,并且想自定义构建一个只含有饼图的 echarts 文件,从而能使 echarts 文件的大小比较小一些。</p>\n<p>echarts 已经提供了构建脚本 <code class=\"codespan\">echarts/build/build.js</code>,基于 <a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> 运行。我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,看到它的使用方式:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>其中我们在这个例子里会用到的参数有:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>:代码入口文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">-o</code>:生成的 bundle 文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">--min</code>:是否压缩文件(默认不压缩),并且去多余的打印错误信息的代码,形成生产环境可用的文件。</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>:是否使用其他语言版本,默认是中文。例如:<code class=\"codespan\">--lang en</code> 表示使用英文,<code class=\"codespan\">--lang my/langXX.js</code> 表示构建时使用 <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> 替代 <code class=\"codespan\">echarts/lib/lang.js</code> 文件。</li>\n<li><code class=\"codespan\">--sourcemap</code>:是否输出 source map,以便于调试。</li>\n<li><code class=\"codespan\">--format</code>:输出的格式,可选 <code class=\"codespan\">&#39;umb&#39;</code>(默认)、<code class=\"codespan\">&#39;amd&#39;</code>、<code class=\"codespan\">&#39;iife&#39;</code>、<code class=\"codespan\">&#39;cjs&#39;</code>、<code class=\"codespan\">&#39;es&#39;</code>。</li>\n</ul>\n<p>既然我们想自定义构建一个只含有饼图的 echarts 文件,我们需要创建一个入口文件,可以命名为 <code class=\"codespan\">myProject/echarts.custom.js</code>,文件里会引用所需要的 echarts 模块:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nexport * from &#39;echarts/src/echarts&#39;;\n// 引入饼图。\nimport &#39;echarts/src/chart/pie&#39;;\n// 在这个场景下,可以引用 `echarts/src` 或者 `echarts/lib` 下的文件(但是不可混用),\n// 参见下方的解释:“引用 `echarts/lib/**` 还是 `echarts/src/**`”。\n</code></pre>\n<p>然后我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,这样开始构建:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js\n</code></pre>\n<p>这样,<code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> 就生成了。我们可以创建 <code class=\"codespan\">myProject/pie.html</code> 来使用它:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- 引入 lib/echarts.custom.min.js --&gt;\n    &lt;script src=&quot;lib/echarts.custom.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // 绘制图表。\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>然后在浏览器里打开 <code class=\"codespan\">myProject/pie.html</code>,就可以看到一个饼图:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"-\">允许被引用的模块</h2>\n<p>在自定义构建中,允许被引用的模块,全声明在 <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> 和 <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a> 中。echarts 和 zrender 源代码中的其他模块,都是 echarts 的内部模块,<strong>不应该去引用</strong>。因为在后续 echarts 版本升级中,内部模块的接口和功能可能变化,甚至模块本身也可能被移除。</p>\n<h2 id=\"-echarts-lib-echarts-src-\">引用 <code class=\"codespan\">echarts/lib/**</code> 还是 <code class=\"codespan\">echarts/src/**</code></h2>\n<ul>\n<li>项目中如果直接引用 echarts 里的一些模块并自行构建,应该使用 <code class=\"codespan\">echarts/lib/**</code> 路径,而不可使用 <code class=\"codespan\">echarts/src/**</code>。</li>\n<li>当使用构建脚本 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle,那么两者可以选其一使用(不可混用),使用 <code class=\"codespan\">echarts/src/**</code> 可以获得稍微小一些的文件体积。</li>\n</ul>\n<blockquote>\n<p>原因是:目前,<code class=\"codespan\">echarts/src/**</code> 中是采用 ES Module 的源代码,<code class=\"codespan\">echarts/lib/**</code> 中是 <code class=\"codespan\">echarts/src/**</code> 编译成为 CommonJS 后的产物(编译成 CommonJS 是为了向后兼容一些不支持 ES Module 的老版本 NodeJS 和 webpack)。\n因为历史上,各个 echarts 扩展、各个用户项目,一直是使用的包路径是 <code class=\"codespan\">echarts/lib/**</code>,所以这个路径不应该改变,否则,可能导致混合使用 <code class=\"codespan\">echarts/src/**</code> 和 <code class=\"codespan\">echarts/lib/**</code> 得到两个不同的 echarts 名空间,造成问题。而使用 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle 时没有涉及这个问题,<code class=\"codespan\">echarts/src/**</code> 中的 ES Module 便于静态分析从而得到稍微小些的文件体积。</p>\n</blockquote>\n<h2 id=\"-rollup-\">直接使用 rollup 自定义构建</h2>\n<p>上文中介绍了如何使用 echarts 提供的脚本 <code class=\"codespan\">echarts/build/build.js</code> 自定义构建。与此并列的另一种选择是,我们直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自定义构建,并且把 echarts 代码和项目代码在构建成一体。在一些项目中可能需要这么做。下面我们仅仅介绍如何使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 来构建。<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> 和 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 与此类同,不赘述。</p>\n<p>首先我们在 <code class=\"codespan\">myProject</code> 目录下使用 npm 安装 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>接下来创建项目 JS 文件 <code class=\"codespan\">myProject/line.js</code> 来绘制图表,内容为:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// 引入折线图。\nimport &#39;echarts/lib/chart/line&#39;;\n// 引入提示框组件、标题组件、工具箱组件。\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// 基于准备好的dom,初始化 echarts 实例并绘制图表。\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>对于不支持 ES Module 的浏览器而言,刚才创建的 <code class=\"codespan\">myProject/line.js</code> 还不能直接被网页引用并在浏览器中运行,需要进行构建。使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 构建前,需要创建它的配置文件 <code class=\"codespan\">myProject/rollup.config.js</code>,内容如下:</p>\n<pre><code class=\"lang-js\">// 这个插件用于在 `node_module` 文件夹(即 npm 用于管理模块的文件夹)中寻找模块。比如,代码中有\n// `import &#39;echarts/lib/chart/line&#39;;` 时,这个插件能够寻找到\n// `node_module/echarts/lib/chart/line.js` 这个模块文件。\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// 用于压缩构建出的代码。\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// 用于多语言支持(如果不需要可忽略此 plugin)。\n// import ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // 入口代码文件,就是刚才所创建的文件。\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        // ecLangPlugin({lang: &#39;en&#39;}),\n        // 消除代码中的 __DEV__ 代码段,从而不在控制台打印错误提示信息。\n        uglify()\n    ],\n    output: {\n        // 以 UMD 格式输出,从而能在各种浏览器中加载使用。\n        format: &#39;umd&#39;,\n        // 输出 source map 便于调试。\n        sourcemap: true,\n        // 输出文件的路径。\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>然后在 <code class=\"codespan\">myProject</code> 目录下使用命令行,构建工程代码 <code class=\"codespan\">myProject/line.js</code>:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p>其中 <code class=\"codespan\">-c</code> 表示让 <code class=\"codespan\">rollup</code> 使用我们刚才创建的 <code class=\"codespan\">myProject/rollup.config.js</code> 文件作为配置文件。</p>\n</blockquote>\n<p>构建生成的 <code class=\"codespan\">myProject/lib/line.min.js</code> 文件包括了工程代码和 echarts 代码,并且仅仅包括我们所需要的图和组件,并且可以在浏览器中使用。我们可以用一个示例页面来测试一下,创建文件 <code class=\"codespan\">myProject/line.html</code>,内容如下:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- 为 echarts 准备一个具备大小(宽高)的Dom。 --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- 引入刚才构建好的文件。 --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>在浏览器里打开 <code class=\"codespan\">myProject/line.html</code> 则会得到如下效果:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"-\">多语言支持</h2>\n<p>上面的例子中能看到,工具箱组件(toolbox)的提示文字是中文。本质上,echarts 图表显示出来的文字,都可以通过 <code class=\"codespan\">option</code> 来定制,改成任意语言。但是如果想“默认就是某种语言”,则需要通过构建来实现。</p>\n<p>在上面的例子中,可以在 <code class=\"codespan\">echarts/build/build.js</code> 的参数中指定语言:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>表示使用内置的英文。此外还可以是 <code class=\"codespan\">--lang fi</code>。</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>表示在构建时使用 <code class=\"codespan\">myProject/my/langXX.js</code> 文件来替换 <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> 文件。这样可以在 <code class=\"codespan\">myProject/my/langXX.js</code> 文件中自定义语言。注意这种方式中,必须指定 <code class=\"codespan\">-o</code> 或者 <code class=\"codespan\">--output</code>。</p>\n<p>另外,上面的 rollup 插件 <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code> 也可以传入同样的参数,实现同样的功能。</p>\n"
   },
   "在 webpack 中使用 ECharts": {
-    "desc": "<p><a href=\"https://webpack.js.org//\" target=\"_blank\">Webpack</a> 是目前比较流行的模块打包工具,你可以在使用 webpack 的项目中轻松的引入和打包 Apache ECharts (incubating)<sup>TM</sup>,这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。</p>\n<h2 id=\"npm-echarts\">npm 安装 ECharts</h2>\n<p>你可以使用如下命令通过 npm 安装 ECharts</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过 npm 上安装的 ECharts 和 zrender 会放在<code class=\"codespan\">node_modules</code>目录下。可以直接在项目代码中 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到 ECharts。</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"-echarts-\">按需引入 ECharts 图表和组件</h2>\n<p>默认使用 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到的是已经加载了所有图表和组件的 ECharts 包,因此体积会比较大,如果在项目中对体积要求比较苛刻,也可以只按需引入需要的模块。</p>\n<p>例如上面示例代码中只用到了柱状图,提示框和标题组件,因此在引入的时候也只需要引入这些模块,可以有效的将打包后的体积从 400 多 KB 减小到 170 多 KB。</p>\n<pre><code class=\"lang-js\">// 引入 ECharts 主模块\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// 引入柱状图\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// 引入提示框和标题组件\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>可以按需引入的模块列表见 <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>对于流行的模块打包工具 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 也是同样的用法,这里就不赘述了。而对于使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 的自定义构建,参见 <a href=\"https://echarts.apache.org/zh/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">自定义构建 ECharts</a>。</p>\n"
+    "desc": "<p><a href=\"https://webpack.js.org/\" target=\"_blank\">Webpack</a> 是目前比较流行的模块打包工具,你可以在使用 webpack 的项目中轻松的引入和打包 Apache ECharts (incubating)<sup>TM</sup>,这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。</p>\n<h2 id=\"npm-echarts\">npm 安装 ECharts</h2>\n<p>你可以使用如下命令通过 npm 安装 ECharts</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过 npm 上安装的 ECharts 和 zrender 会放在<code class=\"codespan\">node_modules</code>目录下。可以直接在项目代码中 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到 ECharts。</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"-echarts-\">按需引入 ECharts 图表和组件</h2>\n<p>默认使用 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到的是已经加载了所有图表和组件的 ECharts 包,因此体积会比较大,如果在项目中对体积要求比较苛刻,也可以只按需引入需要的模块。</p>\n<p>例如上面示例代码中只用到了柱状图,提示框和标题组件,因此在引入的时候也只需要引入这些模块,可以有效的将打包后的体积从 400 多 KB 减小到 170 多 KB。</p>\n<pre><code class=\"lang-js\">// 引入 ECharts 主模块\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// 引入柱状图\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// 引入提示框和标题组件\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>可以按需引入的模块列表见 <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>对于流行的模块打包工具 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 也是同样的用法,这里就不赘述了。而对于使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 的自定义构建,参见 <a href=\"https://echarts.apache.org/zh/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">自定义构建 ECharts</a>。</p>\n"
   },
   "ECharts 基础概念概览": {
     "desc": "<p>本文介绍 Apache ECharts (incubating)<sup>TM</sup> 最基本的名词和概念。</p>\n<h2 id=\"echarts-\">echarts 实例</h2>\n<p>一个网页中可以创建多个 <code class=\"codespan\">echarts 实例</code>。每个 <code class=\"codespan\">echarts 实例</code> 中可以创建多个图表和坐标系等等(用 <code class=\"codespan\">option</code> 来描述)。准备一个 DOM 节点(作为 echarts 的渲染容器),就可以在上面创建一个 echarts 实例。每个 echarts 实例独占一个 DOM 节点。</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"-series-\">系列(series)</h2>\n<p><code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是很常见的名词。在 echarts 里,<code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是指:一组数值以及他们映射成的图。“系列”这个词原本可能来源于“一系列的数据”,而在 echarts 中取其扩展的概念,不仅表示数据,也表示数据映射成为的图。所以,一个 <code class=\"codespan\">系列</code> 包含的要素至少有:一组数值、图表类型(<code class=\"codespan\">series.type</code>)、以及其他的关于这些数据如何映射成图的参数。</p>\n<p>echarts 里系列类型(<code class=\"codespan\">series.type</code>)就是图表类型。系列类型(<code class=\"codespan\">series.type</code>)至少有:<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)、...</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了三个 <code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>):<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图系列)、<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图系列)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图系列),每个系列中有他所需要的数据(<a href=\"option.html#series.data\" target=\"_blank\">series.data</a>)。</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>类同地,下图中是另一种配置方式,系列的数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"-component-\">组件(component)</h2>\n<p>在系列之上,echarts 中各种内容,被抽象为“组件”。例如,echarts 中至少有这些组件:<a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)、<a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a>(极坐标系角度轴)、<a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a>(极坐标系半径轴)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系底板)、<a href=\"option.html#geo\" target=\"_blank\">geo</a>(地理坐标系)、<a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>(数据区缩放组件)、<a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>(视觉映射组件)、<a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a>(提示框组件)、<a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a>(工具栏组件)、<a href=\"option.html#series\" target=\"_blank\">series</a>(系列)、...</p>\n<p>我们注意到,其实系列(<a href=\"option.html#series\" target=\"_blank\">series</a>)也是一种组件,可以理解为:系列是专门绘制“图”的组件。</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了各个组件(包括系列),各个组件就出现在图中。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>注:因为系列是一种特殊的组件,所以有时候也会出现 “组件和系列” 这样的描述,这种语境下的 “组件” 是指:除了 “系列” 以外的其他组件。</p>\n<h2 id=\"-option-\">用 option 描述图表</h2>\n<p>上面已经出现了 <code class=\"codespan\">option</code> 这个概念。echarts 的使用者,使用 <code class=\"codespan\">option</code> 来描述其对图表的各种需求,包括:有什么数据、要画什么图表、图表长什么样子、含有什么组件、组件能操作什么事情等等。简而言之,<code class=\"codespan\">option</code> 表述了:<code class=\"codespan\">数据</code>、<code class=\"codespan\">数据如何映射成图形</code>、<code class=\"codespan\">交互行为</code>。</p>\n<pre><code class=\"lang-js\">// 创建 echarts 实例。\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// 用 option 描述 `数据`、`数据如何映射成图形`、`交互行为` 等。\n// option 是个大的 JavaScript 对象。\nvar option = {\n    // option 每个属性是一类组件。\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // 如果有多个同类组件,那么就是个数组。例如这里有三个 X 轴。\n    xAxis: [\n        // 数组每项表示一个组件实例,用 type 描述“子类型”。\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // 这里有多个系列,也是构成一个数组。\n    series: [\n        // 每个系列,也有 type 描述“子类型”,即“图表类型”。\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// 调用 setOption 将 option 输入 echarts,然后 echarts 渲染图表。\nchart.setOption(option);\n</code></pre>\n<p>系列里的 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 是本系列的数据。而另一种描述方式,系列数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // 数据从 dataset 中取,encode 中的数值是 dataset.source 的维度 index (即第几列)\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"-\">组件的定位</h2>\n<p>不同的组件、系列,常有不同的定位方式。</p>\n<p><br></p>\n<p><strong>[类 CSS 的绝对定位]</strong></p>\n<p><br></p>\n<p>多数组件和系列,都能够基于 <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code> 绝对定位。\n这种绝对定位的方式,类似于 <code class=\"codespan\">CSS</code> 的绝对定位(<code class=\"codespan\">position: absolute</code>)。绝对定位基于的是 echarts 容器 DOM 节点。</p>\n<p>其中,他们每个值都可以是:</p>\n<ul>\n<li>绝对数值(例如 <code class=\"codespan\">bottom: 54</code> 表示:距离 echarts 容器底边界 <code class=\"codespan\">54</code> 像素)。</li>\n<li>或者基于 echarts 容器高宽的百分比(例如 <code class=\"codespan\">right: &#39;20%&#39;</code> 表示:距离 echarts 容器右边界的距离是 echarts 容器宽度的 <code class=\"codespan\">20%</code>)。</li>\n</ul>\n<p>如下图的例子,对 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件(也就是直角坐标系的底板)设置 <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code> 达到的效果。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>我们可以注意到,<code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> 是一组(横向)、<code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> 是另一组(纵向)。这两组没有什么关联。每组中,至多设置两项就可以了,第三项会被自动算出。例如,设置了 <code class=\"codespan\">left</code> 和 <code class=\"codespan\">right</code> 就可以了,<code class=\"codespan\">width</code> 会被自动算出。</p>\n<p><br></p>\n<p><strong>[中心半径定位]</strong></p>\n<p><br></p>\n<p>少数圆形的组件或系列,可以使用“中心半径定位”,例如,<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a>(旭日图)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系)。</p>\n<p>中心半径定位,往往依据 <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a>(中心)、<a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>(半径)来决定位置。</p>\n<p><br></p>\n<p><strong>[其他定位]</strong></p>\n<p><br></p>\n<p>少数组件和系列可能有自己的特殊的定位方式。在他们的文档中会有说明。</p>\n<h2 id=\"-\">坐标系</h2>\n<p>很多系列,例如 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>(热力图)等等,需要运行在 “坐标系” 上。坐标系用于布局这些图,以及显示数据的刻度等等。例如 echarts 中至少支持这些坐标系:<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a>、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a>、<a href=\"option.html#singleAxis\" target=\"_blank\">单轴坐标系</a>、<a href=\"option.html#calendar\" target=\"_blank\">日历坐标系</a> 等。其他一些系列,例如 <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)等等,并不依赖坐标系,能独立存在。还有一些图,例如 <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)等,既能独立存在,也能布局在坐标系中,依据用户的设定而来。</p>\n<p>一个坐标系,可能由多个组件协作而成。我们以最常见的直角坐标系来举例。直角坐标系中,包括有 <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)三种组件。<code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 被 <code class=\"codespan\">grid</code> 自动引用并组织起来,共同工作。</p>\n<p>我们来看下图,这是最简单的使用直角坐标系的方式:只声明了 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 和一个 <code class=\"codespan\">scatter</code>(散点图系列),echarts 暗自为他们创建了 <code class=\"codespan\">grid</code> 并关联起他们:</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>再来看下图,两个 <code class=\"codespan\">yAxis</code>,共享了一个 <code class=\"codespan\">xAxis</code>。两个 <code class=\"codespan\">series</code>,也共享了这个 <code class=\"codespan\">xAxis</code>,但是分别使用不同的 <code class=\"codespan\">yAxis</code>,使用 <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> 来指定它自己使用的是哪个 <code class=\"codespan\">yAxis</code>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>再来看下图,一个 echarts 实例中,有多个 <code class=\"codespan\">grid</code>,每个 <code class=\"codespan\">grid</code> 分别有 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code>,他们使用 <code class=\"codespan\">xAxisIndex</code>、<code class=\"codespan\">yAxisIndex</code>、<code class=\"codespan\">gridIndex</code> 来指定引用关系:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>另外,一个系列,往往能运行在不同的坐标系中。例如,一个 <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)能运行在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a> 、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a> 等各种坐标系中。同样,一个坐标系,也能承载不同的系列,如上面出现的各种例子,<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a> 里承载了 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)等等。</p>\n"
diff --git a/zh/documents/tutorial-parts/tutorial.json b/zh/documents/tutorial-parts/tutorial.json
index cfdb1fe..04f5ee2 100644
--- a/zh/documents/tutorial-parts/tutorial.json
+++ b/zh/documents/tutorial-parts/tutorial.json
@@ -6,7 +6,7 @@
     "desc": "<p>一般来说,可以直接从 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> 中获取构建后的 Apache ECharts (incubating)<sup>TM</sup>,也可以从 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a> 中的 <code class=\"codespan\">echarts/dist</code> 文件夹中获取构建好的 echarts,这都可以直接在浏览器端项目中使用。这些构建好的 echarts 提供了下面这几种定制:</p>\n<ul>\n<li>完全版:<code class=\"codespan\">echarts/dist/echarts.js</code>,体积最大,包含所有的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.all.js</code>。</li>\n<li>常用版:<code class=\"codespan\">echarts/dist/echarts.common.js</code>,体积适中,包含常见的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.common.js</code>。</li>\n<li>精简版:<code class=\"codespan\">echarts/dist/echarts.simple.js</code>,体积较小,仅包含最常用的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.simple.js</code>。</li>\n</ul>\n<p>我们也可以自己构建 echarts,能够仅仅包括自己所需要的图表和组件。可以用这几种方式自定义构建:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/zh/builder.html\" target=\"_blank\">在线自定义构建</a>:比较方便。</li>\n<li>使用 <code class=\"codespan\">echarts/build/build.js</code> 脚本自定义构建:比在线构建更灵活一点,并且支持多语言。</li>\n<li>直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自己构建:也是一种选择。</li>\n</ul>\n<p>下面我们举些小例子,介绍后两种方式。</p>\n<h2 id=\"-echarts\">准备工作:创建自己的工程和安装 echarts</h2>\n<p>使用命令行,创建自己的工程:</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>在 <code class=\"codespan\">myProject</code> 目录下使用命令行,初始化工程的 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> 环境并安装 echarts(这里前提是您已经安装了 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a>):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>通过 npm 安装的 echarts 会出现在 <code class=\"codespan\">myProject/node_modules</code> 目录下,从而可以直接在项目代码中得到 echarts,例如:</p>\n<p>使用 ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>使用 CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>下面仅以使用 ES Module 的方式来举例。</p>\n<h2 id=\"-echarts-\">使用 echarts 提供的构建脚本自定义构建</h2>\n<p>在这个例子中,我们要创建一个饼图,并且想自定义构建一个只含有饼图的 echarts 文件,从而能使 echarts 文件的大小比较小一些。</p>\n<p>echarts 已经提供了构建脚本 <code class=\"codespan\">echarts/build/build.js</code>,基于 <a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> 运行。我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,看到它的使用方式:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>其中我们在这个例子里会用到的参数有:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>:代码入口文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">-o</code>:生成的 bundle 文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">--min</code>:是否压缩文件(默认不压缩),并且去多余的打印错误信息的代码,形成生产环境可用的文件。</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>:是否使用其他语言版本,默认是中文。例如:<code class=\"codespan\">--lang en</code> 表示使用英文,<code class=\"codespan\">--lang my/langXX.js</code> 表示构建时使用 <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> 替代 <code class=\"codespan\">echarts/lib/lang.js</code> 文件。</li>\n<li><code class=\"codespan\">--sourcemap</code>:是否输出 source map,以便于调试。</li>\n<li><code class=\"codespan\">--format</code>:输出的格式,可选 <code class=\"codespan\">&#39;umb&#39;</code>(默认)、<code class=\"codespan\">&#39;amd&#39;</code>、<code class=\"codespan\">&#39;iife&#39;</code>、<code class=\"codespan\">&#39;cjs&#39;</code>、<code class=\"codespan\">&#39;es&#39;</code>。</li>\n</ul>\n<p>既然我们想自定义构建一个只含有饼图的 echarts 文件,我们需要创建一个入口文件,可以命名为 <code class=\"codespan\">myProject/echarts.custom.js</code>,文件里会引用所需要的 echarts 模块:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nexport * from &#39;echarts/src/echarts&#39;;\n// 引入饼图。\nimport &#39;echarts/src/chart/pie&#39;;\n// 在这个场景下,可以引用 `echarts/src` 或者 `echarts/lib` 下的文件(但是不可混用),\n// 参见下方的解释:“引用 `echarts/lib/**` 还是 `echarts/src/**`”。\n</code></pre>\n<p>然后我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,这样开始构建:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js\n</code></pre>\n<p>这样,<code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> 就生成了。我们可以创建 <code class=\"codespan\">myProject/pie.html</code> 来使用它:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- 引入 lib/echarts.custom.min.js --&gt;\n    &lt;script src=&quot;lib/echarts.custom.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // 绘制图表。\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>然后在浏览器里打开 <code class=\"codespan\">myProject/pie.html</code>,就可以看到一个饼图:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"-\">允许被引用的模块</h2>\n<p>在自定义构建中,允许被引用的模块,全声明在 <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> 和 <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a> 中。echarts 和 zrender 源代码中的其他模块,都是 echarts 的内部模块,<strong>不应该去引用</strong>。因为在后续 echarts 版本升级中,内部模块的接口和功能可能变化,甚至模块本身也可能被移除。</p>\n<h2 id=\"-echarts-lib-echarts-src-\">引用 <code class=\"codespan\">echarts/lib/**</code> 还是 <code class=\"codespan\">echarts/src/**</code></h2>\n<ul>\n<li>项目中如果直接引用 echarts 里的一些模块并自行构建,应该使用 <code class=\"codespan\">echarts/lib/**</code> 路径,而不可使用 <code class=\"codespan\">echarts/src/**</code>。</li>\n<li>当使用构建脚本 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle,那么两者可以选其一使用(不可混用),使用 <code class=\"codespan\">echarts/src/**</code> 可以获得稍微小一些的文件体积。</li>\n</ul>\n<blockquote>\n<p>原因是:目前,<code class=\"codespan\">echarts/src/**</code> 中是采用 ES Module 的源代码,<code class=\"codespan\">echarts/lib/**</code> 中是 <code class=\"codespan\">echarts/src/**</code> 编译成为 CommonJS 后的产物(编译成 CommonJS 是为了向后兼容一些不支持 ES Module 的老版本 NodeJS 和 webpack)。\n因为历史上,各个 echarts 扩展、各个用户项目,一直是使用的包路径是 <code class=\"codespan\">echarts/lib/**</code>,所以这个路径不应该改变,否则,可能导致混合使用 <code class=\"codespan\">echarts/src/**</code> 和 <code class=\"codespan\">echarts/lib/**</code> 得到两个不同的 echarts 名空间,造成问题。而使用 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle 时没有涉及这个问题,<code class=\"codespan\">echarts/src/**</code> 中的 ES Module 便于静态分析从而得到稍微小些的文件体积。</p>\n</blockquote>\n<h2 id=\"-rollup-\">直接使用 rollup 自定义构建</h2>\n<p>上文中介绍了如何使用 echarts 提供的脚本 <code class=\"codespan\">echarts/build/build.js</code> 自定义构建。与此并列的另一种选择是,我们直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自定义构建,并且把 echarts 代码和项目代码在构建成一体。在一些项目中可能需要这么做。下面我们仅仅介绍如何使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 来构建。<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> 和 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 与此类同,不赘述。</p>\n<p>首先我们在 <code class=\"codespan\">myProject</code> 目录下使用 npm 安装 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>接下来创建项目 JS 文件 <code class=\"codespan\">myProject/line.js</code> 来绘制图表,内容为:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// 引入折线图。\nimport &#39;echarts/lib/chart/line&#39;;\n// 引入提示框组件、标题组件、工具箱组件。\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// 基于准备好的dom,初始化 echarts 实例并绘制图表。\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>对于不支持 ES Module 的浏览器而言,刚才创建的 <code class=\"codespan\">myProject/line.js</code> 还不能直接被网页引用并在浏览器中运行,需要进行构建。使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 构建前,需要创建它的配置文件 <code class=\"codespan\">myProject/rollup.config.js</code>,内容如下:</p>\n<pre><code class=\"lang-js\">// 这个插件用于在 `node_module` 文件夹(即 npm 用于管理模块的文件夹)中寻找模块。比如,代码中有\n// `import &#39;echarts/lib/chart/line&#39;;` 时,这个插件能够寻找到\n// `node_module/echarts/lib/chart/line.js` 这个模块文件。\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// 用于压缩构建出的代码。\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// 用于多语言支持(如果不需要可忽略此 plugin)。\n// import ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // 入口代码文件,就是刚才所创建的文件。\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        // ecLangPlugin({lang: &#39;en&#39;}),\n        // 消除代码中的 __DEV__ 代码段,从而不在控制台打印错误提示信息。\n        uglify()\n    ],\n    output: {\n        // 以 UMD 格式输出,从而能在各种浏览器中加载使用。\n        format: &#39;umd&#39;,\n        // 输出 source map 便于调试。\n        sourcemap: true,\n        // 输出文件的路径。\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>然后在 <code class=\"codespan\">myProject</code> 目录下使用命令行,构建工程代码 <code class=\"codespan\">myProject/line.js</code>:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p>其中 <code class=\"codespan\">-c</code> 表示让 <code class=\"codespan\">rollup</code> 使用我们刚才创建的 <code class=\"codespan\">myProject/rollup.config.js</code> 文件作为配置文件。</p>\n</blockquote>\n<p>构建生成的 <code class=\"codespan\">myProject/lib/line.min.js</code> 文件包括了工程代码和 echarts 代码,并且仅仅包括我们所需要的图和组件,并且可以在浏览器中使用。我们可以用一个示例页面来测试一下,创建文件 <code class=\"codespan\">myProject/line.html</code>,内容如下:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- 为 echarts 准备一个具备大小(宽高)的Dom。 --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- 引入刚才构建好的文件。 --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>在浏览器里打开 <code class=\"codespan\">myProject/line.html</code> 则会得到如下效果:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"-\">多语言支持</h2>\n<p>上面的例子中能看到,工具箱组件(toolbox)的提示文字是中文。本质上,echarts 图表显示出来的文字,都可以通过 <code class=\"codespan\">option</code> 来定制,改成任意语言。但是如果想“默认就是某种语言”,则需要通过构建来实现。</p>\n<p>在上面的例子中,可以在 <code class=\"codespan\">echarts/build/build.js</code> 的参数中指定语言:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>表示使用内置的英文。此外还可以是 <code class=\"codespan\">--lang fi</code>。</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>表示在构建时使用 <code class=\"codespan\">myProject/my/langXX.js</code> 文件来替换 <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> 文件。这样可以在 <code class=\"codespan\">myProject/my/langXX.js</code> 文件中自定义语言。注意这种方式中,必须指定 <code class=\"codespan\">-o</code> 或者 <code class=\"codespan\">--output</code>。</p>\n<p>另外,上面的 rollup 插件 <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code> 也可以传入同样的参数,实现同样的功能。</p>\n"
   },
   "在 webpack 中使用 ECharts": {
-    "desc": "<p><a href=\"https://webpack.js.org//\" target=\"_blank\">Webpack</a> 是目前比较流行的模块打包工具,你可以在使用 webpack 的项目中轻松的引入和打包 Apache ECharts (incubating)<sup>TM</sup>,这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。</p>\n<h2 id=\"npm-echarts\">npm 安装 ECharts</h2>\n<p>你可以使用如下命令通过 npm 安装 ECharts</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过 npm 上安装的 ECharts 和 zrender 会放在<code class=\"codespan\">node_modules</code>目录下。可以直接在项目代码中 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到 ECharts。</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"-echarts-\">按需引入 ECharts 图表和组件</h2>\n<p>默认使用 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到的是已经加载了所有图表和组件的 ECharts 包,因此体积会比较大,如果在项目中对体积要求比较苛刻,也可以只按需引入需要的模块。</p>\n<p>例如上面示例代码中只用到了柱状图,提示框和标题组件,因此在引入的时候也只需要引入这些模块,可以有效的将打包后的体积从 400 多 KB 减小到 170 多 KB。</p>\n<pre><code class=\"lang-js\">// 引入 ECharts 主模块\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// 引入柱状图\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// 引入提示框和标题组件\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>可以按需引入的模块列表见 <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>对于流行的模块打包工具 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 也是同样的用法,这里就不赘述了。而对于使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 的自定义构建,参见 <a href=\"https://echarts.apache.org/zh/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">自定义构建 ECharts</a>。</p>\n"
+    "desc": "<p><a href=\"https://webpack.js.org/\" target=\"_blank\">Webpack</a> 是目前比较流行的模块打包工具,你可以在使用 webpack 的项目中轻松的引入和打包 Apache ECharts (incubating)<sup>TM</sup>,这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。</p>\n<h2 id=\"npm-echarts\">npm 安装 ECharts</h2>\n<p>你可以使用如下命令通过 npm 安装 ECharts</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过 npm 上安装的 ECharts 和 zrender 会放在<code class=\"codespan\">node_modules</code>目录下。可以直接在项目代码中 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到 ECharts。</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"-echarts-\">按需引入 ECharts 图表和组件</h2>\n<p>默认使用 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到的是已经加载了所有图表和组件的 ECharts 包,因此体积会比较大,如果在项目中对体积要求比较苛刻,也可以只按需引入需要的模块。</p>\n<p>例如上面示例代码中只用到了柱状图,提示框和标题组件,因此在引入的时候也只需要引入这些模块,可以有效的将打包后的体积从 400 多 KB 减小到 170 多 KB。</p>\n<pre><code class=\"lang-js\">// 引入 ECharts 主模块\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// 引入柱状图\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// 引入提示框和标题组件\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>可以按需引入的模块列表见 <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>对于流行的模块打包工具 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 也是同样的用法,这里就不赘述了。而对于使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 的自定义构建,参见 <a href=\"https://echarts.apache.org/zh/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">自定义构建 ECharts</a>。</p>\n"
   },
   "ECharts 基础概念概览": {
     "desc": "<p>本文介绍 Apache ECharts (incubating)<sup>TM</sup> 最基本的名词和概念。</p>\n<h2 id=\"echarts-\">echarts 实例</h2>\n<p>一个网页中可以创建多个 <code class=\"codespan\">echarts 实例</code>。每个 <code class=\"codespan\">echarts 实例</code> 中可以创建多个图表和坐标系等等(用 <code class=\"codespan\">option</code> 来描述)。准备一个 DOM 节点(作为 echarts 的渲染容器),就可以在上面创建一个 echarts 实例。每个 echarts 实例独占一个 DOM 节点。</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"-series-\">系列(series)</h2>\n<p><code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是很常见的名词。在 echarts 里,<code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是指:一组数值以及他们映射成的图。“系列”这个词原本可能来源于“一系列的数据”,而在 echarts 中取其扩展的概念,不仅表示数据,也表示数据映射成为的图。所以,一个 <code class=\"codespan\">系列</code> 包含的要素至少有:一组数值、图表类型(<code class=\"codespan\">series.type</code>)、以及其他的关于这些数据如何映射成图的参数。</p>\n<p>echarts 里系列类型(<code class=\"codespan\">series.type</code>)就是图表类型。系列类型(<code class=\"codespan\">series.type</code>)至少有:<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)、...</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了三个 <code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>):<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图系列)、<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图系列)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图系列),每个系列中有他所需要的数据(<a href=\"option.html#series.data\" target=\"_blank\">series.data</a>)。</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>类同地,下图中是另一种配置方式,系列的数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"-component-\">组件(component)</h2>\n<p>在系列之上,echarts 中各种内容,被抽象为“组件”。例如,echarts 中至少有这些组件:<a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)、<a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a>(极坐标系角度轴)、<a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a>(极坐标系半径轴)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系底板)、<a href=\"option.html#geo\" target=\"_blank\">geo</a>(地理坐标系)、<a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>(数据区缩放组件)、<a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>(视觉映射组件)、<a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a>(提示框组件)、<a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a>(工具栏组件)、<a href=\"option.html#series\" target=\"_blank\">series</a>(系列)、...</p>\n<p>我们注意到,其实系列(<a href=\"option.html#series\" target=\"_blank\">series</a>)也是一种组件,可以理解为:系列是专门绘制“图”的组件。</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了各个组件(包括系列),各个组件就出现在图中。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>注:因为系列是一种特殊的组件,所以有时候也会出现 “组件和系列” 这样的描述,这种语境下的 “组件” 是指:除了 “系列” 以外的其他组件。</p>\n<h2 id=\"-option-\">用 option 描述图表</h2>\n<p>上面已经出现了 <code class=\"codespan\">option</code> 这个概念。echarts 的使用者,使用 <code class=\"codespan\">option</code> 来描述其对图表的各种需求,包括:有什么数据、要画什么图表、图表长什么样子、含有什么组件、组件能操作什么事情等等。简而言之,<code class=\"codespan\">option</code> 表述了:<code class=\"codespan\">数据</code>、<code class=\"codespan\">数据如何映射成图形</code>、<code class=\"codespan\">交互行为</code>。</p>\n<pre><code class=\"lang-js\">// 创建 echarts 实例。\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// 用 option 描述 `数据`、`数据如何映射成图形`、`交互行为` 等。\n// option 是个大的 JavaScript 对象。\nvar option = {\n    // option 每个属性是一类组件。\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // 如果有多个同类组件,那么就是个数组。例如这里有三个 X 轴。\n    xAxis: [\n        // 数组每项表示一个组件实例,用 type 描述“子类型”。\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // 这里有多个系列,也是构成一个数组。\n    series: [\n        // 每个系列,也有 type 描述“子类型”,即“图表类型”。\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// 调用 setOption 将 option 输入 echarts,然后 echarts 渲染图表。\nchart.setOption(option);\n</code></pre>\n<p>系列里的 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 是本系列的数据。而另一种描述方式,系列数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // 数据从 dataset 中取,encode 中的数值是 dataset.source 的维度 index (即第几列)\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"-\">组件的定位</h2>\n<p>不同的组件、系列,常有不同的定位方式。</p>\n<p><br></p>\n<p><strong>[类 CSS 的绝对定位]</strong></p>\n<p><br></p>\n<p>多数组件和系列,都能够基于 <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code> 绝对定位。\n这种绝对定位的方式,类似于 <code class=\"codespan\">CSS</code> 的绝对定位(<code class=\"codespan\">position: absolute</code>)。绝对定位基于的是 echarts 容器 DOM 节点。</p>\n<p>其中,他们每个值都可以是:</p>\n<ul>\n<li>绝对数值(例如 <code class=\"codespan\">bottom: 54</code> 表示:距离 echarts 容器底边界 <code class=\"codespan\">54</code> 像素)。</li>\n<li>或者基于 echarts 容器高宽的百分比(例如 <code class=\"codespan\">right: &#39;20%&#39;</code> 表示:距离 echarts 容器右边界的距离是 echarts 容器宽度的 <code class=\"codespan\">20%</code>)。</li>\n</ul>\n<p>如下图的例子,对 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件(也就是直角坐标系的底板)设置 <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code> 达到的效果。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>我们可以注意到,<code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> 是一组(横向)、<code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> 是另一组(纵向)。这两组没有什么关联。每组中,至多设置两项就可以了,第三项会被自动算出。例如,设置了 <code class=\"codespan\">left</code> 和 <code class=\"codespan\">right</code> 就可以了,<code class=\"codespan\">width</code> 会被自动算出。</p>\n<p><br></p>\n<p><strong>[中心半径定位]</strong></p>\n<p><br></p>\n<p>少数圆形的组件或系列,可以使用“中心半径定位”,例如,<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a>(旭日图)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系)。</p>\n<p>中心半径定位,往往依据 <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a>(中心)、<a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>(半径)来决定位置。</p>\n<p><br></p>\n<p><strong>[其他定位]</strong></p>\n<p><br></p>\n<p>少数组件和系列可能有自己的特殊的定位方式。在他们的文档中会有说明。</p>\n<h2 id=\"-\">坐标系</h2>\n<p>很多系列,例如 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>(热力图)等等,需要运行在 “坐标系” 上。坐标系用于布局这些图,以及显示数据的刻度等等。例如 echarts 中至少支持这些坐标系:<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a>、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a>、<a href=\"option.html#singleAxis\" target=\"_blank\">单轴坐标系</a>、<a href=\"option.html#calendar\" target=\"_blank\">日历坐标系</a> 等。其他一些系列,例如 <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)等等,并不依赖坐标系,能独立存在。还有一些图,例如 <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)等,既能独立存在,也能布局在坐标系中,依据用户的设定而来。</p>\n<p>一个坐标系,可能由多个组件协作而成。我们以最常见的直角坐标系来举例。直角坐标系中,包括有 <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)三种组件。<code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 被 <code class=\"codespan\">grid</code> 自动引用并组织起来,共同工作。</p>\n<p>我们来看下图,这是最简单的使用直角坐标系的方式:只声明了 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 和一个 <code class=\"codespan\">scatter</code>(散点图系列),echarts 暗自为他们创建了 <code class=\"codespan\">grid</code> 并关联起他们:</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>再来看下图,两个 <code class=\"codespan\">yAxis</code>,共享了一个 <code class=\"codespan\">xAxis</code>。两个 <code class=\"codespan\">series</code>,也共享了这个 <code class=\"codespan\">xAxis</code>,但是分别使用不同的 <code class=\"codespan\">yAxis</code>,使用 <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> 来指定它自己使用的是哪个 <code class=\"codespan\">yAxis</code>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>再来看下图,一个 echarts 实例中,有多个 <code class=\"codespan\">grid</code>,每个 <code class=\"codespan\">grid</code> 分别有 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code>,他们使用 <code class=\"codespan\">xAxisIndex</code>、<code class=\"codespan\">yAxisIndex</code>、<code class=\"codespan\">gridIndex</code> 来指定引用关系:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>另外,一个系列,往往能运行在不同的坐标系中。例如,一个 <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)能运行在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a> 、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a> 等各种坐标系中。同样,一个坐标系,也能承载不同的系列,如上面出现的各种例子,<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a> 里承载了 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)等等。</p>\n"
diff --git a/zh/documents/tutorial.json b/zh/documents/tutorial.json
index 3cf2e7b..830c958 100644
--- a/zh/documents/tutorial.json
+++ b/zh/documents/tutorial.json
@@ -1 +1 @@
-{"$schema":"https://echarts.apache.org/doc/json-schem","option":{"type":"Object","properties":{"5 分钟上手 ECharts":{"type":["*"],"description":"<h2 id=\"-echarts\">获取 ECharts</h2>\n<p>你可以通过以下几种方式获取 Apache ECharts (incubating)<sup>TM</sup>。</p>\n<ul>\n<li><p>从 <a href=\"https://echarts.apache.org/zh/download.html\" target=\"_blank\">Apache ECharts (incubating) 官网下载界面</a> 获取官方源码包后构建。</p>\n</li>\n<li><p>在 ECharts 的 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a> 获取。</p>\n</li>\n<li><p>通过 npm 获取 echarts,<code class=\"codespan\">npm install echarts --save</code>,详见“<a href=\"tutorial.html#%E5%9C%A8%20webpack%20%E4%B8%AD%E4%BD%BF%E7%94%A8%20ECharts\" target=\"_blank\">在 webpack 中使用 echarts</a>”</p>\n</li>\n<li><p>通过 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">jsDelivr</a> 等 CDN 引入</p>\n</li>\n</ul>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过标签方式直接引入构建好的 echarts 文件</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;!-- 引入 ECharts 文件 --&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;/html&gt;\n</code></pre>\n<h2 id=\"-\">绘制一个简单的图表</h2>\n<p>在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器。</p>\n<pre><code>&lt;body&gt;\n    &lt;!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n&lt;/body&gt;\n</code></pre><p>然后就可以通过 <a href=\"api.html#echarts.init\" target=\"_blank\">echarts.init</a> 方法初始化一个 echarts 实例并通过 <a href=\"api.html#echartsInstance.setOption\" target=\"_blank\">setOption</a> 方法生成一个简单的柱状图,下面是完整代码。</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;ECharts&lt;/title&gt;\n    &lt;!-- 引入 echarts.js --&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- 为ECharts准备一个具备大小(宽高)的Dom --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n        // 基于准备好的dom,初始化echarts实例\n        var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n        // 指定图表的配置项和数据\n        var option = {\n            title: {\n                text: &#39;ECharts 入门示例&#39;\n            },\n            tooltip: {},\n            legend: {\n                data:[&#39;销量&#39;]\n            },\n            xAxis: {\n                data: [&quot;衬衫&quot;,&quot;羊毛衫&quot;,&quot;雪纺衫&quot;,&quot;裤子&quot;,&quot;高跟鞋&quot;,&quot;袜子&quot;]\n            },\n            yAxis: {},\n            series: [{\n                name: &#39;销量&#39;,\n                type: &#39;bar&#39;,\n                data: [5, 20, 36, 10, 10, 20]\n            }]\n        };\n\n        // 使用刚指定的配置项和数据显示图表。\n        myChart.setOption(option);\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>这样你的第一个图表就诞生了!</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/getting-started&reset=1&edit=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p>你也可以直接进入 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=doc-example/getting-started\" target=\"_blank\">ECharts Gallery</a> 中查看编辑示例</p>\n"},"自定义构建 ECharts":{"type":["*"],"description":"<p>一般来说,可以直接从 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> 中获取构建后的 Apache ECharts (incubating)<sup>TM</sup>,也可以从 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a> 中的 <code class=\"codespan\">echarts/dist</code> 文件夹中获取构建好的 echarts,这都可以直接在浏览器端项目中使用。这些构建好的 echarts 提供了下面这几种定制:</p>\n<ul>\n<li>完全版:<code class=\"codespan\">echarts/dist/echarts.js</code>,体积最大,包含所有的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.all.js</code>。</li>\n<li>常用版:<code class=\"codespan\">echarts/dist/echarts.common.js</code>,体积适中,包含常见的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.common.js</code>。</li>\n<li>精简版:<code class=\"codespan\">echarts/dist/echarts.simple.js</code>,体积较小,仅包含最常用的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.simple.js</code>。</li>\n</ul>\n<p>我们也可以自己构建 echarts,能够仅仅包括自己所需要的图表和组件。可以用这几种方式自定义构建:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/zh/builder.html\" target=\"_blank\">在线自定义构建</a>:比较方便。</li>\n<li>使用 <code class=\"codespan\">echarts/build/build.js</code> 脚本自定义构建:比在线构建更灵活一点,并且支持多语言。</li>\n<li>直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自己构建:也是一种选择。</li>\n</ul>\n<p>下面我们举些小例子,介绍后两种方式。</p>\n<h2 id=\"-echarts\">准备工作:创建自己的工程和安装 echarts</h2>\n<p>使用命令行,创建自己的工程:</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>在 <code class=\"codespan\">myProject</code> 目录下使用命令行,初始化工程的 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> 环境并安装 echarts(这里前提是您已经安装了 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a>):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>通过 npm 安装的 echarts 会出现在 <code class=\"codespan\">myProject/node_modules</code> 目录下,从而可以直接在项目代码中得到 echarts,例如:</p>\n<p>使用 ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>使用 CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>下面仅以使用 ES Module 的方式来举例。</p>\n<h2 id=\"-echarts-\">使用 echarts 提供的构建脚本自定义构建</h2>\n<p>在这个例子中,我们要创建一个饼图,并且想自定义构建一个只含有饼图的 echarts 文件,从而能使 echarts 文件的大小比较小一些。</p>\n<p>echarts 已经提供了构建脚本 <code class=\"codespan\">echarts/build/build.js</code>,基于 <a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> 运行。我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,看到它的使用方式:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>其中我们在这个例子里会用到的参数有:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>:代码入口文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">-o</code>:生成的 bundle 文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">--min</code>:是否压缩文件(默认不压缩),并且去多余的打印错误信息的代码,形成生产环境可用的文件。</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>:是否使用其他语言版本,默认是中文。例如:<code class=\"codespan\">--lang en</code> 表示使用英文,<code class=\"codespan\">--lang my/langXX.js</code> 表示构建时使用 <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> 替代 <code class=\"codespan\">echarts/lib/lang.js</code> 文件。</li>\n<li><code class=\"codespan\">--sourcemap</code>:是否输出 source map,以便于调试。</li>\n<li><code class=\"codespan\">--format</code>:输出的格式,可选 <code class=\"codespan\">&#39;umb&#39;</code>(默认)、<code class=\"codespan\">&#39;amd&#39;</code>、<code class=\"codespan\">&#39;iife&#39;</code>、<code class=\"codespan\">&#39;cjs&#39;</code>、<code class=\"codespan\">&#39;es&#39;</code>。</li>\n</ul>\n<p>既然我们想自定义构建一个只含有饼图的 echarts 文件,我们需要创建一个入口文件,可以命名为 <code class=\"codespan\">myProject/echarts.custom.js</code>,文件里会引用所需要的 echarts 模块:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nexport * from &#39;echarts/src/echarts&#39;;\n// 引入饼图。\nimport &#39;echarts/src/chart/pie&#39;;\n// 在这个场景下,可以引用 `echarts/src` 或者 `echarts/lib` 下的文件(但是不可混用),\n// 参见下方的解释:“引用 `echarts/lib/**` 还是 `echarts/src/**`”。\n</code></pre>\n<p>然后我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,这样开始构建:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js\n</code></pre>\n<p>这样,<code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> 就生成了。我们可以创建 <code class=\"codespan\">myProject/pie.html</code> 来使用它:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- 引入 lib/echarts.custom.min.js --&gt;\n    &lt;script src=&quot;lib/echarts.custom.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // 绘制图表。\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>然后在浏览器里打开 <code class=\"codespan\">myProject/pie.html</code>,就可以看到一个饼图:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"-\">允许被引用的模块</h2>\n<p>在自定义构建中,允许被引用的模块,全声明在 <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> 和 <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a> 中。echarts 和 zrender 源代码中的其他模块,都是 echarts 的内部模块,<strong>不应该去引用</strong>。因为在后续 echarts 版本升级中,内部模块的接口和功能可能变化,甚至模块本身也可能被移除。</p>\n<h2 id=\"-echarts-lib-echarts-src-\">引用 <code class=\"codespan\">echarts/lib/**</code> 还是 <code class=\"codespan\">echarts/src/**</code></h2>\n<ul>\n<li>项目中如果直接引用 echarts 里的一些模块并自行构建,应该使用 <code class=\"codespan\">echarts/lib/**</code> 路径,而不可使用 <code class=\"codespan\">echarts/src/**</code>。</li>\n<li>当使用构建脚本 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle,那么两者可以选其一使用(不可混用),使用 <code class=\"codespan\">echarts/src/**</code> 可以获得稍微小一些的文件体积。</li>\n</ul>\n<blockquote>\n<p>原因是:目前,<code class=\"codespan\">echarts/src/**</code> 中是采用 ES Module 的源代码,<code class=\"codespan\">echarts/lib/**</code> 中是 <code class=\"codespan\">echarts/src/**</code> 编译成为 CommonJS 后的产物(编译成 CommonJS 是为了向后兼容一些不支持 ES Module 的老版本 NodeJS 和 webpack)。\n因为历史上,各个 echarts 扩展、各个用户项目,一直是使用的包路径是 <code class=\"codespan\">echarts/lib/**</code>,所以这个路径不应该改变,否则,可能导致混合使用 <code class=\"codespan\">echarts/src/**</code> 和 <code class=\"codespan\">echarts/lib/**</code> 得到两个不同的 echarts 名空间,造成问题。而使用 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle 时没有涉及这个问题,<code class=\"codespan\">echarts/src/**</code> 中的 ES Module 便于静态分析从而得到稍微小些的文件体积。</p>\n</blockquote>\n<h2 id=\"-rollup-\">直接使用 rollup 自定义构建</h2>\n<p>上文中介绍了如何使用 echarts 提供的脚本 <code class=\"codespan\">echarts/build/build.js</code> 自定义构建。与此并列的另一种选择是,我们直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自定义构建,并且把 echarts 代码和项目代码在构建成一体。在一些项目中可能需要这么做。下面我们仅仅介绍如何使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 来构建。<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> 和 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 与此类同,不赘述。</p>\n<p>首先我们在 <code class=\"codespan\">myProject</code> 目录下使用 npm 安装 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>接下来创建项目 JS 文件 <code class=\"codespan\">myProject/line.js</code> 来绘制图表,内容为:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// 引入折线图。\nimport &#39;echarts/lib/chart/line&#39;;\n// 引入提示框组件、标题组件、工具箱组件。\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// 基于准备好的dom,初始化 echarts 实例并绘制图表。\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>对于不支持 ES Module 的浏览器而言,刚才创建的 <code class=\"codespan\">myProject/line.js</code> 还不能直接被网页引用并在浏览器中运行,需要进行构建。使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 构建前,需要创建它的配置文件 <code class=\"codespan\">myProject/rollup.config.js</code>,内容如下:</p>\n<pre><code class=\"lang-js\">// 这个插件用于在 `node_module` 文件夹(即 npm 用于管理模块的文件夹)中寻找模块。比如,代码中有\n// `import &#39;echarts/lib/chart/line&#39;;` 时,这个插件能够寻找到\n// `node_module/echarts/lib/chart/line.js` 这个模块文件。\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// 用于压缩构建出的代码。\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// 用于多语言支持(如果不需要可忽略此 plugin)。\n// import ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // 入口代码文件,就是刚才所创建的文件。\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        // ecLangPlugin({lang: &#39;en&#39;}),\n        // 消除代码中的 __DEV__ 代码段,从而不在控制台打印错误提示信息。\n        uglify()\n    ],\n    output: {\n        // 以 UMD 格式输出,从而能在各种浏览器中加载使用。\n        format: &#39;umd&#39;,\n        // 输出 source map 便于调试。\n        sourcemap: true,\n        // 输出文件的路径。\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>然后在 <code class=\"codespan\">myProject</code> 目录下使用命令行,构建工程代码 <code class=\"codespan\">myProject/line.js</code>:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p>其中 <code class=\"codespan\">-c</code> 表示让 <code class=\"codespan\">rollup</code> 使用我们刚才创建的 <code class=\"codespan\">myProject/rollup.config.js</code> 文件作为配置文件。</p>\n</blockquote>\n<p>构建生成的 <code class=\"codespan\">myProject/lib/line.min.js</code> 文件包括了工程代码和 echarts 代码,并且仅仅包括我们所需要的图和组件,并且可以在浏览器中使用。我们可以用一个示例页面来测试一下,创建文件 <code class=\"codespan\">myProject/line.html</code>,内容如下:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- 为 echarts 准备一个具备大小(宽高)的Dom。 --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- 引入刚才构建好的文件。 --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>在浏览器里打开 <code class=\"codespan\">myProject/line.html</code> 则会得到如下效果:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"-\">多语言支持</h2>\n<p>上面的例子中能看到,工具箱组件(toolbox)的提示文字是中文。本质上,echarts 图表显示出来的文字,都可以通过 <code class=\"codespan\">option</code> 来定制,改成任意语言。但是如果想“默认就是某种语言”,则需要通过构建来实现。</p>\n<p>在上面的例子中,可以在 <code class=\"codespan\">echarts/build/build.js</code> 的参数中指定语言:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>表示使用内置的英文。此外还可以是 <code class=\"codespan\">--lang fi</code>。</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>表示在构建时使用 <code class=\"codespan\">myProject/my/langXX.js</code> 文件来替换 <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> 文件。这样可以在 <code class=\"codespan\">myProject/my/langXX.js</code> 文件中自定义语言。注意这种方式中,必须指定 <code class=\"codespan\">-o</code> 或者 <code class=\"codespan\">--output</code>。</p>\n<p>另外,上面的 rollup 插件 <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code> 也可以传入同样的参数,实现同样的功能。</p>\n"},"在 webpack 中使用 ECharts":{"type":["*"],"description":"<p><a href=\"https://webpack.js.org//\" target=\"_blank\">Webpack</a> 是目前比较流行的模块打包工具,你可以在使用 webpack 的项目中轻松的引入和打包 Apache ECharts (incubating)<sup>TM</sup>,这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。</p>\n<h2 id=\"npm-echarts\">npm 安装 ECharts</h2>\n<p>你可以使用如下命令通过 npm 安装 ECharts</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过 npm 上安装的 ECharts 和 zrender 会放在<code class=\"codespan\">node_modules</code>目录下。可以直接在项目代码中 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到 ECharts。</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"-echarts-\">按需引入 ECharts 图表和组件</h2>\n<p>默认使用 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到的是已经加载了所有图表和组件的 ECharts 包,因此体积会比较大,如果在项目中对体积要求比较苛刻,也可以只按需引入需要的模块。</p>\n<p>例如上面示例代码中只用到了柱状图,提示框和标题组件,因此在引入的时候也只需要引入这些模块,可以有效的将打包后的体积从 400 多 KB 减小到 170 多 KB。</p>\n<pre><code class=\"lang-js\">// 引入 ECharts 主模块\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// 引入柱状图\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// 引入提示框和标题组件\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>可以按需引入的模块列表见 <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>对于流行的模块打包工具 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 也是同样的用法,这里就不赘述了。而对于使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 的自定义构建,参见 <a href=\"https://echarts.apache.org/zh/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">自定义构建 ECharts</a>。</p>\n"},"ECharts 基础概念概览":{"type":["*"],"description":"<p>本文介绍 Apache ECharts (incubating)<sup>TM</sup> 最基本的名词和概念。</p>\n<h2 id=\"echarts-\">echarts 实例</h2>\n<p>一个网页中可以创建多个 <code class=\"codespan\">echarts 实例</code>。每个 <code class=\"codespan\">echarts 实例</code> 中可以创建多个图表和坐标系等等(用 <code class=\"codespan\">option</code> 来描述)。准备一个 DOM 节点(作为 echarts 的渲染容器),就可以在上面创建一个 echarts 实例。每个 echarts 实例独占一个 DOM 节点。</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"-series-\">系列(series)</h2>\n<p><code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是很常见的名词。在 echarts 里,<code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是指:一组数值以及他们映射成的图。“系列”这个词原本可能来源于“一系列的数据”,而在 echarts 中取其扩展的概念,不仅表示数据,也表示数据映射成为的图。所以,一个 <code class=\"codespan\">系列</code> 包含的要素至少有:一组数值、图表类型(<code class=\"codespan\">series.type</code>)、以及其他的关于这些数据如何映射成图的参数。</p>\n<p>echarts 里系列类型(<code class=\"codespan\">series.type</code>)就是图表类型。系列类型(<code class=\"codespan\">series.type</code>)至少有:<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)、...</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了三个 <code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>):<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图系列)、<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图系列)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图系列),每个系列中有他所需要的数据(<a href=\"option.html#series.data\" target=\"_blank\">series.data</a>)。</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>类同地,下图中是另一种配置方式,系列的数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"-component-\">组件(component)</h2>\n<p>在系列之上,echarts 中各种内容,被抽象为“组件”。例如,echarts 中至少有这些组件:<a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)、<a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a>(极坐标系角度轴)、<a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a>(极坐标系半径轴)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系底板)、<a href=\"option.html#geo\" target=\"_blank\">geo</a>(地理坐标系)、<a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>(数据区缩放组件)、<a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>(视觉映射组件)、<a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a>(提示框组件)、<a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a>(工具栏组件)、<a href=\"option.html#series\" target=\"_blank\">series</a>(系列)、...</p>\n<p>我们注意到,其实系列(<a href=\"option.html#series\" target=\"_blank\">series</a>)也是一种组件,可以理解为:系列是专门绘制“图”的组件。</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了各个组件(包括系列),各个组件就出现在图中。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>注:因为系列是一种特殊的组件,所以有时候也会出现 “组件和系列” 这样的描述,这种语境下的 “组件” 是指:除了 “系列” 以外的其他组件。</p>\n<h2 id=\"-option-\">用 option 描述图表</h2>\n<p>上面已经出现了 <code class=\"codespan\">option</code> 这个概念。echarts 的使用者,使用 <code class=\"codespan\">option</code> 来描述其对图表的各种需求,包括:有什么数据、要画什么图表、图表长什么样子、含有什么组件、组件能操作什么事情等等。简而言之,<code class=\"codespan\">option</code> 表述了:<code class=\"codespan\">数据</code>、<code class=\"codespan\">数据如何映射成图形</code>、<code class=\"codespan\">交互行为</code>。</p>\n<pre><code class=\"lang-js\">// 创建 echarts 实例。\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// 用 option 描述 `数据`、`数据如何映射成图形`、`交互行为` 等。\n// option 是个大的 JavaScript 对象。\nvar option = {\n    // option 每个属性是一类组件。\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // 如果有多个同类组件,那么就是个数组。例如这里有三个 X 轴。\n    xAxis: [\n        // 数组每项表示一个组件实例,用 type 描述“子类型”。\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // 这里有多个系列,也是构成一个数组。\n    series: [\n        // 每个系列,也有 type 描述“子类型”,即“图表类型”。\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// 调用 setOption 将 option 输入 echarts,然后 echarts 渲染图表。\nchart.setOption(option);\n</code></pre>\n<p>系列里的 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 是本系列的数据。而另一种描述方式,系列数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // 数据从 dataset 中取,encode 中的数值是 dataset.source 的维度 index (即第几列)\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"-\">组件的定位</h2>\n<p>不同的组件、系列,常有不同的定位方式。</p>\n<p><br></p>\n<p><strong>[类 CSS 的绝对定位]</strong></p>\n<p><br></p>\n<p>多数组件和系列,都能够基于 <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code> 绝对定位。\n这种绝对定位的方式,类似于 <code class=\"codespan\">CSS</code> 的绝对定位(<code class=\"codespan\">position: absolute</code>)。绝对定位基于的是 echarts 容器 DOM 节点。</p>\n<p>其中,他们每个值都可以是:</p>\n<ul>\n<li>绝对数值(例如 <code class=\"codespan\">bottom: 54</code> 表示:距离 echarts 容器底边界 <code class=\"codespan\">54</code> 像素)。</li>\n<li>或者基于 echarts 容器高宽的百分比(例如 <code class=\"codespan\">right: &#39;20%&#39;</code> 表示:距离 echarts 容器右边界的距离是 echarts 容器宽度的 <code class=\"codespan\">20%</code>)。</li>\n</ul>\n<p>如下图的例子,对 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件(也就是直角坐标系的底板)设置 <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code> 达到的效果。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>我们可以注意到,<code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> 是一组(横向)、<code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> 是另一组(纵向)。这两组没有什么关联。每组中,至多设置两项就可以了,第三项会被自动算出。例如,设置了 <code class=\"codespan\">left</code> 和 <code class=\"codespan\">right</code> 就可以了,<code class=\"codespan\">width</code> 会被自动算出。</p>\n<p><br></p>\n<p><strong>[中心半径定位]</strong></p>\n<p><br></p>\n<p>少数圆形的组件或系列,可以使用“中心半径定位”,例如,<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a>(旭日图)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系)。</p>\n<p>中心半径定位,往往依据 <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a>(中心)、<a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>(半径)来决定位置。</p>\n<p><br></p>\n<p><strong>[其他定位]</strong></p>\n<p><br></p>\n<p>少数组件和系列可能有自己的特殊的定位方式。在他们的文档中会有说明。</p>\n<h2 id=\"-\">坐标系</h2>\n<p>很多系列,例如 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>(热力图)等等,需要运行在 “坐标系” 上。坐标系用于布局这些图,以及显示数据的刻度等等。例如 echarts 中至少支持这些坐标系:<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a>、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a>、<a href=\"option.html#singleAxis\" target=\"_blank\">单轴坐标系</a>、<a href=\"option.html#calendar\" target=\"_blank\">日历坐标系</a> 等。其他一些系列,例如 <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)等等,并不依赖坐标系,能独立存在。还有一些图,例如 <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)等,既能独立存在,也能布局在坐标系中,依据用户的设定而来。</p>\n<p>一个坐标系,可能由多个组件协作而成。我们以最常见的直角坐标系来举例。直角坐标系中,包括有 <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)三种组件。<code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 被 <code class=\"codespan\">grid</code> 自动引用并组织起来,共同工作。</p>\n<p>我们来看下图,这是最简单的使用直角坐标系的方式:只声明了 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 和一个 <code class=\"codespan\">scatter</code>(散点图系列),echarts 暗自为他们创建了 <code class=\"codespan\">grid</code> 并关联起他们:</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>再来看下图,两个 <code class=\"codespan\">yAxis</code>,共享了一个 <code class=\"codespan\">xAxis</code>。两个 <code class=\"codespan\">series</code>,也共享了这个 <code class=\"codespan\">xAxis</code>,但是分别使用不同的 <code class=\"codespan\">yAxis</code>,使用 <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> 来指定它自己使用的是哪个 <code class=\"codespan\">yAxis</code>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>再来看下图,一个 echarts 实例中,有多个 <code class=\"codespan\">grid</code>,每个 <code class=\"codespan\">grid</code> 分别有 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code>,他们使用 <code class=\"codespan\">xAxisIndex</code>、<code class=\"codespan\">yAxisIndex</code>、<code class=\"codespan\">gridIndex</code> 来指定引用关系:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>另外,一个系列,往往能运行在不同的坐标系中。例如,一个 <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)能运行在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a> 、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a> 等各种坐标系中。同样,一个坐标系,也能承载不同的系列,如上面出现的各种例子,<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a> 里承载了 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)等等。</p>\n"},"个性化图表的样式":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 提供了丰富的自定义配置选项,并且能够从全局、系列、数据三个层级去设置数据图形的样式。下面我们来看如何使用 ECharts 实现下面这个南丁格尔图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n<h2 id=\"-\">绘制南丁格尔图</h2>\n<p><a href=\"#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts\">5分钟上手ECharts</a> 中讲了如何绘制一个简单的柱状图,这次要画的是饼图,饼图主要是通过扇形的弧度表现不同类目的数据在总和中的占比,它的数据格式比柱状图更简单,只有一维的数值,不需要给类目。因为不在直角坐标系上,所以也不需要<code class=\"codespan\">xAxis</code>,<code class=\"codespan\">yAxis</code>。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    series : [\n        {\n            name: &#39;访问来源&#39;,\n            type: &#39;pie&#39;,\n            radius: &#39;55%&#39;,\n            data:[\n                {value:235, name:&#39;视频广告&#39;},\n                {value:274, name:&#39;联盟广告&#39;},\n                {value:310, name:&#39;邮件营销&#39;},\n                {value:335, name:&#39;直接访问&#39;},\n                {value:400, name:&#39;搜索引擎&#39;}\n            ]\n        }\n    ]\n})\n</code></pre>\n<p>上面代码就能画出一个简单的饼图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step0&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>这里<code class=\"codespan\">data</code>属性值不像入门教程里那样每一项都是单个数值,而是一个包含 <code class=\"codespan\">name</code> 和 <code class=\"codespan\">value</code> 属性的对象,ECharts 中的数据项都是既可以只设成数值,也可以设成一个包含有名称、该数据图形的样式配置、标签配置的对象,具体见 <a href=\"option.html#series-pie.data\" target=\"_blank\">data</a> 文档。</p>\n<p>ECharts 中的<a href=\"option.html#series-pie\" target=\"_blank\">饼图</a>也支持通过设置 <a href=\"option.html#series-pie.roseType\" target=\"_blank\">roseType</a> 显示成南丁格尔图。</p>\n<pre><code class=\"lang-js\">roseType: &#39;angle&#39;\n</code></pre>\n<p>南丁格尔图会通过半径表示数据的大小。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step1&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"-\">阴影的配置</h2>\n<p>ECharts 中有一些通用的样式,诸如阴影、透明度、颜色、边框颜色、边框宽度等,这些样式一般都会在系列的 <a href=\"#series-pie.itemStyle\">itemStyle</a> 里设置。例如阴影的样式可以通过下面几个配置项设置:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // 阴影的大小\n    shadowBlur: 200,\n    // 阴影水平方向上的偏移\n    shadowOffsetX: 0,\n    // 阴影垂直方向上的偏移\n    shadowOffsetY: 0,\n    // 阴影颜色\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<p>加上阴影后的效果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step2&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p><code class=\"codespan\">itemStyle</code>的<code class=\"codespan\">emphasis</code>是鼠标 hover 时候的高亮样式。这个示例里是正常的样式下加阴影,但是可能更多的时候是 hover 的时候通过阴影突出。</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    emphasis: {\n        shadowBlur: 200,\n        shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n    }\n}\n</code></pre>\n<h2 id=\"-\">深色背景和浅色标签</h2>\n<p>现在我们需要把整个主题改成开始的示例中那样的深色主题,这就需要改背景色和文本颜色。</p>\n<p>背景色是全局的,所以直接在 option 下设置 <a href=\"option.html#backgroundColor\" target=\"_blank\">backgroundColor</a></p>\n<pre><code class=\"lang-js\">setOption({\n    backgroundColor: &#39;#2c343c&#39;\n})\n</code></pre>\n<p>文本的样式可以设置全局的 <a href=\"option.html#textStyle\" target=\"_blank\">textStyle</a>。</p>\n<pre><code class=\"lang-js\">setOption({\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n})\n</code></pre>\n<p>也可以每个系列分别设置,每个系列的文本设置在 <a href=\"option.html#series-pie.label.textStyle\" target=\"_blank\">label.textStyle</a>。</p>\n<pre><code class=\"lang-js\">label: {\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>饼图的话还要将标签的视觉引导线的颜色设为浅色。</p>\n<pre><code class=\"lang-js\">labelLine: {\n    lineStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step3&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>跟<code class=\"codespan\">itemStyle</code>一样,<code class=\"codespan\">label</code>和<code class=\"codespan\">labelLine</code>的样式也有<code class=\"codespan\">emphasis</code>状态。</p>\n<h2 id=\"-\">设置扇形的颜色</h2>\n<p>扇形的颜色也是在 itemStyle 中设置:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // 设置扇形的颜色\n    color: &#39;#c23531&#39;,\n    shadowBlur: 200,\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step4&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>跟我们要实现的效果已经挺像了,除了每个扇形的颜色,效果中阴影下面的扇形颜色更深,有种光线被遮住的感觉,从而会出现层次感和空间感。</p>\n<p>ECharts 中每个扇形颜色的可以通过分别设置 data 下的数据项实现。</p>\n<pre><code class=\"lang-js\">data: [{\n    value:400,\n    name:&#39;搜索引擎&#39;,\n    itemStyle: {\n        color: &#39;#c23531&#39;\n    }\n}, ...]\n</code></pre>\n<p>但是这次因为只有明暗度的变化,所以有一种更快捷的方式是通过 <a href=\"#option.html#visualMap\">visualMap</a> 组件将数值的大小映射到明暗度。</p>\n<pre><code class=\"lang-js\">visualMap: {\n    // 不显示 visualMap 组件,只用于明暗度的映射\n    show: false,\n    // 映射的最小值为 80\n    min: 80,\n    // 映射的最大值为 600\n    max: 600,\n    inRange: {\n        // 明暗度的范围是 0 到 1\n        colorLightness: [0, 1]\n    }\n}\n</code></pre>\n<p>最终效果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n\n\n"},"ECharts 中的样式简介":{"type":["*"],"description":"<p>本文主要是大略概述,用哪些方法,可以在 Apache ECharts (incubating)<sup>TM</sup> 中设置样式,改变图形元素或者文字的颜色、明暗、大小等。</p>\n<blockquote>\n<p>之所以用“样式”这种可能不很符合数据可视化思维的词,是因为,比较通俗易懂。</p>\n</blockquote>\n<p>本文介绍这几种方式,他们的功能范畴可能会有交叉(即同一种细节的效果可能可以用不同的方式实现),但是他们各有各的场景偏好。</p>\n<ul>\n<li>颜色主题(Theme)</li>\n<li>调色盘</li>\n<li>直接样式设置(itemStyle、lineStyle、areaStyle、label、...)</li>\n<li>视觉映射(visualMap)</li>\n</ul>\n<p>其他关于样式的文章,参见:<a href=\"#%E4%B8%AA%E6%80%A7%E5%8C%96%E5%9B%BE%E8%A1%A8%E7%9A%84%E6%A0%B7%E5%BC%8F\">个性化图表的样式</a>,<a href=\"#%E6%95%B0%E6%8D%AE%E7%9A%84%E8%A7%86%E8%A7%89%E6%98%A0%E5%B0%84\">数据的视觉映射</a>。</p>\n<h2 id=\"-theme-\">颜色主题(Theme)</h2>\n<p>最简单的更改全局样式的方式,是直接采用颜色主题(theme)。例如,在 <a href=\"https://echarts.apache.org/examples/zh/index.html\" target=\"_blank\">示例集合</a> 中,可以选择 “Theme”,直接看到采用主题的效果。</p>\n<p>ECharts4 开始,除了一贯的默认主题外,新内置了两套主题,分别为 <code class=\"codespan\">&#39;light&#39;</code> 和 <code class=\"codespan\">&#39;dark&#39;</code>。可以这么来使用它们:</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;light&#39;);\n</code></pre>\n<p>或者</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;dark&#39;);\n</code></pre>\n<p>其他的主题,没有内置在 ECharts 中,需要自己加载。这些主题可以在 <a href=\"https://www.echartsjs.com/theme-builder/\" target=\"_blank\">主题编辑器</a> 里访问到。也可以使用这个主题编辑器,自己编辑主题。下载下来的主题可以这样使用:</p>\n<p>如果主题保存为 JSON 文件,那么可以自行加载和注册,例如:</p>\n<pre><code class=\"lang-js\">// 假设主题名称是 &quot;vintage&quot;\n$.getJSON(&#39;xxx/xxx/vintage.json&#39;, function (themeJSON) {\n    echarts.registerTheme(&#39;vintage&#39;, JSON.parse(themeJSON))\n    var chart = echarts.init(dom, &#39;vintage&#39;);\n});\n</code></pre>\n<p>如果保存为 UMD 格式的 JS 文件,那么支持了自注册,直接引入 JS 文件即可:</p>\n<pre><code class=\"lang-js\">// HTML 引入 vintage.js 文件后(假设主题名称是 &quot;vintage&quot;)\nvar chart = echarts.init(dom, &#39;vintage&#39;);\n// ...\n</code></pre>\n<h2 id=\"-\">调色盘</h2>\n<p>调色盘,可以在 option 中设置。它给定了一组颜色,图形、系列会自动从其中选择颜色。\n可以设置全局的调色盘,也可以设置系列自己专属的调色盘。</p>\n<pre><code class=\"lang-js\">option = {\n    // 全局调色盘。\n    color: [&#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\n    series: [{\n        type: &#39;bar&#39;,\n        // 此系列自己的调色盘。\n        color: [&#39;#dd6b66&#39;,&#39;#759aa0&#39;,&#39;#e69d87&#39;,&#39;#8dc1a9&#39;,&#39;#ea7e53&#39;,&#39;#eedd78&#39;,&#39;#73a373&#39;,&#39;#73b9bc&#39;,&#39;#7289ab&#39;, &#39;#91ca8c&#39;,&#39;#f49f42&#39;],\n        ...\n    }, {\n        type: &#39;pie&#39;,\n        // 此系列自己的调色盘。\n        color: [&#39;#37A2DA&#39;, &#39;#32C5E9&#39;, &#39;#67E0E3&#39;, &#39;#9FE6B8&#39;, &#39;#FFDB5C&#39;,&#39;#ff9f7f&#39;, &#39;#fb7293&#39;, &#39;#E062AE&#39;, &#39;#E690D1&#39;, &#39;#e7bcf3&#39;, &#39;#9d96f5&#39;, &#39;#8378EA&#39;, &#39;#96BFFF&#39;],\n        ...\n    }]\n}\n</code></pre>\n<h2 id=\"-itemstyle-linestyle-areastyle-label-\">直接的样式设置 itemStyle, lineStyle, areaStyle, label, ...</h2>\n<p>直接的样式设置是比较常用设置方式。纵观 ECharts 的 <a href=\"option.html\" target=\"_blank\">option</a> 中,很多地方可以设置 <a href=\"option.html#series.itemStyle\" target=\"_blank\">itemStyle</a>、<a href=\"option.html#series-line.lineStyle\" target=\"_blank\">lineStyle</a>、<a href=\"option.html#series-line.areaStyle\" target=\"_blank\">areaStyle</a>、<a href=\"option.html#series.label\" target=\"_blank\">label</a> 等等。这些的地方可以直接设置图形元素的颜色、线宽、点的大小、标签的文字、标签的样式等等。</p>\n<p>一般来说,ECharts 的各个系列和组件,都遵从这些命名习惯,虽然不同图表和组件中,<code class=\"codespan\">itemStyle</code>、<code class=\"codespan\">label</code> 等可能出现在不同的地方。</p>\n<p>直接样式设置的另一篇介绍,参见 <a href=\"#%E4%B8%AA%E6%80%A7%E5%8C%96%E5%9B%BE%E8%A1%A8%E7%9A%84%E6%A0%B7%E5%BC%8F\">个性化图表的样式</a>。</p>\n<h2 id=\"-emphasis\">高亮的样式:emphasis</h2>\n<p>在鼠标悬浮到图形元素上时,一般会出现高亮的样式。默认情况下,高亮的样式是根据普通样式自动生成的。但是高亮的样式也可以自己定义,主要是通过 <a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphasis</a> 属性来定制。<a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphsis</a> 中的结构,和普通样式的结构相同,例如:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        // 普通样式。\n        itemStyle: {\n            // 点的颜色。\n            color: &#39;red&#39;\n        },\n        label: {\n            show: true,\n            // 标签的文字。\n            formatter: &#39;This is a normal label.&#39;\n        },\n\n        // 高亮样式。\n        emphasis: {\n            itemStyle: {\n                // 高亮时点的颜色。\n                color: &#39;blue&#39;\n            },\n            label: {\n                show: true,\n                // 高亮时标签的文字。\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>注意:在 ECharts4 以前,高亮和普通样式的写法,是这样的:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        itemStyle: {\n            // 普通样式。\n            normal: {\n                // 点的颜色。\n                color: &#39;red&#39;\n            },\n            // 高亮样式。\n            emphasis: {\n                // 高亮时点的颜色。\n                color: &#39;blue&#39;\n            }\n        },\n\n        label: {\n            // 普通样式。\n            normal: {\n                show: true,\n                // 标签的文字。\n                formatter: &#39;This is a normal label.&#39;\n            },\n            // 高亮样式。\n            emphasis: {\n                show: true,\n                // 高亮时标签的文字。\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>这种写法 <strong>仍然被兼容</strong>,但是,不再推荐。事实上,多数情况下,使用者只会配置普通状态下的样式,而使用默认的高亮样式。所以在 ECharts4 中,支持不写 <code class=\"codespan\">normal</code> 的配置方法(即本文开头的那种写法),使得配置项更扁平简单。</p>\n<h2 id=\"-visualmap-\">通过 visualMap 组件设定样式</h2>\n<p><a href=\"option.html#visualMap\" target=\"_blank\">visualMap 组件</a> 能指定数据到颜色、图形尺寸的映射规则,详见 <a href=\"#%E6%95%B0%E6%8D%AE%E7%9A%84%E8%A7%86%E8%A7%89%E6%98%A0%E5%B0%84\">数据的视觉映射</a>。</p>\n"},"异步数据加载和更新":{"type":["*"],"description":"<h2 id=\"-\">异步加载</h2>\n<p><a href=\"#getting-started\">入门示例</a>中的数据是在初始化后 <code class=\"codespan\">setOption</code> 中直接填入的,但是很多时候可能数据需要异步加载后再填入。Apache ECharts (incubating)<sup>TM</sup> 中实现异步数据的更新非常简单,在图表初始化后不管任何时候只要通过 jQuery 等工具异步获取数据后通过 <code class=\"codespan\">setOption</code> 填入数据和配置项就行。</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.setOption({\n        title: {\n            text: &#39;异步数据加载示例&#39;\n        },\n        tooltip: {},\n        legend: {\n            data:[&#39;销量&#39;]\n        },\n        xAxis: {\n            data: [&quot;衬衫&quot;,&quot;羊毛衫&quot;,&quot;雪纺衫&quot;,&quot;裤子&quot;,&quot;高跟鞋&quot;,&quot;袜子&quot;]\n        },\n        yAxis: {},\n        series: [{\n            name: &#39;销量&#39;,\n            type: &#39;bar&#39;,\n            data: [5, 20, 36, 10, 10, 20]\n        }]\n    });\n});\n</code></pre>\n<p>或者先设置完其它的样式,显示一个空的直角坐标轴,然后获取数据后填入数据。</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 显示标题,图例和空的坐标轴\nmyChart.setOption({\n    title: {\n        text: &#39;异步数据加载示例&#39;\n    },\n    tooltip: {},\n    legend: {\n        data:[&#39;销量&#39;]\n    },\n    xAxis: {\n        data: []\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: []\n    }]\n});\n\n// 异步加载数据\n$.get(&#39;data.json&#39;).done(function (data) {\n    // 填入数据\n    myChart.setOption({\n        xAxis: {\n            data: data.categories\n        },\n        series: [{\n            // 根据名字对应到相应的系列\n            name: &#39;销量&#39;,\n            data: data.data\n        }]\n    });\n});\n</code></pre>\n<p>如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-async&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>ECharts 中在更新数据的时候需要通过<code class=\"codespan\">name</code>属性对应到相应的系列,上面示例中如果<code class=\"codespan\">name</code>不存在也可以根据系列的顺序正常更新,但是更多时候推荐更新数据的时候加上系列的<code class=\"codespan\">name</code>数据。</p>\n<h2 id=\"loading-\">loading 动画</h2>\n<p>如果数据加载时间较长,一个空的坐标轴放在画布上也会让用户觉得是不是产生 bug 了,因此需要一个 loading 的动画来提示用户数据正在加载。</p>\n<p>ECharts 默认有提供了一个简单的加载动画。只需要调用 <a href=\"api.html#echartsInstance.showLoading\" target=\"_blank\">showLoading</a> 方法显示。数据加载完成后再调用 <a href=\"api.html#echartsInstance.hideLoading\" target=\"_blank\">hideLoading</a> 方法隐藏加载动画。</p>\n<pre><code class=\"lang-js\">myChart.showLoading();\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.hideLoading();\n    myChart.setOption(...);\n});\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-loading&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"-\">数据的动态更新</h2>\n<p>ECharts 由数据驱动,数据的改变驱动图表展现的改变,因此动态数据的实现也变得异常简单。</p>\n<p>所有数据的更新都通过 <a href=\"#api.html#echartsInstance.setOption\">setOption</a>实现,你只需要定时获取数据,<a href=\"#api.html#echartsInstance.setOption\">setOption</a> 填入数据,而不用考虑数据到底产生了那些变化,ECharts 会找到两组数据之间的差异然后通过合适的动画去表现数据的变化。</p>\n<blockquote>\n<p>ECharts 3 中移除了 ECharts 2 中的 addData 方法。如果只需要加入单个数据,可以先 data.push(value) 后 setOption</p>\n</blockquote>\n<p>具体可以看下面示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-dynamic-data&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n\n"},"使用 dataset 管理数据":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 4 开始支持了 <code class=\"codespan\">dataset</code> 组件用于单独的数据集声明,从而数据可以单独管理,被多个组件复用,并且可以基于数据指定数据到视觉的映射。这在不少场景下能带来使用上的方便。</p>\n<p>ECharts 4 以前,数据只能声明在各个“系列(series)”中,例如:</p>\n<pre><code class=\"lang-js\">option = {\n    xAxis: {\n        type: &#39;category&#39;,\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2015&#39;,\n            data: [89.3, 92.1, 94.4, 85.4]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2016&#39;,\n            data: [95.8, 89.4, 91.2, 76.9]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2017&#39;,\n            data: [97.7, 83.1, 92.5, 78.1]\n        }\n    ]\n}\n</code></pre>\n<p>这种方式的优点是,直观易理解,以及适于对一些特殊图表类型进行一定的数据类型定制。但是缺点是,为匹配这种数据输入形式,常需要有数据处理的过程,把数据分割设置到各个系列(和类目轴)中。此外,不利于多个系列共享一份数据,也不利于基于原始数据进行图表类型、系列的映射安排。</p>\n<p>于是,ECharts 4 提供了 <code class=\"codespan\">数据集</code>(<code class=\"codespan\">dataset</code>)组件来单独声明数据,它带来了这些效果:</p>\n<ul>\n<li>能够贴近这样的数据可视化常见思维方式:(I) 提供数据,(II) 指定数据到视觉的映射,从而形成图表。</li>\n<li>数据和其他配置可以被分离开来。数据常变,其他配置常不变。分开易于分别管理。</li>\n<li>数据可以被多个系列或者组件复用,对于大数据量的场景,不必为每个系列创建一份数据。</li>\n<li>支持更多的数据的常用格式,例如二维数组、对象数组等,一定程度上避免使用者为了数据格式而进行转换。</li>\n</ul>\n<h2 id=\"-\">入门例子</h2>\n<p>下面是一个最简单的 <code class=\"codespan\">dataset</code> 的例子:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // 提供一份数据。\n        source: [\n            [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n            [&#39;Matcha Latte&#39;, 43.3, 85.8, 93.7],\n            [&#39;Milk Tea&#39;, 83.1, 73.4, 55.1],\n            [&#39;Cheese Cocoa&#39;, 86.4, 65.2, 82.5],\n            [&#39;Walnut Brownie&#39;, 72.4, 53.9, 39.1]\n        ]\n    },\n    // 声明一个 X 轴,类目轴(category)。默认情况下,类目轴对应到 dataset 第一列。\n    xAxis: {type: &#39;category&#39;},\n    // 声明一个 Y 轴,数值轴。\n    yAxis: {},\n    // 声明多个 bar 系列,默认情况下,每个系列会自动对应到 dataset 的每一列。\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n}\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n<p>或者也可以使用常见的对象数组的格式:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // 用 dimensions 指定了维度的顺序。直角坐标系中,\n        // 默认把第一个维度映射到 X 轴上,第二个维度映射到 Y 轴上。\n        // 如果不指定 dimensions,也可以通过指定 series.encode\n        // 完成映射,参见后文。\n        dimensions: [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n        source: [\n            {product: &#39;Matcha Latte&#39;, &#39;2015&#39;: 43.3, &#39;2016&#39;: 85.8, &#39;2017&#39;: 93.7},\n            {product: &#39;Milk Tea&#39;, &#39;2015&#39;: 83.1, &#39;2016&#39;: 73.4, &#39;2017&#39;: 55.1},\n            {product: &#39;Cheese Cocoa&#39;, &#39;2015&#39;: 86.4, &#39;2016&#39;: 65.2, &#39;2017&#39;: 82.5},\n            {product: &#39;Walnut Brownie&#39;, &#39;2015&#39;: 72.4, &#39;2016&#39;: 53.9, &#39;2017&#39;: 39.1}\n        ]\n    },\n    xAxis: {type: &#39;category&#39;},\n    yAxis: {},\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n};\n</code></pre>\n<h2 id=\"-\">数据到图形的映射</h2>\n<p>本篇里,我们制作数据可视化图表的逻辑是这样的:基于数据,在配置项中指定如何映射到图形。</p>\n<p>概略而言,可以进行这些映射:</p>\n<ul>\n<li>指定 dataset 的列(column)还是行(row)映射为图形系列(series)。这件事可以使用 <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">series.seriesLayoutBy</a> 属性来配置。默认是按照列(column)来映射。</li>\n<li>指定维度映射的规则:如何从 dataset 的维度(一个“维度”的意思是一行/列)映射到坐标轴(如 X、Y 轴)、提示框(tooltip)、标签(label)、图形元素大小颜色等(visualMap)。这件事可以使用 <a href=\"option.html#series.encode\" target=\"_blank\">series.encode</a> 属性,以及 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件(如果有需要映射颜色大小等视觉维度的话)来配置。上面的例子中,没有给出这种映射配置,那么 ECharts 就按最常见的理解进行默认映射:X 坐标轴声明为类目轴,默认情况下会自动对应到 dataset.source 中的第一列;三个柱图系列,一一对应到 dataset.source 中后面每一列。</li>\n</ul>\n<p>下面详细解释。</p>\n<h2 id=\"-dataset-series-\">把数据集( dataset )的行或列映射为系列(series)</h2>\n<p>有了数据表之后,使用者可以灵活得配置:数据如何对应到轴和图形系列。</p>\n<p>用户可以使用 <code class=\"codespan\">seriesLayoutBy</code> 配置项,改变图表对于行列的理解。<code class=\"codespan\">seriesLayoutBy</code> 可取值:</p>\n<ul>\n<li>&#39;column&#39;: 默认值。系列被安放到 <code class=\"codespan\">dataset</code> 的列上面。</li>\n<li>&#39;row&#39;: 系列被安放到 <code class=\"codespan\">dataset</code> 的行上面。</li>\n</ul>\n<p>看这个例子:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        source: [\n            [&#39;product&#39;, &#39;2012&#39;, &#39;2013&#39;, &#39;2014&#39;, &#39;2015&#39;],\n            [&#39;Matcha Latte&#39;, 41.1, 30.4, 65.1, 53.3],\n            [&#39;Milk Tea&#39;, 86.5, 92.1, 85.7, 83.1],\n            [&#39;Cheese Cocoa&#39;, 24.1, 67.2, 79.5, 86.4]\n        ]\n    },\n    xAxis: [\n        {type: &#39;category&#39;, gridIndex: 0},\n        {type: &#39;category&#39;, gridIndex: 1}\n    ],\n    yAxis: [\n        {gridIndex: 0},\n        {gridIndex: 1}\n    ],\n    grid: [\n        {bottom: &#39;55%&#39;},\n        {top: &#39;55%&#39;}\n    ],\n    series: [\n        // 这几个系列会在第一个直角坐标系中,每个系列对应到 dataset 的每一行。\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        // 这几个系列会在第二个直角坐标系中,每个系列对应到 dataset 的每一列。\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1}\n    ]\n}\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-series-layout-by&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n<h2 id=\"-dimension-\">维度(dimension)</h2>\n<p>介绍 <code class=\"codespan\">encode</code> 之前,首先要介绍“维度(dimension)”的概念。</p>\n<p>常用图表所描述的数据大部分是“二维表”结构,上述的例子中,我们都使用二维数组来容纳二维表。现在,当我们把系列(series)对应到“列”的时候,那么每一列就称为一个“维度(dimension)”,而每一行称为数据项(item)。反之,如果我们把系列(series)对应到表行,那么每一行就是“维度(dimension)”,每一列就是数据项(item)。</p>\n<p>维度可以有单独的名字,便于在图表中显示。维度名(dimension name)可以在定义在 dataset 的第一行(或者第一列)。例如上面的例子中,<code class=\"codespan\">&#39;score&#39;</code>、<code class=\"codespan\">&#39;amount&#39;</code>、<code class=\"codespan\">&#39;product&#39;</code> 就是维度名。从第二行开始,才是正式的数据。<code class=\"codespan\">dataset.source</code> 中第一行(列)到底包含不包含维度名,ECharts 默认会自动探测。当然也可以设置 <code class=\"codespan\">dataset.sourceHeader: true</code> 显示声明第一行(列)就是维度,或者 <code class=\"codespan\">dataset.sourceHeader: false</code> 表明第一行(列)开始就直接是数据。</p>\n<p>维度的定义,也可以使用单独的 <code class=\"codespan\">dataset.dimensions</code> 或者 <code class=\"codespan\">series.dimensions</code> 来定义,这样可以同时指定维度名,和维度的类型(dimension type):</p>\n<pre><code class=\"lang-js\">var option1 = {\n    dataset: {\n        dimensions: [\n            {name: &#39;score&#39;},\n            // 可以简写为 string,表示维度名。\n            &#39;amount&#39;,\n            // 可以在 type 中指定维度类型。\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ],\n        source: [...]\n    },\n    ...\n};\n\nvar option2 = {\n    dataset: {\n        source: [...]\n    },\n    series: {\n        type: &#39;line&#39;,\n        // 在系列中设置的 dimensions 会更优先采纳。\n        dimensions: [\n            null, // 可以设置为 null 表示不想设置维度名\n            &#39;amount&#39;,\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ]\n    },\n    ...\n};\n</code></pre>\n<p>大多数情况下,我们并不需要去设置维度类型,因为会自动判断。但是如果因为数据为空之类原因导致判断不足够准确时,可以手动设置维度类型。</p>\n<p>维度类型(dimension type)可以取这些值:</p>\n<ul>\n<li><code class=\"codespan\">&#39;number&#39;</code>: 默认,表示普通数据。</li>\n<li><code class=\"codespan\">&#39;ordinal&#39;</code>: 对于类目、文本这些 string 类型的数据,如果需要能在数轴上使用,须是 &#39;ordinal&#39; 类型。ECharts 默认会自动判断这个类型。但是自动判断也是不可能很完备的,所以使用者也可以手动强制指定。</li>\n<li><code class=\"codespan\">&#39;time&#39;</code>: 表示时间数据。设置成 <code class=\"codespan\">&#39;time&#39;</code> 则能支持自动解析数据成时间戳(timestamp),比如该维度的数据是 &#39;2017-05-10&#39;,会自动被解析。如果这个维度被用在时间数轴(<a href=\"option.html#xAxis.type\" target=\"_blank\">axis.type</a> 为 <code class=\"codespan\">&#39;time&#39;</code>)上,那么会被自动设置为 <code class=\"codespan\">&#39;time&#39;</code> 类型。时间类型的支持参见 <a href=\"option.html#series.data\" target=\"_blank\">data</a>。</li>\n<li><code class=\"codespan\">&#39;float&#39;</code>: 如果设置成 <code class=\"codespan\">&#39;float&#39;</code>,在存储时候会使用 <code class=\"codespan\">TypedArray</code>,对性能优化有好处。</li>\n<li><code class=\"codespan\">&#39;int&#39;</code>: 如果设置成 <code class=\"codespan\">&#39;int&#39;</code>,在存储时候会使用 <code class=\"codespan\">TypedArray</code>,对性能优化有好处。</li>\n</ul>\n<h2 id=\"-series-encode-\">数据到图形的映射( series.encode )</h2>\n<p>了解了维度的概念后,我们就可以使用 <a href=\"option.html#series.encode\" target=\"_blank\">encode</a> 来做映射。总体是这样的感觉:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [&#39;score&#39;, &#39;amount&#39;, &#39;product&#39;],\n            [89.3, 58212, &#39;Matcha Latte&#39;],\n            [57.1, 78254, &#39;Milk Tea&#39;],\n            [74.4, 41032, &#39;Cheese Cocoa&#39;],\n            [50.1, 12755, &#39;Cheese Brownie&#39;],\n            [89.7, 20145, &#39;Matcha Cocoa&#39;],\n            [68.1, 79146, &#39;Tea&#39;],\n            [19.6, 91852, &#39;Orange Juice&#39;],\n            [10.6, 101852, &#39;Lemon Juice&#39;],\n            [32.7, 20112, &#39;Walnut Brownie&#39;]\n        ]\n    },\n    xAxis: {},\n    yAxis: {type: &#39;category&#39;},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            encode: {\n                // 将 &quot;amount&quot; 列映射到 X 轴。\n                x: &#39;amount&#39;,\n                // 将 &quot;product&quot; 列映射到 Y 轴。\n                y: &#39;product&#39;\n            }\n        }\n    ]\n};\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/dataset-encode-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n\n<p><code class=\"codespan\">series.encode</code> 声明的基本结构如下,其中冒号左边是坐标系、标签等特定名称,如 <code class=\"codespan\">&#39;x&#39;</code>, <code class=\"codespan\">&#39;y&#39;</code>, <code class=\"codespan\">&#39;tooltip&#39;</code> 等,冒号右边是数据中的维度名(string 格式)或者维度的序号(number 格式,从 0 开始计数),可以指定一个或多个维度(使用数组)。通常情况下,下面各种信息不需要所有的都写,按需写即可。</p>\n<p>下面是 <code class=\"codespan\">series.encode</code> 支持的属性:</p>\n<pre><code class=\"lang-js\">// 在任何坐标系和系列中,都支持:\nencode: {\n    // 使用 “名为 product 的维度” 和 “名为 score 的维度” 的值在 tooltip 中显示\n    tooltip: [&#39;product&#39;, &#39;score&#39;]\n    // 使用 “维度 1” 和 “维度 3” 的维度名连起来作为系列名。(有时候名字比较长,这可以避免在 series.name 重复输入这些名字)\n    seriesName: [1, 3],\n    // 表示使用 “维度2” 中的值作为 id。这在使用 setOption 动态更新数据时有用处,可以使新老数据用 id 对应起来,从而能够产生合适的数据更新动画。\n    itemId: 2,\n    // 指定数据项的名称使用 “维度3” 在饼图等图表中有用,可以使这个名字显示在图例(legend)中。\n    itemName: 3\n}\n\n// 直角坐标系(grid/cartesian)特有的属性:\nencode: {\n    // 把 “维度1”、“维度5”、“名为 score 的维度” 映射到 X 轴:\n    x: [1, 5, &#39;score&#39;],\n    // 把“维度0”映射到 Y 轴。\n    y: 0\n}\n\n// 单轴(singleAxis)特有的属性:\nencode: {\n    single: 3\n}\n\n// 极坐标系(polar)特有的属性:\nencode: {\n    radius: 3,\n    angle: 2\n}\n\n// 地理坐标系(geo)特有的属性:\nencode: {\n    lng: 3,\n    lat: 2\n}\n\n// 对于一些没有坐标系的图表,例如饼图、漏斗图等,可以是:\nencode: {\n    value: 3\n}\n</code></pre>\n<p>下面给出个更丰富的 <code class=\"codespan\">series.encode</code> 的示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n<h2 id=\"-\">视觉通道(颜色、尺寸等)的映射</h2>\n<p>我们可以使用 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件进行视觉通道的映射。详见 <code class=\"codespan\">visualMap</code> 文档的介绍。这是一个示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode0&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n<h2 id=\"-encode\">默认的 encode</h2>\n<p>值得一提的是,当 <code class=\"codespan\">series.encode</code> 并没有指定时,ECharts 针对最常见直角坐标系中的图表(折线图、柱状图、散点图、K线图等)、饼图、漏斗图,会采用一些默认的映射规则。默认的映射规则比较简单,大体是:</p>\n<ul>\n<li>在坐标系中(如直角坐标系、极坐标系等)<ul>\n<li>如果有类目轴(axis.type 为 &#39;category&#39;),则将第一列(行)映射到这个轴上,后续每一列(行)对应一个系列。</li>\n<li>如果没有类目轴,假如坐标系有两个轴(例如直角坐标系的 X Y 轴),则每两列对应一个系列,这两列分别映射到这两个轴上。</li>\n</ul>\n</li>\n<li>如果没有坐标系(如饼图)<ul>\n<li>取第一列(行)为名字,第二列(行)为数值(如果只有一列,则取第一列为数值)。</li>\n</ul>\n</li>\n</ul>\n<p>默认的规则不能满足要求时,就可以自己来配置 <code class=\"codespan\">encode</code>,也并不复杂。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-default&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n\n<h2 id=\"-series-encode-\">几个常见的 series.encode 设置方式举例</h2>\n<p>问:如何把第三列设置为 X 轴,第五列设置为 Y 轴?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">series: {\n    // 注意维度序号(dimensionIndex)从 0 开始计数,第三列是 dimensions[2]。\n    encode: {x: 2, y: 4},\n    ...\n}\n</code></pre>\n<p>问:如何把第三行设置为 X 轴,第五行设置为 Y 轴?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {x: 2, y: 4},\n    seriesLayoutBy: &#39;row&#39;,\n    ...\n}\n</code></pre>\n<p>问:如何把第二列设置为标签?</p>\n<p>答:\n关于标签的显示 <a href=\"option.html#series.label.formatter\" target=\"_blank\">label.formatter</a>,现在支持引用特定维度的值,例如:</p>\n<pre><code class=\"lang-js\">series: {\n    label: {\n        // `&#39;{@score}&#39;` 表示 “名为 score” 的维度里的值。\n        // `&#39;{@[4]}&#39;` 表示引用序号为 4 的维度里的值。\n        formatter: &#39;aaa{@product}bbb{@score}ccc{@[4]}ddd&#39;\n    }\n}\n</code></pre>\n<p>问:如何让第 2 列和第 3 列显示在提示框(tooltip)中?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {\n        tooltip: [1, 2]\n        ...\n    },\n    ...\n}\n</code></pre>\n<p>问:数据里没有维度名,那么怎么给出维度名?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">dataset: {\n    dimensions: [&#39;score&#39;, &#39;amount&#39;],\n    source: [\n        [89.3, 3371],\n        [92.1, 8123],\n        [94.4, 1954],\n        [85.4, 829]\n    ]\n}\n</code></pre>\n<p>问:如何把第三列映射为气泡图的点的大小?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [12, 323, 11.2],\n            [23, 167, 8.3],\n            [81, 284, 12],\n            [91, 413, 4.1],\n            [13, 287, 13.5]\n        ]\n    },\n    visualMap: {\n        show: false,\n        dimension: 2, // 指向第三列(列序号从 0 开始记,所以设置为 2)。\n        min: 2, // 需要给出数值范围,最小数值。\n        max: 15, // 需要给出数值范围,最大数值。\n        inRange: {\n            // 气泡尺寸:5 像素到 60 像素。\n            symbolSize: [5, 60]\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: {\n        type: &#39;scatter&#39;\n    }\n};\n</code></pre>\n<p>问:encode 里指定了映射,但是不管用?</p>\n<p>答:可以查查有没有拼错,比如,维度名是:<code class=\"codespan\">&#39;Life Expectancy&#39;</code>,encode 中拼成了 <code class=\"codespan\">&#39;Life Expectency&#39;</code>。</p>\n<h2 id=\"-\">数据的各种格式</h2>\n<p>多数常见图表中,数据适于用二维表的形式描述。广为使用的数据表格软件(如 MS Excel、Numbers)或者关系数据数据库都是二维表。他们的数据可以导出成 JSON 格式,输入到 <code class=\"codespan\">dataset.source</code> 中,在不少情况下可以免去一些数据处理的步骤。</p>\n<blockquote>\n<p>假如数据导出成 csv 文件,那么可以使用一些 csv 工具如 <a href=\"https://github.com/d3/d3-dsv\" target=\"_blank\">dsv</a> 或者 <a href=\"https://github.com/mholt/PapaParse\" target=\"_blank\">PapaParse</a> 将 csv 转成 JSON。</p>\n</blockquote>\n<p>在 JavaScript 常用的数据传输格式中,二维数组可以比较直观的存储二维表。前面的示例都是使用二维数组表示。</p>\n<p>除了二维数组以外,dataset 也支持例如下面 key-value 方式的数据格式,这类格式也非常常见。但是这类格式中,目前并不支持 <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">seriesLayoutBy</a> 参数。</p>\n<pre><code class=\"lang-js\">dataset: [{\n    // 按行的 key-value 形式(对象数组),这是个比较常见的格式。\n    source: [\n        {product: &#39;Matcha Latte&#39;, count: 823, score: 95.8},\n        {product: &#39;Milk Tea&#39;, count: 235, score: 81.4},\n        {product: &#39;Cheese Cocoa&#39;, count: 1042, score: 91.2},\n        {product: &#39;Walnut Brownie&#39;, count: 988, score: 76.9}\n    ]\n}, {\n    // 按列的 key-value 形式。\n    source: {\n        &#39;product&#39;: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;],\n        &#39;count&#39;: [823, 235, 1042, 988],\n        &#39;score&#39;: [95.8, 81.4, 91.2, 76.9]\n    }\n}]\n</code></pre>\n<h2 id=\"-dataset-\">多个 dataset 以及如何引用他们</h2>\n<p>可以同时定义多个 dataset。系列可以通过 <a href=\"option.html#series.datasetIndex\" target=\"_blank\">series.datasetIndex</a> 来指定引用哪个 dataset。例如:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: [{\n        // 序号为 0 的 dataset。\n        source: [...],\n    }, {\n        // 序号为 1 的 dataset。\n        source: [...]\n    }, {\n        // 序号为 2 的 dataset。\n        source: [...]\n    }],\n    series: [{\n        // 使用序号为 2 的 dataset。\n        datasetIndex: 2\n    }, {\n        // 使用序号为 1 的 dataset。\n        datasetIndex: 1\n    }]\n}\n</code></pre>\n<h2 id=\"echarts-3-series-data-\">ECharts 3 的数据设置方式(series.data)仍正常使用</h2>\n<p>ECharts 4 之前一直以来的数据声明方式仍然被正常支持,如果系列已经声明了 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a>, 那么就会使用 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 而非 <code class=\"codespan\">dataset</code>。</p>\n<pre><code class=\"lang-js\">{\n    xAxis: {\n        type: &#39;category&#39;\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [{\n        type: &#39;bar&#39;,\n        name: &#39;2015&#39;,\n        data: [89.3, 92.1, 94.4, 85.4]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2016&#39;,\n        data: [95.8, 89.4, 91.2, 76.9]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2017&#39;,\n        data: [97.7, 83.1, 92.5, 78.1]\n    }]\n}\n</code></pre>\n<p>其实,<a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 也是种会一直存在的重要设置方式。一些特殊的非 table 格式的图表,如 <a href=\"option.html#series-treemap\" target=\"_blank\">treemap</a>、<a href=\"option.html#series-graph\" target=\"_blank\">graph</a>、<a href=\"option.html#series-lines\" target=\"_blank\">lines</a> 等,现在仍不支持在 dataset 中设置,仍然需要使用 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a>。另外,对于巨大数据量的渲染(如百万以上的数据量),需要使用 <a href=\"api.html#echartsInstance.appendData\" target=\"_blank\">appendData</a> 进行增量加载,这种情况不支持使用 <code class=\"codespan\">dataset</code>。</p>\n<h2 id=\"-\">其他</h2>\n<p>目前并非所有图表都支持 dataset。支持 dataset 的图表有:\n<code class=\"codespan\">line</code>、<code class=\"codespan\">bar</code>、<code class=\"codespan\">pie</code>、<code class=\"codespan\">scatter</code>、<code class=\"codespan\">effectScatter</code>、<code class=\"codespan\">parallel</code>、<code class=\"codespan\">candlestick</code>、<code class=\"codespan\">map</code>、<code class=\"codespan\">funnel</code>、<code class=\"codespan\">custom</code>。\n后续会有更多的图表进行支持。</p>\n<p>最后,给出一个示例,多个图表共享一个 <code class=\"codespan\">dataset</code>,并带有联动交互:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-link&edit=1&reset=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n\n\n"},"在图表中加入交互组件":{"type":["*"],"description":"<p>除了图表外 Apache ECharts (incubating)<sup>TM</sup> 中,提供了很多交互组件。例如:</p>\n<p><code class=\"codespan\">图例组件</code> <a href=\"option.html#legend\" target=\"_blank\">legend</a>、<code class=\"codespan\">标题组件</code> <a href=\"option.html#title\" target=\"_blank\">title</a>、<code class=\"codespan\">视觉映射组件</code> <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>、<code class=\"codespan\">数据区域缩放组件</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>、<code class=\"codespan\">时间线组件</code> <a href=\"option.html#timeline\" target=\"_blank\">timeline</a></p>\n<p>下面以 <code class=\"codespan\">数据区域缩放组件</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> 为例,介绍如何加入这种组件。</p>\n<h2 id=\"-datazoom-\">数据区域缩放组件(dataZoom)介绍</h2>\n<p>『概览数据整体,按需关注数据细节』是数据可视化的基本交互需求。<code class=\"codespan\">dataZoom</code> 组件能够在直角坐标系(<a href=\"option.html#grid\" target=\"_blank\">grid</a>)、极坐标系(<a href=\"option.html#polar\" target=\"_blank\">polar</a>)中实现这一功能。</p>\n<p><strong>如下例子:</strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-dataZoom-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<ul>\n<li><code class=\"codespan\">dataZoom</code> 组件是对 <code class=\"codespan\">数轴(axis)</code> 进行『数据窗口缩放』『数据窗口平移』操作。</li>\n</ul>\n<blockquote>\n<p>可以通过 <a href=\"option.html#dataZoom.xAxisIndex\" target=\"_blank\">dataZoom.xAxisIndex</a> 或 <a href=\"option.html#dataZoom.yAxisIndex\" target=\"_blank\">dataZoom.yAxisIndex</a> 来指定 <code class=\"codespan\">dataZoom</code> 控制哪个或哪些数轴。</p>\n</blockquote>\n<ul>\n<li><p><code class=\"codespan\">dataZoom</code> 组件可同时存在多个,起到共同控制的作用。控制同一个数轴的组件,会自动联动。下面例子中会详细说明。</p>\n</li>\n<li><p><code class=\"codespan\">dataZoom</code> 的运行原理是通过『数据过滤』来达到『数据窗口缩放』的效果。</p>\n<p>  数据过滤模式的设置不同,效果也不同,参见:<a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a>。</p>\n</li>\n<li><p><code class=\"codespan\">dataZoom</code> 的数据窗口范围的设置,目前支持两种形式:</p>\n<ul>\n<li><p>百分比形式:参见 <a href=\"option.html#dataZoom.start\" target=\"_blank\">dataZoom.start</a> 和 <a href=\"option.html#dataZoom.end\" target=\"_blank\">dataZoom.end</a>。</p>\n</li>\n<li><p>绝对数值形式:参见 <a href=\"option.html#dataZoom.startValue\" target=\"_blank\">dataZoom.startValue</a> 和 <a href=\"option.html#dataZoom.endValue\" target=\"_blank\">dataZoom.endValue</a>。</p>\n</li>\n</ul>\n</li>\n</ul>\n<p><strong>dataZoom 组件现在支持几种子组件:</strong></p>\n<ul>\n<li><p><a href=\"option.html#dataZoom-inside\" target=\"_blank\">内置型数据区域缩放组件(dataZoomInside)</a>:内置于坐标系中。</p>\n</li>\n<li><p><a href=\"option.html#dataZoom-slider\" target=\"_blank\">滑动条型数据区域缩放组件(dataZoomSlider)</a>:有单独的滑动条操作。</p>\n</li>\n<li><p><a href=\"option.html#toolbox.feature.dataZoom\" target=\"_blank\">框选型数据区域缩放组件(dataZoomSelect)</a>:全屏的选框进行数据区域缩放。入口和配置项均在 <code class=\"codespan\">toolbox</code>中。</p>\n</li>\n</ul>\n<h2 id=\"-datazoom-\">在代码加入 dataZoom 组件</h2>\n<p>先只在对单独一个横轴,加上 dataZoom 组件,代码示例如下:</p>\n<pre><code class=\"lang-javascript\">\noption = {\n    xAxis: {\n        type: &#39;value&#39;\n    },\n    yAxis: {\n        type: &#39;value&#39;\n    },\n    dataZoom: [\n        {   // 这个dataZoom组件,默认控制x轴。\n            type: &#39;slider&#39;, // 这个 dataZoom 组件是 slider 型 dataZoom 组件\n            start: 10,      // 左边在 10% 的位置。\n            end: 60         // 右边在 60% 的位置。\n        }\n    ],\n    series: [\n        {\n            type: &#39;scatter&#39;, // 这是个『散点图』\n            itemStyle: {\n                opacity: 0.8\n            },\n            symbolSize: function (val) {\n                return val[2] * 40;\n            },\n            data: [[&quot;14.616&quot;,&quot;7.241&quot;,&quot;0.896&quot;],[&quot;3.958&quot;,&quot;5.701&quot;,&quot;0.955&quot;],[&quot;2.768&quot;,&quot;8.971&quot;,&quot;0.669&quot;],[&quot;9.051&quot;,&quot;9.710&quot;,&quot;0.171&quot;],[&quot;14.046&quot;,&quot;4.182&quot;,&quot;0.536&quot;],[&quot;12.295&quot;,&quot;1.429&quot;,&quot;0.962&quot;],[&quot;4.417&quot;,&quot;8.167&quot;,&quot;0.113&quot;],[&quot;0.492&quot;,&quot;4.771&quot;,&quot;0.785&quot;],[&quot;7.632&quot;,&quot;2.605&quot;,&quot;0.645&quot;],[&quot;14.242&quot;,&quot;5.042&quot;,&quot;0.368&quot;]]\n        }\n    ]\n}\n</code></pre>\n<p>可以看到如下结果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-1&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p><br></p>\n<p>上面的图只能拖动 dataZoom 组件导致窗口变化。如果想在坐标系内进行拖动,以及用滚轮(或移动触屏上的两指滑动)进行缩放,那么要再加上一个 inside 型的 dataZoom组件。直接在上面的 <code class=\"codespan\">option.dataZoom</code> 中增加即可:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {   // 这个dataZoom组件,默认控制x轴。\n            type: &#39;slider&#39;, // 这个 dataZoom 组件是 slider 型 dataZoom 组件\n            start: 10,      // 左边在 10% 的位置。\n            end: 60         // 右边在 60% 的位置。\n        },\n        {   // 这个dataZoom组件,也控制x轴。\n            type: &#39;inside&#39;, // 这个 dataZoom 组件是 inside 型 dataZoom 组件\n            start: 10,      // 左边在 10% 的位置。\n            end: 60         // 右边在 60% 的位置。\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>可以看到如下结果(能在坐标系中进行滑动,以及使用滚轮缩放了):</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-2&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<p><br></p>\n<p>如果想 y 轴也能够缩放,那么在 y 轴上也加上 dataZoom 组件:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {\n            type: &#39;slider&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;inside&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;slider&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        },\n        {\n            type: &#39;inside&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>可以看到如下结果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-3&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n\n\n\n\n"},"移动端自适应":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 工作在用户指定高宽的 DOM 节点(容器)中。ECharts 的『组件』和『系列』都在这个 DOM 节点中,每个节点都可以由用户指定位置。图表库内部并不适宜实现 DOM 文档流布局,因此采用类似绝对布局的简单容易理解的布局方式。但是有时候容器尺寸极端时,这种方式并不能自动避免组件重叠的情况,尤其在移动端小屏的情况下。</p>\n<p>另外,有时会出现一个图表需要同时在PC、移动端上展现的场景。这需要 ECharts 内部组件随着容器尺寸变化而变化的能力。</p>\n<p>为了解决这个问题,ECharts 完善了组件的定位设置,并且实现了类似 <a href=\"https://www.w3.org/TR/css3-mediaqueries/\" target=\"_blank\">CSS Media Query</a> 的自适应能力。</p>\n<h2 id=\"echarts-\">ECharts组件的定位和布局</h2>\n<p>大部分『组件』和『系列』会遵循两种定位方式:</p>\n<p><br>\n<strong>left/right/top/bottom/width/height 定位方式:</strong></p>\n<p>这六个量中,每个量都可以是『绝对值』或者『百分比』或者『位置描述』。</p>\n<ul>\n<li><p>绝对值</p>\n<p>  单位是浏览器像素(px),用 <code class=\"codespan\">number</code> 形式书写(不写单位)。例如 <code class=\"codespan\">{left: 23, height: 400}</code>。</p>\n</li>\n<li><p>百分比</p>\n<p>  表示占 DOM 容器高宽的百分之多少,用 <code class=\"codespan\">string</code> 形式书写。例如 <code class=\"codespan\">{right: &#39;30%&#39;, bottom: &#39;40%&#39;}</code>。</p>\n</li>\n<li><p>位置描述</p>\n<ul>\n<li>可以设置 <code class=\"codespan\">left: &#39;center&#39;</code>,表示水平居中。</li>\n<li>可以设置 <code class=\"codespan\">top: &#39;middle&#39;</code>,表示垂直居中。</li>\n</ul>\n</li>\n</ul>\n<p>这六个量的概念,和 CSS 中六个量的概念类似:</p>\n<ul>\n<li>left:距离 DOM 容器左边界的距离。</li>\n<li>right:距离 DOM 容器右边界的距离。</li>\n<li>top:距离 DOM 容器上边界的距离。</li>\n<li>bottom:距离 DOM 容器下边界的距离。</li>\n<li>width:宽度。</li>\n<li>height:高度。</li>\n</ul>\n<p>在横向,<code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">width</code> 三个量中,只需两个量有值即可,因为任两个量可以决定组件的位置和大小,例如 <code class=\"codespan\">left</code> 和 <code class=\"codespan\">right</code> 或者 <code class=\"codespan\">right</code> 和 <code class=\"codespan\">width</code> 都可以决定组件的位置和大小。\n纵向,<code class=\"codespan\">top</code>、<code class=\"codespan\">bottom</code>、<code class=\"codespan\">height</code> 三个量,和横向类同不赘述。</p>\n<p><br>\n<strong><code class=\"codespan\">center</code> / <code class=\"codespan\">radius</code> 定位方式:</strong></p>\n<ul>\n<li><p><code class=\"codespan\">center</code></p>\n<p>  是一个数组,表示 <code class=\"codespan\">[x, y]</code>,其中,<code class=\"codespan\">x</code>、<code class=\"codespan\">y</code>可以是『绝对值』或者『百分比』,含义和前述相同。</p>\n</li>\n<li><p><code class=\"codespan\">radius</code></p>\n<p>  是一个数组,表示 <code class=\"codespan\">[内半径, 外半径]</code>,其中,内外半径可以是『绝对值』或者『百分比』,含义和前述相同。</p>\n<p>  在自适应容器大小时,百分比设置是很有用的。</p>\n</li>\n</ul>\n<p><br>\n<strong>横向(horizontal)和纵向(vertical)</strong></p>\n<p>ECharts的『外观狭长』型的组件(如 <code class=\"codespan\">legend</code>、<code class=\"codespan\">visualMap</code>、<code class=\"codespan\">dataZoom</code>、<code class=\"codespan\">timeline</code>等),大多提供了『横向布局』『纵向布局』的选择。例如,在细长的移动端屏幕上,可能适合使用『纵向布局』;在PC宽屏上,可能适合使用『横向布局』。</p>\n<p>横纵向布局的设置,一般在『组件』或者『系列』的 <code class=\"codespan\">orient</code> 或者 <code class=\"codespan\">layout</code> 配置项上,设置为 <code class=\"codespan\">&#39;horizontal&#39;</code> 或者 <code class=\"codespan\">&#39;vertical&#39;</code>。</p>\n<p><br>\n<strong>与 ECharts2 的兼容:</strong></p>\n<p>ECharts2 中的 <code class=\"codespan\">x/x2/y/y2</code> 的命名方式仍被兼容,对应于 <code class=\"codespan\">left/right/top/bottom</code>。但是建议写 <code class=\"codespan\">left/right/top/bottom</code>。</p>\n<p>位置描述中,为兼容 ECharts2,可以支持一些看起来略奇怪的设置:<code class=\"codespan\">left: &#39;right&#39;</code>、<code class=\"codespan\">left: &#39;left&#39;</code>、<code class=\"codespan\">top: &#39;bottom&#39;</code>、<code class=\"codespan\">top: &#39;top&#39;</code>。这些语句分别等效于:<code class=\"codespan\">right: 0</code>、<code class=\"codespan\">left: 0</code>、<code class=\"codespan\">bottom: 0</code>、<code class=\"codespan\">top: 0</code>,写成后者就不奇怪了。</p>\n<h2 id=\"media-query\">Media Query</h2>\n<p><a href=\"https://www.w3.org/TR/css3-mediaqueries/#media1\" target=\"_blank\">Media Query</a> 提供了『随着容器尺寸改变而改变』的能力。</p>\n<p>如下例子,可尝试拖动<strong>右下角的圆点</strong>,随着尺寸变化,legend 和 系列会自动改变布局位置和方式。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-media&edit=1&reset=1\" width=\"750\" height=\"600\" ></iframe>\n\n\n<p>要在 option 中设置 Media Query 须遵循如下格式:</p>\n<pre><code class=\"lang-javascript\">option = {\n    baseOption: { // 这里是基本的『原子option』。\n        title: {...},\n        legend: {...},\n        series: [{...}, {...}, ...],\n        ...\n    },\n    media: [ // 这里定义了 media query 的逐条规则。\n        {\n            query: {...},   // 这里写规则。\n            option: {       // 这里写此规则满足下的option。\n                legend: {...},\n                ...\n            }\n        },\n        {\n            query: {...},   // 第二个规则。\n            option: {       // 第二个规则对应的option。\n                legend: {...},\n                ...\n            }\n        },\n        {                   // 这条里没有写规则,表示『默认』,\n            option: {       // 即所有规则都不满足时,采纳这个option。\n                legend: {...},\n                ...\n            }\n        }\n    ]\n};\n</code></pre>\n<p>上面的例子中,<code class=\"codespan\">baseOption</code>、以及 <code class=\"codespan\">media</code> 每个 option 都是『原子 option』,即普通的含有各组件、系列定义的 option。而由『原子option』组合成的整个 option,我们称为『复合 option』。<code class=\"codespan\">baseOption</code> 是必然被使用的,此外,满足了某个 <code class=\"codespan\">query</code> 条件时,对应的 option 会被使用 <code class=\"codespan\">chart.mergeOption()</code> 来 merge 进去。</p>\n<p><strong>query:</strong></p>\n<p>每个 <code class=\"codespan\">query</code> 类似于这样:</p>\n<pre><code class=\"lang-javascript\">{\n    minWidth: 200,\n    maxHeight: 300,\n    minAspectRatio: 1.3\n}\n</code></pre>\n<p>现在支持三个属性:<code class=\"codespan\">width</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">aspectRatio</code>(长宽比)。每个属性都可以加上 <code class=\"codespan\">min</code> 或 <code class=\"codespan\">max</code> 前缀。比如,<code class=\"codespan\">minWidth: 200</code> 表示『大于等于200px宽度』。两个属性一起写表示『并且』,比如:<code class=\"codespan\">{minWidth: 200, maxHeight: 300}</code> 表示『大于等于200px宽度,并且小于等于300px高度』。</p>\n<p><strong>option:</strong></p>\n<p><code class=\"codespan\">media</code>中的 option 既然是『原子 option』,理论上可以写任何 option 的配置项。但是一般我们只写跟布局定位相关的,例如截取上面例子中的一部分 query option:</p>\n<pre><code class=\"lang-javascript\">media: [\n    ...,\n    {\n        query: {\n            maxAspectRatio: 1           // 当长宽比小于1时。\n        },\n        option: {\n            legend: {                   // legend 放在底部中间。\n                right: &#39;center&#39;,\n                bottom: 0,\n                orient: &#39;horizontal&#39;    // legend 横向布局。\n            },\n            series: [                   // 两个饼图左右布局。\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;70%&#39;]\n                }\n            ]\n        }\n    },\n    {\n        query: {\n            maxWidth: 500               // 当容器宽度小于 500 时。\n        },\n        option: {\n            legend: {\n                right: 10,              // legend 放置在右侧中间。\n                top: &#39;15%&#39;,\n                orient: &#39;vertical&#39;      // 纵向布局。\n            },\n            series: [                   // 两个饼图上下布局。\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;75%&#39;]\n                }\n            ]\n        }\n    },\n    ...\n]\n</code></pre>\n<p><strong>多个 query 被满足时的优先级:</strong></p>\n<p>注意,可以有多个 <code class=\"codespan\">query</code> 同时被满足,会都被 <code class=\"codespan\">mergeOption</code>,定义在后的后被 merge(即优先级更高)。</p>\n<p><strong>默认 query:</strong></p>\n<p>如果 <code class=\"codespan\">media</code> 中有某项不写 <code class=\"codespan\">query</code>,则表示『默认值』,即所有规则都不满足时,采纳这个option。</p>\n<p><strong>容器大小实时变化时的注意事项:</strong></p>\n<p>在不少情况下,并不需要容器DOM节点任意随着拖拽变化大小,而是只是根据不同终端设置几个典型尺寸。</p>\n<p>但是如果容器DOM节点需要能任意随着拖拽变化大小,那么目前使用时需要注意这件事:某个配置项,如果在某一个 <code class=\"codespan\">query option</code> 中出现,那么在其他 <code class=\"codespan\">query option</code> 中也必须出现,否则不能够回归到原来的状态。(<code class=\"codespan\">left/right/top/bottom/width/height</code> 不受这个限制。)</p>\n<p><strong>『复合 option』 中的 <code class=\"codespan\">media</code> 不支持 merge</strong></p>\n<p>也就是说,当第二(或三、四、五 ...)次 <code class=\"codespan\">chart.setOption(rawOption)</code> 时,如果 <code class=\"codespan\">rawOption</code> 是 <code class=\"codespan\">复合option</code>(即包含 <code class=\"codespan\">media</code> 列表),那么新的 <code class=\"codespan\">rawOption.media</code> 列表不会和老的 <code class=\"codespan\">media</code> 列表进行 merge,而是简单替代。当然,<code class=\"codespan\">rawOption.baseOption</code> 仍然会正常和老的 option 进行merge。</p>\n<p>其实,很少有场景需要使用『复合 option』来多次 <code class=\"codespan\">setOption</code>,而我们推荐的做法是,使用 mediaQuery 时,第一次setOption使用『复合 option』,后面 <code class=\"codespan\">setOption</code> 时仅使用 『原子 option』,也就是仅仅用 setOption 来改变 <code class=\"codespan\">baseOption</code>。</p>\n<p><br>\n最后看一个和时间轴结合的例子:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/bar-media-timeline&edit=1&reset=1\" width=\"750\" height=\"700\" ></iframe>\n\n\n\n\n\n"},"数据的视觉映射":{"type":["*"],"description":"<p>数据可视化是 <strong>数据</strong> 到 <strong>视觉元素</strong> 的映射过程(这个过程也可称为视觉编码,视觉元素也可称为视觉通道)。</p>\n<p>Apache ECharts (incubating)<sup>TM</sup> 的每种图表本身就内置了这种映射过程,比如折线图把数据映射到『线』,柱状图把数据映射到『长度』。一些更复杂的图表,如 <code class=\"codespan\">graph</code>、<code class=\"codespan\">事件河流图</code>、<code class=\"codespan\">treemap</code> 也都会做出他们内置的映射。</p>\n<p>此外,ECharts 还提供了 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap 组件</a> 来提供通用的视觉映射。<code class=\"codespan\">visualMap</code> 组件中可以使用的视觉元素有:<br>\n<code class=\"codespan\">图形类别(symbol)</code>、<code class=\"codespan\">图形大小(symbolSize)</code><br>\n<code class=\"codespan\">颜色(color)</code>、<code class=\"codespan\">透明度(opacity)</code>、<code class=\"codespan\">颜色透明度(colorAlpha)</code>、<br>\n<code class=\"codespan\">颜色明暗度(colorLightness)</code>、<code class=\"codespan\">颜色饱和度(colorSaturation)</code>、<code class=\"codespan\">色调(colorHue)</code></p>\n<p>下面对 <code class=\"codespan\">visualMap</code> 组件的使用方式进行简要的介绍。</p>\n<h2 id=\"-\">数据和维度</h2>\n<p>ECharts中的数据,一般存放于 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 中。根据图表类型不同,数据的具体形式也可能有些许差异。比如可能是『线性表』、『树』、『图』等。但他们都有个共性:都是『数据项(dataItem)』的集合。每个数据项含有『数据值(value)』和其他信息(如果需要的话)。每个数据值,可以是单一的数值(一维)或者一个数组(多维)。</p>\n<p>例如,<a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 最常见的形式,是『线性表』,即一个普通数组:</p>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {       // 这里每一个项就是数据项(dataItem)\n            value: 2323, // 这是数据项的数据值(value)\n            itemStyle: {...}\n        },\n        1212,   // 也可以直接是 dataItem 的 value,这更常见。\n        2323,   // 每个 value 都是『一维』的。\n        4343,\n        3434\n    ]\n}\n</code></pre>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {                        // 这里每一个项就是数据项(dataItem)\n            value: [3434, 129,  &#39;圣马力诺&#39;], // 这是数据项的数据值(value)\n            itemStyle: {...}\n        },\n        [1212, 5454, &#39;梵蒂冈&#39;],   // 也可以直接是 dataItem 的 value,这更常见。\n        [2323, 3223, &#39;瑙鲁&#39;],     // 每个 value 都是『三维』的,每列是一个维度。\n        [4343, 23,   &#39;图瓦卢&#39;]    // 假如是『气泡图』,常见第一维度映射到x轴,\n                                 // 第二维度映射到y轴,\n                                 // 第三维度映射到气泡半径(symbolSize)\n    ]\n}\n</code></pre>\n<p>在图表中,往往默认把 value 的前一两个维度进行映射,比如取第一个维度映射到x轴,取第二个维度映射到y轴。如果想要把更多的维度展现出来,可以借助 <code class=\"codespan\">visualMap</code> 。最常见的情况,<a href=\"option.html#series-scatter\" target=\"_blank\">气泡图(scatter)</a> 使用半径展现了第三个维度。</p>\n<h2 id=\"visualmap-\">visualMap 组件</h2>\n<p>visualMap 组件定义了把数据的『哪个维度』映射到『什么视觉元素上』。</p>\n<p>现在提供如下两种类型的visualMap组件,通过 <a href=\"option.html#visualMap.type\" target=\"_blank\">visualMap.type</a> 来区分。</p>\n<p>其定义结构例如:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [ // 可以同时定义多个 visualMap 组件。\n        { // 第一个 visualMap 组件\n            type: &#39;continuous&#39;, // 定义为连续型 visualMap\n            ...\n        },\n        { // 第二个 visualMap 组件\n            type: &#39;piecewise&#39;, // 定义为分段型 visualMap\n            ...\n        }\n    ],\n    ...\n};\n</code></pre>\n<p><br>\n<a href=\"option.html#visualMap-continuous\" target=\"_blank\">连续型(visualMapContinuous)</a></p>\n<p><a href=\"option.html#visualMap-piecewise\" target=\"_blank\">分段型(visualMapPiecewise)</a>:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-visualMap-piecewise&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br>\n分段型视觉映射组件(visualMapPiecewise),有三种模式:</p>\n<ul>\n<li>连续型数据平均分段: 依据 <a href=\"option.html#visualMap-piecewise.splitNumber\" target=\"_blank\">visualMap-piecewise.splitNumber</a> 来自动平均分割成若干块。</li>\n<li>连续型数据自定义分段: 依据 <a href=\"option.html#visualMap-piecewise.pieces\" target=\"_blank\">visualMap-piecewise.pieces</a> 来定义每块范围。</li>\n<li>离散数据(类别性数据): 类别定义在 <a href=\"option.html#visualMap-piecewise.categories\" target=\"_blank\">visualMap-piecewise.categories</a> 中。</li>\n</ul>\n<p><br>\n<strong>视觉映射方式的配置</strong></p>\n<p>既然是『数据』到『视觉元素』的映射,<code class=\"codespan\">visualMap</code> 中可以指定数据的『哪个维度』(参见<a href=\"#visualMap.dimension\">visualMap.dimension</a>)映射到哪些『视觉元素』(参见 <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> 和 <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>)中。</p>\n<p>例一:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            type: &#39;piecewise&#39;,\n            min: 0,\n            max: 5000,\n            dimension: 3,       // series.data 的第四个维度(即 value[3])被映射\n            seriesIndex: 4,     // 对第四个系列进行映射。\n            inRange: {          // 选中范围中的视觉配置\n                color: [&#39;blue&#39;, &#39;#121122&#39;, &#39;red&#39;], // 定义了图形颜色映射的颜色列表,\n                                                    // 数据最小值映射到&#39;blue&#39;上,\n                                                    // 最大值映射到&#39;red&#39;上,\n                                                    // 其余自动线性计算。\n                symbolSize: [30, 100]               // 定义了图形尺寸的映射范围,\n                                                    // 数据最小值映射到30上,\n                                                    // 最大值映射到100上,\n                                                    // 其余自动线性计算。\n            },\n            outOfRange: {       // 选中范围外的视觉配置\n                symbolSize: [30, 100]\n            }\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>例二:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            ...,\n            inRange: {          // 选中范围中的视觉配置\n                colorLightness: [0.2, 1], // 映射到明暗度上。也就是对本来的颜色进行明暗度处理。\n                                          // 本来的颜色可能是从全局色板中选取的颜色,visualMap组件并不关心。\n                symbolSize: [30, 100]\n            },\n            ...\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>更多详情,参见 <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> 和 <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>。</p>\n"},"ECharts 中的事件和行为":{"type":["*"],"description":"<p>在 Apache ECharts (incubating)<sup>TM</sup> 的图表中用户的操作将会触发相应的事件。开发者可以监听这些事件,然后通过回调函数做相应的处理,比如跳转到一个地址,或者弹出对话框,或者做数据下钻等等。</p>\n<p>在 ECharts 3 中绑定事件跟 2 一样都是通过 <a href=\"api.html#EChartsInstance.on\" target=\"_blank\">on</a> 方法,但是事件名称比 2 更加简单了。ECharts 3 中,事件名称对应 DOM 事件名称,均为小写的字符串,如下是一个绑定点击操作的示例。</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    // 控制台打印数据的名称\n    console.log(params.name);\n});\n</code></pre>\n<p>在 ECharts 中事件分为两种类型,一种是用户鼠标操作点击,或者 hover 图表的图形时触发的事件,还有一种是用户在使用可以交互的组件后触发的行为事件,例如在切换图例开关时触发的 <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;legendselectchanged&#39;</a> 事件(这里需要注意切换图例开关是不会触发<code class=\"codespan\">&#39;legendselected&#39;</code>事件的),数据区域缩放时触发的 <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;datazoom&#39;</a> 事件等等。</p>\n<h2 id=\"-\">鼠标事件的处理</h2>\n<p>ECharts 支持常规的鼠标事件类型,包括 <code class=\"codespan\">&#39;click&#39;</code>、<code class=\"codespan\">&#39;dblclick&#39;</code>、<code class=\"codespan\">&#39;mousedown&#39;</code>、<code class=\"codespan\">&#39;mousemove&#39;</code>、<code class=\"codespan\">&#39;mouseup&#39;</code>、<code class=\"codespan\">&#39;mouseover&#39;</code>、<code class=\"codespan\">&#39;mouseout&#39;</code>、<code class=\"codespan\">&#39;globalout&#39;</code>、<code class=\"codespan\">&#39;contextmenu&#39;</code> 事件。下面先来看一个简单的点击柱状图后打开相应的百度搜索页面的示例。</p>\n<pre><code class=\"lang-js\">// 基于准备好的dom,初始化ECharts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n// 指定图表的配置项和数据\nvar option = {\n    xAxis: {\n        data: [&quot;衬衫&quot;,&quot;羊毛衫&quot;,&quot;雪纺衫&quot;,&quot;裤子&quot;,&quot;高跟鞋&quot;,&quot;袜子&quot;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n};\n// 使用刚指定的配置项和数据显示图表。\nmyChart.setOption(option);\n// 处理点击事件并且跳转到相应的百度搜索页面\nmyChart.on(&#39;click&#39;, function (params) {\n    window.open(&#39;https://www.baidu.com/s?wd=&#39; + encodeURIComponent(params.name));\n});\n</code></pre>\n<p>所有的鼠标事件包含参数 <code class=\"codespan\">params</code>,这是一个包含点击图形的数据信息的对象,如下格式:</p>\n<pre><code class=\"lang-js\">{\n    // 当前点击的图形元素所属的组件名称,\n    // 其值如 &#39;series&#39;、&#39;markLine&#39;、&#39;markPoint&#39;、&#39;timeLine&#39; 等。\n    componentType: string,\n    // 系列类型。值可能为:&#39;line&#39;、&#39;bar&#39;、&#39;pie&#39; 等。当 componentType 为 &#39;series&#39; 时有意义。\n    seriesType: string,\n    // 系列在传入的 option.series 中的 index。当 componentType 为 &#39;series&#39; 时有意义。\n    seriesIndex: number,\n    // 系列名称。当 componentType 为 &#39;series&#39; 时有意义。\n    seriesName: string,\n    // 数据名,类目名\n    name: string,\n    // 数据在传入的 data 数组中的 index\n    dataIndex: number,\n    // 传入的原始数据项\n    data: Object,\n    // sankey、graph 等图表同时含有 nodeData 和 edgeData 两种 data,\n    // dataType 的值会是 &#39;node&#39; 或者 &#39;edge&#39;,表示当前点击在 node 还是 edge 上。\n    // 其他大部分图表中只有一种 data,dataType 无意义。\n    dataType: string,\n    // 传入的数据值\n    value: number|Array\n    // 数据图形的颜色。当 componentType 为 &#39;series&#39; 时有意义。\n    color: string\n}\n</code></pre>\n<p>如何区分鼠标点击到了哪里:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    if (params.componentType === &#39;markPoint&#39;) {\n        // 点击到了 markPoint 上\n        if (params.seriesIndex === 5) {\n            // 点击到了 index 为 5 的 series 的 markPoint 上。\n        }\n    }\n    else if (params.componentType === &#39;series&#39;) {\n        if (params.seriesType === &#39;graph&#39;) {\n            if (params.dataType === &#39;edge&#39;) {\n                // 点击到了 graph 的 edge(边)上。\n            }\n            else {\n                // 点击到了 graph 的 node(节点)上。\n            }\n        }\n    }\n});\n</code></pre>\n<p>使用 <code class=\"codespan\">query</code> 只对指定的组件的图形元素的触发回调:</p>\n<pre><code class=\"lang-js\">chart.on(eventName, query, handler);\n</code></pre>\n<p><code class=\"codespan\">query</code> 可为 <code class=\"codespan\">string</code> 或者 <code class=\"codespan\">Object</code>。</p>\n<p>如果为 <code class=\"codespan\">string</code> 表示组件类型。格式可以是 &#39;mainType&#39; 或者 &#39;mainType.subType&#39;。例如:</p>\n<pre><code class=\"lang-js\">chart.on(&#39;click&#39;, &#39;series&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;series.line&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;dataZoom&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;xAxis.category&#39;, function () {...});\n</code></pre>\n<p>如果为 <code class=\"codespan\">Object</code>,可以包含以下一个或多个属性,每个属性都是可选的:</p>\n<pre><code class=\"lang-js\">{\n    &lt;mainType&gt;Index: number // 组件 index\n    &lt;mainType&gt;Name: string // 组件 name\n    &lt;mainType&gt;Id: string // 组件 id\n    dataIndex: number // 数据项 index\n    name: string // 数据项 name\n    dataType: string // 数据项 type,如关系图中的 &#39;node&#39;, &#39;edge&#39;\n    element: string // 自定义系列中的 el 的 name\n}\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        name: &#39;uuu&#39;\n        // ...\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesName: &#39;uuu&#39;}, function () {\n    // series name 为 &#39;uuu&#39; 的系列中的图形元素被 &#39;mouseover&#39; 时,此方法被回调。\n});\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        // ...\n    }, {\n        // ...\n        data: [\n            {name: &#39;xx&#39;, value: 121},\n            {name: &#39;yy&#39;, value: 33}\n        ]\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesIndex: 1, name: &#39;xx&#39;}, function () {\n    // series index 1 的系列中的 name 为 &#39;xx&#39; 的元素被 &#39;mouseover&#39; 时,此方法被回调。\n});\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        type: &#39;graph&#39;,\n        nodes: [{name: &#39;a&#39;, value: 10}, {name: &#39;b&#39;, value: 20}],\n        edges: [{source: 0, target: 1}]\n    }]\n});\nchart.on(&#39;click&#39;, {dataType: &#39;node&#39;}, function () {\n    // 关系图的节点被点击时此方法被回调。\n});\nchart.on(&#39;click&#39;, {dataType: &#39;edge&#39;}, function () {\n    // 关系图的边被点击时此方法被回调。\n});\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        // ...\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;,\n                    name: &#39;my_el&#39;,\n                    // ...\n                }, {\n                    // ...\n                }]\n            }\n        },\n        data: [[12, 33]]\n    }\n})\nchart.on(&#39;mouseup&#39;, {element: &#39;my_el&#39;}, function () {\n    // name 为 &#39;my_el&#39; 的元素被 &#39;mouseup&#39; 时,此方法被回调。\n});\n</code></pre>\n<p>你可以在回调函数中获得这个对象中的数据名、系列名称后在自己的数据仓库中索引得到其它的信息候更新图表,显示浮层等等,如下示例代码:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (parmas) {\n    $.get(&#39;detail?q=&#39; + params.name, function (detail) {\n        myChart.setOption({\n            series: [{\n                name: &#39;pie&#39;,\n                // 通过饼图表现单个柱子中的数据分布\n                data: [detail.data]\n            }]\n        });\n    });\n});\n</code></pre>\n<h2 id=\"-\">组件交互的行为事件</h2>\n<p>在 ECharts 中基本上所有的组件交互行为都会触发相应的事件,常用的事件和事件对应参数在 <a href=\"api.html#events\" target=\"_blank\">events</a> 文档中有列出。</p>\n<p>下面是监听一个图例开关的示例:</p>\n<pre><code class=\"lang-js\">// 图例开关的行为只会触发 legendselectchanged 事件\nmyChart.on(&#39;legendselectchanged&#39;, function (params) {\n    // 获取点击图例的选中状态\n    var isSelected = params.selected[params.name];\n    // 在控制台中打印\n    console.log((isSelected ? &#39;选中了&#39; : &#39;取消选中了&#39;) + &#39;图例&#39; + params.name);\n    // 打印所有图例的状态\n    console.log(params.selected);\n});\n</code></pre>\n<h2 id=\"-echarts-\">代码触发 ECharts 中组件的行为</h2>\n<p>上面提到诸如<code class=\"codespan\">&#39;legendselectchanged&#39;</code>事件会由组件交互的行为触发,那除了用户的交互操作,有时候也会有需要在程序里调用方法触发图表的行为,诸如显示 tooltip,选中图例。</p>\n<p>在 ECharts 2.x 是通过 <code class=\"codespan\">myChart.component.tooltip.showTip</code> 这种形式调用相应的接口触发图表行为,入口很深,而且涉及到内部组件的组织。相对地,在 ECharts 3 里改为通过调用 <code class=\"codespan\">myChart.dispatchAction({ type: &#39;&#39; })</code> 触发图表行为,统一管理了所有动作,也可以方便地根据需要去记录用户的行为路径。</p>\n<p>常用的动作和动作对应参数在 <a href=\"api.html#action\" target=\"_blank\">action</a> 文档中有列出。</p>\n<p>下面示例演示了如何通过<code class=\"codespan\">dispatchAction</code>去轮流高亮饼图的每个扇形。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-highlight&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n\n"},"小例子:自己实现拖拽":{"type":["*"],"description":"<p>介绍一个实现拖拽的小例子。这个例子是在原生 Apache ECharts (incubating)<sup>TM</sup> 基础上做了些小小扩展,带有一定的交互性。通过这个例子,我们可以了解到,如何使用 ECharts 提供的 API 实现定制化的富交互的功能。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=line-draggable&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>这个例子主要做到了这样一件事,用鼠标可以拖拽曲线的点,从而改变曲线的形状。例子很简单,但是有了这个基础我们还可以做更多的事情,比如在图中可视化得编辑。所以我们从这个简单的例子开始。</p>\n<p>echarts 本身没有提供封装好的『拖拽改变图表』功能,因为现在认为这个功能并不足够有通用性。那么这个功能就留给开发者用 API 实现,这也有助于开发者按自己的需要个性定制。</p>\n<h2 id=\"-\">(一)实现基本的拖拽功能</h2>\n<p>在这个例子中,基础的图表是一个 <a href=\"option.html#series-line\" target=\"_blank\">折线图 (series-line)</a>。参见如下配置:</p>\n<pre><code class=\"lang-js\">var symbolSize = 20;\n\n// 这个 data 变量在这里单独声明,在后面也会用到。\nvar data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\nmyChart.setOption({\n    xAxis: {\n        min: -100,\n        max: 80,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    yAxis: {\n        min: -30,\n        max: 60,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    series: [\n        {\n            id: &#39;a&#39;,\n            type: &#39;line&#39;,\n            smooth: true,\n            symbolSize: symbolSize, // 为了方便拖拽,把 symbolSize 尺寸设大了。\n            data: data\n        }\n    ]\n});\n</code></pre>\n<p>既然折线中原生的点没有拖拽功能,我们就为它加上拖拽功能:用 <a href=\"option.html#graphic\" target=\"_blank\">graphic</a> 组件,在每个点上面,覆盖一个隐藏的可拖拽的圆点。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    // 声明一个 graphic component,里面有若干个 type 为 &#39;circle&#39; 的 graphic elements。\n    // 这里使用了 echarts.util.map 这个帮助方法,其行为和 Array.prototype.map 一样,但是兼容 es5 以下的环境。\n    // 用 map 方法遍历 data 的每项,为每项生成一个圆点。\n    graphic: echarts.util.map(data, function (dataItem, dataIndex) {\n        return {\n            // &#39;circle&#39; 表示这个 graphic element 的类型是圆点。\n            type: &#39;circle&#39;,\n\n            shape: {\n                // 圆点的半径。\n                r: symbolSize / 2\n            },\n            // 用 transform 的方式对圆点进行定位。position: [x, y] 表示将圆点平移到 [x, y] 位置。\n            // 这里使用了 convertToPixel 这个 API 来得到每个圆点的位置,下面介绍。\n            position: myChart.convertToPixel(&#39;grid&#39;, dataItem),\n\n            // 这个属性让圆点不可见(但是不影响他响应鼠标事件)。\n            invisible: true,\n            // 这个属性让圆点可以被拖拽。\n            draggable: true,\n            // 把 z 值设得比较大,表示这个圆点在最上方,能覆盖住已有的折线图的圆点。\n            z: 100,\n            // 此圆点的拖拽的响应事件,在拖拽过程中会不断被触发。下面介绍详情。\n            // 这里使用了 echarts.util.curry 这个帮助方法,意思是生成一个与 onPointDragging\n            // 功能一样的新的函数,只不过第一个参数永远为此时传入的 dataIndex 的值。\n            ondrag: echarts.util.curry(onPointDragging, dataIndex)\n        };\n    })\n});\n</code></pre>\n<p>上面的代码中,使用 <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a> 这个 API,进行了从 data 到『像素坐标』的转换,从而得到了每个圆点应该在的位置,从而能绘制这些圆点。<code class=\"codespan\">myChart.convertToPixel(&#39;grid&#39;, dataItem)</code> 这句话中,第一个参数 <code class=\"codespan\">&#39;grid&#39;</code> 表示 <code class=\"codespan\">dataItem</code> 在 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 这个组件中(即直角坐标系)中进行转换。所谓『像素坐标』,就是以 echarts 容器 dom element 的左上角为零点的以像素为单位的坐标系中的坐标。</p>\n<p>注意这件事需要在第一次 setOption 后再进行,也就是说,须在坐标系(<a href=\"option.html#grid\" target=\"_blank\">grid</a>)初始化后才能调用 <code class=\"codespan\">myChart.convertToPixel(&#39;grid&#39;, dataItem)</code>。</p>\n<p>有了这段代码后,就有了诸个能拖拽的点。接下来要为每个点,加上拖拽响应的事件:</p>\n<pre><code class=\"lang-js\">// 拖拽某个圆点的过程中会不断调用此函数。\n// 此函数中会根据拖拽后的新位置,改变 data 中的值,并用新的 data 值,重绘折线图,从而使折线图同步于被拖拽的隐藏圆点。\nfunction onPointDragging(dataIndex) {\n    // 这里的 data 就是本文最初的代码块中声明的 data,在这里会被更新。\n    // 这里的 this 就是被拖拽的圆点。this.position 就是圆点当前的位置。\n    data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n    // 用更新后的 data,重绘折线图。\n    myChart.setOption({\n        series: [{\n            id: &#39;a&#39;,\n            data: data\n        }]\n    });\n}\n</code></pre>\n<p>上面的代码中,使用了 <a href=\"api.html#echartsInstance.convertFromPixel\" target=\"_blank\">convertFromPixel</a> 这个 API。它是 <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a> 的逆向过程。<code class=\"codespan\">myChart.convertFromPixel(&#39;grid&#39;, this.position)</code> 表示把当前像素坐标转换成 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件中直角坐标系的 dataItem 值。</p>\n<p>最后,为了使 dom 尺寸改变时,图中的元素能自适应得变化,加上这些代码:</p>\n<pre><code class=\"lang-js\">window.addEventListener(&#39;resize&#39;, function () {\n    // 对每个拖拽圆点重新计算位置,并用 setOption 更新。\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                position: myChart.convertToPixel(&#39;grid&#39;, item)\n            };\n        })\n    });\n});\n\n</code></pre>\n<h2 id=\"-tooltip-\">(二)添加 tooltip 组件</h2>\n<p>到此,拖拽的基本功能就完成了。但是想要更进一步得实时看到拖拽过程中,被拖拽的点的 data 值的变化状况,我们可以使用 <a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a> 组件来实时显示这个值。但是,tooltip 有其默认的『显示』『隐藏』触发规则,在我们拖拽的场景中并不适用,所以我们还要手动定制 tooltip 的『显示』『隐藏』行为。</p>\n<p>在上述代码中分别添加如下定义:</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    ...,\n    tooltip: {\n        // 表示不使用默认的『显示』『隐藏』触发规则。\n        triggerOn: &#39;none&#39;,\n        formatter: function (params) {\n            return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n        }\n    }\n});\n</code></pre>\n<pre><code class=\"lang-js\">myChart.setOption({\n    graphic: echarts.util.map(data, function (item, dataIndex) {\n        return {\n            type: &#39;circle&#39;,\n            ...,\n            // 在 mouseover 的时候显示,在 mouseout 的时候隐藏。\n            onmousemove: echarts.util.curry(showTooltip, dataIndex),\n            onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n        };\n    })\n});\n\nfunction showTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;showTip&#39;,\n        seriesIndex: 0,\n        dataIndex: dataIndex\n    });\n}\n\nfunction hideTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;hideTip&#39;\n    });\n}\n</code></pre>\n<p>这里使用了 <a href=\"api.html#echartsInstance.dispatchAction\" target=\"_blank\">dispatchAction</a> 来显示隐藏 tooltip。用到了 <a href=\"api.html#action.tooltip.showTip\" target=\"_blank\">showTip</a>、<a href=\"api.html#action.tooltip.hideTip\" target=\"_blank\">hideTip</a>。</p>\n<h2 id=\"-\">(三)全部代码</h2>\n<p>总结一下,全部的代码如下:</p>\n<pre><code>&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;script src=&quot;dist/echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n\n    var symbolSize = 20;\n    var data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\n    var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n    myChart.setOption({\n        tooltip: {\n            triggerOn: &#39;none&#39;,\n            formatter: function (params) {\n                return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n            }\n        },\n        xAxis: {\n            min: -100,\n            max: 80,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        yAxis: {\n            min: -30,\n            max: 60,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        series: [\n            {\n                id: &#39;a&#39;,\n                type: &#39;line&#39;,\n                smooth: true,\n                symbolSize: symbolSize,\n                data: data\n            }\n        ],\n    });\n\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                type: &#39;circle&#39;,\n                position: myChart.convertToPixel(&#39;grid&#39;, item),\n                shape: {\n                    r: symbolSize / 2\n                },\n                invisible: true,\n                draggable: true,\n                ondrag: echarts.util.curry(onPointDragging, dataIndex),\n                onmousemove: echarts.util.curry(showTooltip, dataIndex),\n                onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n                z: 100\n            };\n        })\n    });\n\n    window.addEventListener(&#39;resize&#39;, function () {\n        myChart.setOption({\n            graphic: echarts.util.map(data, function (item, dataIndex) {\n                return {\n                    position: myChart.convertToPixel(&#39;grid&#39;, item)\n                };\n            })\n        });\n    });\n\n    function showTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;showTip&#39;,\n            seriesIndex: 0,\n            dataIndex: dataIndex\n        });\n    }\n\n    function hideTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;hideTip&#39;\n        });\n    }\n\n    function onPointDragging(dataIndex, dx, dy) {\n        data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n        myChart.setOption({\n            series: [{\n                id: &#39;a&#39;,\n                data: data\n            }]\n        });\n    }\n\n&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre><p><br></p>\n<p>有了这些基础,就可以定制更多的功能了。可以加 <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> 组件,可以制作一个直角坐标系上的绘图板等等。可以发挥想象力。</p>\n"},"小例子:实现日历图":{"type":["*"],"description":"<p>在 Apache ECharts (incubating)<sup>TM</sup> 中,我们新增了日历坐标系,如何快速写出一个日历图呢?</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-simple&edit=1&reset=1\" width=\"800\" height=\"300\" ></iframe>\n\n\n<p>通过以下三个步骤即可实现上述效果:</p>\n<h2 id=\"-js-\">第一步:引入js文件</h2>\n<p>下载的最新完整版本 echarts.min.js 即可,无需再单独引入其他文件哦</p>\n<pre><code class=\"lang-html\">&lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;script&gt;\n    // ...\n&lt;/script&gt;\n</code></pre>\n<h2 id=\"-dom-\">第二步:指定DOM元素作为图表容器</h2>\n<p>和ECharts中的其他图表一样,创建一个DOM来作为绘制图表的容器</p>\n<pre><code class=\"lang-html\">&lt;div id=&quot;main&quot; style=&quot;width=100%; height = 400px&quot;&gt;&lt;/div&gt;\n</code></pre>\n<p>使用ECharts进行初始化</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n</code></pre>\n<h2 id=\"-\">第三步:配置参数</h2>\n<p>以常见的日历图为例: calendar坐标 + heatmap图</p>\n<pre><code class=\"lang-js\">var option = {\n    visualMap: {\n        show: false\n        min: 0,\n        max: 1000\n    },\n    calendar: {\n        range: &#39;2017&#39;\n    },\n    series: {\n        type: &#39;heatmap&#39;,\n        coordinateSystem: &#39;calendar&#39;,\n        data: [[&#39;2017-01-02&#39;, 900], [&#39;2017-01-02&#39;, 877], [&#39;2017-01-02&#39;, 699], ...]\n    }\n}\nmyChart.setOption(option);\n</code></pre>\n<p>在heatmap图的基础上,加上<code class=\"codespan\">coordinateSystem: &#39;calendar&#39;,</code>和<code class=\"codespan\">calendar: { range: &#39;2017&#39; }</code>heatmap图就秒变为日历图了。</p>\n<blockquote>\n<p>若发现图表没有正确显示,你可以检查以下几种可能:</p>\n<ul>\n<li>JS文件是否正确加载;</li>\n<li><code class=\"codespan\">echarts</code> 变量是否存在;</li>\n<li>控制台是否报错;</li>\n<li>DOM 元素在 <code class=\"codespan\">echarts.init</code> 的时候是否有高度和宽度。</li>\n<li>若为 <code class=\"codespan\">type: heatmap</code>,检查是否配置了 <code class=\"codespan\">visualMap</code>。</li>\n</ul>\n</blockquote>\n<p><strong>附完整示例代码</strong></p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;ECharts&lt;/title&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width:100%;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n        var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n        // 模拟数据\n        function getVirtulData(year) {\n            year = year || &#39;2017&#39;;\n            var date = +echarts.number.parseDate(year + &#39;-01-01&#39;);\n            var end = +echarts.number.parseDate(year + &#39;-12-31&#39;);\n            var dayTime = 3600 * 24 * 1000;\n            var data = [];\n            for (var time = date; time &lt;= end; time += dayTime) {\n                data.push([\n                    echarts.format.formatTime(&#39;yyyy-MM-dd&#39;, time),\n                    Math.floor(Math.random() * 10000)\n                ]);\n            }\n            return data;\n        }\n        var option = {\n            visualMap: {\n                show: false,\n                min: 0,\n                max: 10000\n            },\n            calendar: {\n                range: &#39;2017&#39;\n            },\n            series: {\n                type: &#39;heatmap&#39;,\n                coordinateSystem: &#39;calendar&#39;,\n                data: getVirtulData(2017)\n            }\n        };\n        myChart.setOption(option);\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n\n</code></pre>\n<p>以上就是绘制最简日历图的步骤了,如若还想进一步私人定制,还可以通过自定义配置参数来实现</p>\n<h2 id=\"-\">自定义配置参数</h2>\n<p>使用日历坐标绘制日历图时,支持自定义各项属性:</p>\n<ul>\n<li><p><a href=\"option.html#calendar.range\" target=\"_blank\">range</a>: <code class=\"codespan\">设置时间的范围,可支持某年、某月、某天,还可支持跨年</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.cellSize\" target=\"_blank\">cellSize</a>: <code class=\"codespan\">设置日历格的大小,可支持设置不同高宽,还可支持自适应auto</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.width\" target=\"_blank\">width</a>、<a href=\"http://xxx\" target=\"_blank\">height</a>: <code class=\"codespan\">也可以直接设置改日历图的整体高宽,让其基于已有的高宽全部自适应</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.orient\" target=\"_blank\">orient</a>: <code class=\"codespan\">设置坐标的方向,既可以横着也可以竖着</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.splitLine\" target=\"_blank\">splitLine</a>: <code class=\"codespan\">设置分隔线样式,也可以直接不显示</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.itemStyle\" target=\"_blank\">itemStyle</a>: <code class=\"codespan\">设置日历格的样式,背景色、方框线颜色大小类型、透明度均可自定义,甚至还能加阴影</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.dayLabel\" target=\"_blank\">dayLabel</a>: <code class=\"codespan\">设置坐标中 星期样式,可以设置星期从第几天开始,快捷设置中英文、甚至是自定义中英文混搭、或局部不显示、通过formatter 可以想怎么显示就怎么显示;</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.monthLabel\" target=\"_blank\">monthLabel</a>: <code class=\"codespan\">设置坐标中 月样式,和星期一样,可快捷设置中英文和自定义混搭</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.yearLabel\" target=\"_blank\">yearLabel</a>: <code class=\"codespan\">设置坐标中 年样式,默认显示一年,通过formatter 文字可以想显示什么就能通过string function任性自定义,上下左右方位随便选;</code></p>\n</li>\n</ul>\n<p>完整的配置项参数参见:<a href=\"option.html#calendar\" target=\"_blank\">calendar API</a></p>\n<h2 id=\"-\">日历坐标系的其他形式</h2>\n<p>日历坐标系是一种新的 <code class=\"codespan\">ECharts</code> 坐标系,提供了在日历上绘制图表的能力; 所以除了制作常用的日历图外,我们可以在热力图、散点图、关系图中使用日历坐标系。</p>\n<p>在日历坐标系中使用热力图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-heatmap&edit=1&reset=1\" width=\"800\" height=\"300\" ></iframe>\n\n\n<p>在日历坐标系中使用散点图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-effectscatter&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n<p>还可以混合放置不同的图表,例如下例子,同时放置了热力图和关系图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-graph&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n<p><strong>其他更丰富的效果</strong></p>\n<p>灵活利用 <code class=\"codespan\">ECharts</code> 图表和坐标系的组合,以及 API,还可以实现更丰富的效果。</p>\n<p>例如,制作农历:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-lunar&edit=1&reset=1\" width=\"600\" height=\"500\" ></iframe>\n\n\n<p>例如,使用 <code class=\"codespan\">chart.convertToPixel</code> 接口,在日历坐标系绘制饼图。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-pie&edit=1&reset=1\" width=\"800\" height=\"640\" ></iframe>\n\n\n\n\n\n\n\n"},"旭日图":{"type":["*"],"description":"<p><a href=\"https://en.wikipedia.org/wiki/Pie_chart#Ring_chart_/_Sunburst_chart_/_Multilevel_pie_chart\" target=\"_blank\">旭日图(Sunburst)</a>由多层的环形图组成,在数据结构上,内圈是外圈的父节点。因此,它既能像<a href=\"option.html#series-pie\" target=\"_blank\">饼图</a>一样表现局部和整体的占比,又能像<a href=\"option.html#series-treemap\" target=\"_blank\">矩形树图</a>一样表现层级关系。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-monochrome&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n<h2 id=\"-\">引入相关文件</h2>\n<p>旭日图是 Apache ECharts (incubating)<sup>TM</sup> 4.0 新增的图表类型,从 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> 引入完整版的 <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js\" target=\"_blank\">echarts.min.js</a></p>\n<h2 id=\"-\">最简单的旭日图</h2>\n<p>创建旭日图需要在 <code class=\"codespan\">series</code> 配置项中声明类型为 <code class=\"codespan\">&#39;sunburst&#39;</code> 的系列,并且以树形结构声明其 <code class=\"codespan\">data</code>:</p>\n<pre><code class=\"lang-js\">var option = {\n    series: {\n        type: &#39;sunburst&#39;,\n        data: [{\n            name: &#39;A&#39;,\n            value: 10,\n            children: [{\n                value: 3,\n                name: &#39;Aa&#39;\n            }, {\n                value: 5,\n                name: &#39;Ab&#39;\n            }]\n        }, {\n            name: &#39;B&#39;,\n            children: [{\n                name: &#39;Ba&#39;,\n                value: 4\n            }, {\n                name: &#39;Bb&#39;,\n                value: 2\n            }]\n        }, {\n            name: &#39;C&#39;,\n            value: 3\n        }]\n    }\n};\n</code></pre>\n<p>得到以下结果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-simple&edit=1&reset=1\" width=\"700\" height=\"400\" ></iframe>\n\n\n<h2 id=\"-\">颜色等样式调整</h2>\n<p>默认情况下会使用全局调色盘 <a href=\"option.html#color\" target=\"_blank\">color</a> 分配最内层的颜色,其余层则与其父元素同色。在旭日图中,扇形块的颜色有以下三种设置方式:</p>\n<ul>\n<li>在 <a href=\"option.html#series-sunburst.data.itemStyle\" target=\"_blank\">series.data.itemStyle</a> 中设置每个扇形块的样式;</li>\n<li>在 <a href=\"option.html#series-sunburst.levels.itemStyle\" target=\"_blank\">series.levels.itemStyle</a> 中设置每一层的样式;</li>\n<li>在 <a href=\"option.html#series-sunburst.itemStyle\" target=\"_blank\">series.itemStyle</a> 中设置整个旭日图的样式。</li>\n</ul>\n<p>上述三者的优先级是从高到低的,也就是说,配置了 <code class=\"codespan\">series.data.itemStyle</code> 的扇形块将会覆盖 <code class=\"codespan\">series.levels.itemStyle</code> 和 <code class=\"codespan\">series.itemStyle</code> 的设置。</p>\n<p>下面,我们将整体的颜色设为灰色 <code class=\"codespan\">&#39;#aaa&#39;</code>,将最内层的颜色设为蓝色 <code class=\"codespan\">&#39;blue&#39;</code>,将 <code class=\"codespan\">Aa</code>、<code class=\"codespan\">B</code> 这两块设为红色 <code class=\"codespan\">&#39;red&#39;</code>。</p>\n<pre><code class=\"lang-js\">var option = {\n    series: {\n        type: &#39;sunburst&#39;,\n        data: [{\n            name: &#39;A&#39;,\n            value: 10,\n            children: [{\n                value: 3,\n                name: &#39;Aa&#39;,\n                itemStyle: {\n                    color: &#39;red&#39;\n                }\n            }, {\n                value: 5,\n                name: &#39;Ab&#39;\n            }]\n        }, {\n            name: &#39;B&#39;,\n            children: [{\n                name: &#39;Ba&#39;,\n                value: 4\n            }, {\n                name: &#39;Bb&#39;,\n                value: 2\n            }],\n            itemStyle: {\n                color: &#39;red&#39;\n            }\n        }, {\n            name: &#39;C&#39;,\n            value: 3\n        }],\n        itemStyle: {\n            color: &#39;#aaa&#39;\n        },\n        levels: [{\n            // 留给数据下钻的节点属性\n        }, {\n            itemStyle: {\n                color: &#39;blue&#39;\n            }\n        }]\n    }\n};\n</code></pre>\n<p>效果为:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-color&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n\n<h2 id=\"-\">按层配置样式</h2>\n<p>旭日图是一种有层次的结构,为了方便同一层样式的配置,我们提供了 <a href=\"option.html#series-sunburst.levels\" target=\"_blank\">levels</a> 配置项。它是一个数组,其中的第 0 项表示数据下钻后返回上级的图形,其后的每一项分别表示从圆心向外层的层级。</p>\n<p>例如,假设我们没有数据下钻功能,并且希望将最内层的扇形块的颜色设为红色,文字设为蓝色,可以这样设置:</p>\n<pre><code class=\"lang-js\">series: {\n    // ...\n    levels: [\n        {\n            // 留给数据下钻点的空白配置\n        },\n        {\n            // 最靠内测的第一层\n            itemStyle: {\n                color: &#39;red&#39;\n            },\n            label: {\n                color: &#39;blue&#39;\n            }\n        },\n        {\n            // 第二层 ...\n        }\n    ]\n}\n</code></pre>\n<p>在实际使用的过程中,你会发现按层配置样式是一个很常用的功能,能够很大程度上提高配置的效率。</p>\n<h2 id=\"-\">数据下钻</h2>\n<p>旭日图默认支持数据下钻,也就是说,当点击了扇形块之后,将以该扇形块的数据作为根节点,便于进一步了解该数据的细节。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-simple&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n<p>当数据下钻后,中间会出现一个用于返回上一层的图形,该图形的样式可以通过 <a href=\"option.html#series-sunburst.levels\" target=\"_blank\">levels[0]</a> 配置。</p>\n<p>如果不需要数据下钻功能,可以通过将 <a href=\"option.html#series-sunburst.nodeClick\" target=\"_blank\">nodeClick</a> 设置为 <code class=\"codespan\">false</code> 关闭;或者将其设为 <code class=\"codespan\">&#39;link&#39;</code>,并将 <a href=\"option.html#series-sunburst.data.link\" target=\"_blank\">data.link</a> 设为点击扇形块对应打开的链接。</p>\n<h2 id=\"-\">高亮相关扇形块</h2>\n<p>旭日图支持鼠标移动到某扇形块时,高亮相关数据块的操作,可以通过设置 <a href=\"option.html#series-sunburst.highlightPolicy\" target=\"_blank\">highlightPolicy</a>,包括以下几种高亮方式:</p>\n<ul>\n<li><code class=\"codespan\">&#39;descendant&#39;</code>(默认值):高亮鼠标移动所在扇形块与其后代元素;</li>\n<li><code class=\"codespan\">&#39;ancestor&#39;</code>:高亮鼠标所在扇形块与其祖先元素;</li>\n<li><code class=\"codespan\">&#39;self&#39;</code>:仅高亮鼠标所在扇形块;</li>\n<li><code class=\"codespan\">&#39;none&#39;</code>:不会淡化(downplay)其他元素。</li>\n</ul>\n<p>上面提到的“高亮”,对于鼠标所在的扇形块,会使用 <code class=\"codespan\">emphasis</code> 样式;对于其他相关扇形块,则会使用 <code class=\"codespan\">highlight</code> 样式。通过这种方式,可以很方便地实现突出显示相关数据的需求。</p>\n<p>具体来说,对于配置项:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    color: &#39;yellow&#39;,\n    borderWidth: 2,\n    emphasis: {\n        color: &#39;red&#39;\n    },\n    highlight: {\n        color: &#39;orange&#39;\n    },\n    downplay: {\n        color: &#39;#ccc&#39;\n    }\n}\n</code></pre>\n<p><code class=\"codespan\">highlightPolicy</code> 为 <code class=\"codespan\">&#39;descendant&#39;</code> 或 <code class=\"codespan\">&#39;ancestor&#39;</code> 的效果分别为:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-highlight-descendant&edit=1&reset=1\" width=\"700\" height=\"350\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-highlight-ancestor&edit=1&reset=1\" width=\"700\" height=\"350\" ></iframe>\n\n\n<h2 id=\"-\">总结</h2>\n<p>上面的教程主要讲述的是如何入门使用旭日图,感兴趣的用户可以在 <a href=\"option.html#series-sunburst\" target=\"_blank\">配置项手册</a> 查看更完整的文档。在灵活应用这些配置项之后,就能做出丰富多彩的旭日图了!</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-book&edit=1&reset=1\" width=\"700\" height=\"600\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-drink&edit=1&reset=1\" width=\"700\" height=\"600\" ></iframe>\n\n\n\n\n\n\n\n\n"},"自定义系列":{"type":["*"],"description":"<p><a href=\"option.html#series-custom\" target=\"_blank\">自定义系列(custom series)</a>,是一种系列的类型。它把绘制图形元素这一步留给开发者去做,从而开发者能在坐标系中自由绘制出自己需要的图表。</p>\n<p>Apache ECharts (incubating)<sup>TM</sup> 为什么会要支持 <code class=\"codespan\">自定义系列</code> 呢?</p>\n<p>ECharts 内置支持的图表类型是最常见的图表类型,但是图表类型是难于穷举的,有很多小众的需求 echarts 并不能内置的支持。那么就需要提供一种方式来让开发者自己扩展。另一方面,所提供的扩展方式要尽可能得简单,例如图形元素创建和释放、过渡动画、tooltip、<a href=\"option.html#dataZoom\" target=\"_blank\">数据区域缩放(dataZoom)</a>、<a href=\"option.html#visualMap\" target=\"_blank\">视觉映射(visualMap)</a>等功能,尽量在 ECharts 中内置得处理,使开发者不必纠结于这些细节。综上考虑形成了 <a href=\"option.html#series-custom\" target=\"_blank\">自定义系列(custom series)</a>。</p>\n<p><strong>例如,下面的例子使用 custom series 扩展出了 x-range 图:</strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=custom-profile&reset=1&edit=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n<p><strong>更多的例子参见:<a href=\"https://echarts.apache.org/examples/zh/index.html#chart-type-custom\" target=\"_blank\">custom examples</a></strong></p>\n<p>下面来介绍开发者怎么使用 <a href=\"option.html#series-custom\" target=\"_blank\">自定义系列(custom series)</a>。</p>\n<h2 id=\"-renderitem-\">(一)renderItem 方法</h2>\n<p>开发者自定义的图形元素渲染逻辑,是通过书写 <code class=\"codespan\">renderItem</code> 函数实现的,例如:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // ...\n        },\n        data: data\n    }]\n}\n</code></pre>\n<p>在渲染阶段,对于 <a href=\"option.html#series-custom.data\" target=\"_blank\">series.data</a> 中的每个数据项(为方便描述,这里称为 <code class=\"codespan\">dataItem</code>),会调用此 <a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数。这个 <code class=\"codespan\">renderItem</code> 函数的职责,就是返回一个(或者一组)<code class=\"codespan\">图形元素定义</code>,<code class=\"codespan\">图形元素定义</code> 中包括图形元素的类型、位置、尺寸、样式等。echarts 会根据这些 <code class=\"codespan\">图形元素定义</code> 来渲染出图形元素。如下的示意:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // 对于 data 中的每个 dataItem,都会调用这个 renderItem 函数。\n            // (但是注意,并不一定是按照 data 的顺序调用)\n\n            // 这里进行一些处理,例如,坐标转换。\n            // 这里使用 api.value(0) 取出当前 dataItem 中第一个维度的数值。\n            var categoryIndex = api.value(0);\n            // 这里使用 api.coord(...) 将数值在当前坐标系中转换成为屏幕上的点的像素值。\n            var startPoint = api.coord([api.value(1), categoryIndex]);\n            var endPoint = api.coord([api.value(2), categoryIndex]);\n            // 这里使用 api.size(...) 获得 Y 轴上数值范围为 1 的一段所对应的像素长度。\n            var height = api.size([0, 1])[1] * 0.6;\n\n            // shape 属性描述了这个矩形的像素位置和大小。\n            // 其中特殊得用到了 echarts.graphic.clipRectByRect,意思是,\n            // 如果矩形超出了当前坐标系的包围盒,则剪裁这个矩形。\n            // 如果矩形完全被剪掉,会返回 undefined.\n            var rectShape = echarts.graphic.clipRectByRect({\n                // 矩形的位置和大小。\n                x: startPoint[0],\n                y: startPoint[1] - height / 2,\n                width: endPoint[0] - startPoint[0],\n                height: height\n            }, {\n                // 当前坐标系的包围盒。\n                x: params.coordSys.x,\n                y: params.coordSys.y,\n                width: params.coordSys.width,\n                height: params.coordSys.height\n            });\n\n            // 这里返回为这个 dataItem 构建的图形元素定义。\n            return rectShape &amp;&amp; {\n                // 表示这个图形元素是矩形。还可以是 &#39;circle&#39;, &#39;sector&#39;, &#39;polygon&#39; 等等。\n                type: &#39;rect&#39;,\n                shape: rectShape,\n                // 用 api.style(...) 得到默认的样式设置。这个样式设置包含了\n                // option 中 itemStyle 的配置和视觉映射得到的颜色。\n                style: api.style()\n            };\n        },\n        data: [\n            [12, 44, 55, 60], // 这是第一个 dataItem\n            [53, 31, 21, 56], // 这是第二个 dataItem\n            [71, 33, 10, 20], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n}\n</code></pre>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数提供了两个参数:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">params</a>:包含了当前数据信息(如 <code class=\"codespan\">seriesIndex</code>、<code class=\"codespan\">dataIndex</code> 等等)和坐标系的信息(如坐标系包围盒的位置和尺寸)。</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">api</a>:是一些开发者可调用的方法集合(如 <code class=\"codespan\">api.value()</code>、<code class=\"codespan\">api.coord()</code>)。</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数须返回根据此 <code class=\"codespan\">dataItem</code> 绘制出的图形元素的定义信息,参见 <a href=\"option.html#series-custom.renderItem.return\" target=\"_blank\">renderItem.return</a>。</p>\n<p>一般来说,<a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数的主要逻辑,是将 <code class=\"codespan\">dataItem</code> 里的值映射到坐标系上的图形元素。这一般需要用到 <a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> 中的两个函数:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.value\" target=\"_blank\">api.value(...)</a>,意思是取出 <code class=\"codespan\">dataItem</code> 中的数值。例如 <code class=\"codespan\">api.value(0)</code> 表示取出当前 <code class=\"codespan\">dataItem</code> 中第一个维度的数值。</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.coord\" target=\"_blank\">api.coord(...)</a>,意思是进行坐标转换计算。例如 <code class=\"codespan\">var point = api.coord([api.value(0), api.value(1)])</code> 表示 <code class=\"codespan\">dataItem</code> 中的数值转换成坐标系上的点。</li>\n</ul>\n<p>有时候还需要用到 <a href=\"option.html#series-custom.renderItem.arguments.api.size\" target=\"_blank\">api.size(...)</a> 函数,表示得到坐标系上一段数值范围对应的长度。</p>\n<p>返回值中样式的设置可以使用 <a href=\"option.html#series-custom.renderItem.arguments.api.style\" target=\"_blank\">api.style(...)</a> 函数,他能得到 <a href=\"option.html#series-custom.itemStyle\" target=\"_blank\">series.itemStyle</a> 中定义的样式信息,以及视觉映射的样式信息。也可以用这种方式覆盖这些样式信息:<code class=\"codespan\">api.style({fill: &#39;green&#39;, stroke: &#39;yellow&#39;})</code>。</p>\n<p>书写完 <code class=\"codespan\">renderItem</code> 方法后,自定义系列的 90% 工作就做完了。剩下的是一些精化工作。</p>\n<h2 id=\"-\">(二)使坐标轴的范围自适应数据范围</h2>\n<p>在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系(grid)</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系(polar)</a> 中都有坐标轴。坐标轴的刻度范围需要自适应当前显示出的数据的范围,否则绘制出的图形会超出去。所以,例如,在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系(grid)</a> 中,使用自定义系列的开发者,需要设定,<code class=\"codespan\">data</code> 中的哪些维度会对应到 <code class=\"codespan\">x</code> 轴上,哪些维度会对应到 <code class=\"codespan\">y</code> 轴上。这件事通过 <a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a> 来设定。例如:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            // data 中『维度1』和『维度2』对应到 X 轴\n            x: [1, 2],\n            // data 中『维度0』对应到 Y 轴\n            y: 0\n        },\n        data: [\n            // 维度0  维度1  维度2  维度3\n            [   12,   44,   55,   60   ], // 这是第一个 dataItem\n            [   53,   31,   21,   56   ], // 这是第二个 dataItem\n            [   71,   33,   10,   20   ], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n};\n</code></pre>\n<h2 id=\"-tooltip\">(三)设定 tooltip</h2>\n<p>当然,使用 <a href=\"option.html#tooltip.formatter\" target=\"_blank\">tooltip.formatter</a> 可以任意定制 tooltip 中的内容。但是还有更简单的方法,通过<a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a> 和 <a href=\"option.html#series-custom.dimensions\" target=\"_blank\">dimensions</a> 来设定:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            x: [1, 2],\n            y: 0,\n            // 表示『维度2』和『维度3』要显示到 tooltip 中。\n            tooltip: [2, 3]\n        },\n        // 表示给『维度2』和『维度3』分别取名为『年龄』和『满意度』,显示到 tooltip 中。\n        dimensions: [null, null, &#39;年龄&#39;, &#39;满意度&#39;],\n        data: [\n            // 维度0  维度1  维度2  维度3\n            [   12,   44,   55,   60   ], // 这是第一个 dataItem\n            [   53,   31,   21,   56   ], // 这是第二个 dataItem\n            [   71,   33,   10,   20   ], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p><br>\n<br>\n<br></p>\n<hr>\n<p>上面,一个简单的 custome series 例子完成了。</p>\n<p>下面介绍几个其他细节要点。</p>\n<h2 id=\"-\">(四)超出坐标系范围的截取</h2>\n<p>与 <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> 结合使用的时候,常常使用会设置 <a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a> 为 &#39;weakFilter&#39;。这个设置的意思是:当 <code class=\"codespan\">dataItem</code> 部分超出坐标系边界的时候,<code class=\"codespan\">dataItem</code> 不会整体被过滤掉。例如:</p>\n<pre><code class=\"lang-js\">option = {\n    dataZoom: {\n        xAxisIndex: 0,\n        filterMode: &#39;weakFilter&#39;\n    },\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            // data 中『维度1』和『维度2』对应到 X 轴\n            x: [1, 2],\n            y: 0\n        },\n        data: [\n            // 维度0  维度1  维度2  维度3\n            [   12,   44,   55,   60   ], // 这是第一个 dataItem\n            [   53,   31,   21,   56   ], // 这是第二个 dataItem\n            [   71,   33,   10,   20   ], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p>在这个例子中,『维度1』和『维度2』对应到 X 轴,<code class=\"codespan\">dataZoom</code> 组件控制 X 轴的缩放。假如在缩放的过程中,某个 dataItem 的『维度1』超出了 X 轴的范围,『维度2』还在 X 轴的范围中,那么只要设置 <code class=\"codespan\">dataZoom.filterMode = &#39;weakFilter&#39;</code>,这个 dataItem 就不会被过滤掉,从而还能够使用 <code class=\"codespan\">renderItem</code> 绘制图形(可以使用上面提到过的 <code class=\"codespan\">echarts.graphic.clipRectByRect</code> 把图形绘制成被坐标系剪裁过的样子)。参见上面提到过的例子:<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-profile\" target=\"_blank\">Profile</a></p>\n<h2 id=\"-dataindex\">(五)关于 dataIndex</h2>\n<p>开发者如果使用到的话应注意,<a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">renderItem.arguments.params</a> 中的 <code class=\"codespan\">dataIndex</code> 和 <code class=\"codespan\">dataIndexInside</code> 是有区别的:</p>\n<ul>\n<li><code class=\"codespan\">dataIndex</code> 指的 <code class=\"codespan\">dataItem</code> 在原始数据中的 index。</li>\n<li><code class=\"codespan\">dataIndexInside</code> 指的是 <code class=\"codespan\">dataItem</code> 在当前数据窗口(参见 <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>)中的 index。</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> 中使用的参数都是 <code class=\"codespan\">dataIndexInside</code> 而非 <code class=\"codespan\">dataIndex</code>,因为从 <code class=\"codespan\">dataIndex</code> 转换成 <code class=\"codespan\">dataIndexInside</code> 需要时间开销。</p>\n<h2 id=\"-\">(六)事件监听</h2>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            // ...\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;\n                    // ...\n                }, {\n                    type: &#39;circle&#39;,\n                    name: &#39;aaa&#39;,\n                    // 用户指定的信息,可以在 event handler 访问到。\n                    info: 12345,\n                    // ...\n                }]\n            };\n        }\n    }\n});\nchart.on(&#39;click&#39;, {element: &#39;aaa&#39;}, function (params) {\n    // 当 name 为 &#39;aaa&#39; 的图形元素被点击时,此回调被触发。\n    console.log(params.info);\n});\n</code></pre>\n<h2 id=\"-\">(七)自定义矢量图形</h2>\n<p>自定义系列能支持使用 <a href=\"http://www.w3.org/TR/SVG/paths.html#PathData\" target=\"_blank\">SVG PathData</a> 定义矢量路径。从而可以使用矢量图工具中做出的图形。参见:<a href=\"option.html#series-custom.renderItem.return_path\" target=\"_blank\">path</a>,以及例子:<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-calendar-icon\" target=\"_blank\">icons</a> 和 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-gantt-flight\" target=\"_blank\">shapes</a>。</p>\n<p><br></p>\n<p><strong>更多的自定义系列的例子参见:<a href=\"https://echarts.apache.org/examples/zh/index.html#chart-type-custom\" target=\"_blank\">custom examples</a></strong></p>\n"},"富文本标签":{"type":["*"],"description":"<p>在许多地方(如图、轴的标签等)都可以使用富文本标签。例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=treemap-obama&edit=1&reset=1\" width=\"800\" height=\"550\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<p>其他一些例子:\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=map-labels&amp;edit=1&amp;reset=1\" target=\"_blank\">Map Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=pie-nest&amp;edit=1&amp;reset=1\" target=\"_blank\">Pie Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=gauge-car&amp;edit=1&amp;reset=1\" target=\"_blank\">Gauge</a>.</p>\n<p><br></p>\n<p>原先 Apache ECharts (incubating)<sup>TM</sup> 中的文本标签,只能对整块统一进行样式设置,并且仅仅支持颜色和字体的设置,从而导致不易于制作表达能力更强的文字描述信息。</p>\n<p>echarts v3.7 以后,支持了富文本标签,能够:</p>\n<ul>\n<li>定制文本块整体的样式(如背景、边框、阴影等)、位置、旋转等。</li>\n<li>对文本块中个别片段定义样式(如颜色、字体、高宽、背景、阴影等)、对齐方式等。</li>\n<li>在文本中使用图片做小图标或者背景。</li>\n<li>特定组合以上的规则,可以做出简单表格、分割线等效果。</li>\n</ul>\n<p>开始下面的介绍之前,先说明一下下面会使用的两个名词的含义:</p>\n<ul>\n<li>文本块(Text Block):文本标签块整体。</li>\n<li>文本片段(Text fragment):文本标签块中的部分文本。</li>\n</ul>\n<p>如下图示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-block-fragment&edit=1&reset=1\" width=\"340\" height=\"240\" ></iframe>\n\n\n\n<h2 id=\"-\">文本样式相关的配置项</h2>\n<p>echarts 提供了丰富的文本标签配置项,包括:</p>\n<ul>\n<li>字体基本样式设置:<code class=\"codespan\">fontStyle</code>、<code class=\"codespan\">fontWeight</code>、<code class=\"codespan\">fontSize</code>、<code class=\"codespan\">fontFamily</code>。</li>\n<li>文字颜色:<code class=\"codespan\">color</code>。</li>\n<li>文字描边:<code class=\"codespan\">textBorderColor</code>、<code class=\"codespan\">textBorderWidth</code>。</li>\n<li>文字阴影:<code class=\"codespan\">textShadowColor</code>、<code class=\"codespan\">textShadowBlur</code>、<code class=\"codespan\">textShadowOffsetX</code>、<code class=\"codespan\">textShadowOffsetY</code>。</li>\n<li>文本块或文本片段大小:<code class=\"codespan\">lineHeight</code>、<code class=\"codespan\">width</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">padding</code>。</li>\n<li>文本块或文本片段的对齐:<code class=\"codespan\">align</code>、<code class=\"codespan\">verticalAlign</code>。</li>\n<li>文本块或文本片段的边框、背景(颜色或图片):<code class=\"codespan\">backgroundColor</code>、<code class=\"codespan\">borderColor</code>、<code class=\"codespan\">borderWidth</code>、<code class=\"codespan\">borderRadius</code>。</li>\n<li>文本块或文本片段的阴影:<code class=\"codespan\">shadowColor</code>、<code class=\"codespan\">shadowBlur</code>、<code class=\"codespan\">shadowOffsetX</code>、<code class=\"codespan\">shadowOffsetY</code>。</li>\n<li>文本块的位置和旋转:<code class=\"codespan\">position</code>、<code class=\"codespan\">distance</code>、<code class=\"codespan\">rotate</code>。</li>\n</ul>\n<p>可以在各处的 <code class=\"codespan\">rich</code> 属性中定义文本片段样式。例如 <a href=\"option.html#series-bar.label.rich\" target=\"_blank\">series-bar.label.rich</a></p>\n<p>例如:</p>\n<pre><code class=\"lang-js\">label: {\n    // 在文本中,可以对部分文本采用 rich 中定义样式。\n    // 这里需要在文本中使用标记符号:\n    // `{styleName|text content text content}` 标记样式名。\n    // 注意,换行仍是使用 &#39;\\n&#39;。\n    formatter: [\n        &#39;{a|这段文本采用样式a}&#39;,\n        &#39;{b|这段文本采用样式b}这段用默认样式{x|这段用样式x}&#39;\n    ].join(&#39;\\n&#39;),\n\n    // 这里是文本块的样式设置:\n    color: &#39;#333&#39;,\n    fontSize: 5,\n    fontFamily: &#39;Arial&#39;,\n    borderWidth: 3,\n    backgroundColor: &#39;#984455&#39;,\n    padding: [3, 10, 10, 5],\n    lineHeight: 20,\n\n    // rich 里是文本片段的样式设置:\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<blockquote>\n<p>注意:如果不定义 <code class=\"codespan\">rich</code>,不能指定文字块的 <code class=\"codespan\">width</code> 和 <code class=\"codespan\">height</code>。</p>\n</blockquote>\n<h2 id=\"-\">文本、文本框、文本片段的基本样式和装饰</h2>\n<p>每个文本可以设置基本的字体样式:<code class=\"codespan\">fontStyle</code>、<code class=\"codespan\">fontWeight</code>、<code class=\"codespan\">fontSize</code>、<code class=\"codespan\">fontFamily</code>。</p>\n<p>可以设置文字的颜色 <code class=\"codespan\">color</code> 和边框的颜色 <code class=\"codespan\">textBorderColor</code>、<code class=\"codespan\">textBorderWidth</code>。</p>\n<p>文本框可以设置边框和背景的样式:<code class=\"codespan\">borderColor</code>、<code class=\"codespan\">borderWidth</code>、<code class=\"codespan\">backgroundColor</code>、<code class=\"codespan\">padding</code>。</p>\n<p>文本片段也可以设置边框和背景的样式:<code class=\"codespan\">borderColor</code>、<code class=\"codespan\">borderWidth</code>、<code class=\"codespan\">backgroundColor</code>、<code class=\"codespan\">padding</code>。</p>\n<p>例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-options&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n\n<h2 id=\"-\">标签的位置</h2>\n<p>对于折线图、柱状图、散点图等,均可以使用 <code class=\"codespan\">label</code> 来设置标签。标签的相对于图形元素的位置,一般使用 <a href=\"option.html#series-scatter.label.position\" target=\"_blank\">label.position</a>、<a href=\"option.html#series-scatter.label.distance\" target=\"_blank\">label.distance</a> 来配置。</p>\n<p>例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/label-position&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<blockquote>\n<p>注意:<code class=\"codespan\">position</code> 在不同的图中可取值有所不同。<code class=\"codespan\">distance</code> 并不是在每个图中都支持。详情请参见 <a href=\"option.html\" target=\"_blank\">option 文档</a>。</p>\n</blockquote>\n<h2 id=\"-\">标签的旋转</h2>\n<p>某些图中,为了能有足够长的空间来显示标签,需要对标签进行旋转。例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-label-rotation&edit=1&reset=1\" width=\"900\" height=\"500\" ></iframe>\n\n\n<p>这种场景下,可以结合 <a href=\"option.html#series-bar.label.align\" target=\"_blank\">align</a> 和 <a href=\"option.html#series-bar.label.verticalAlign\" target=\"_blank\">verticalAlign</a> 来调整标签位置。</p>\n<p>注意,逻辑是,先使用 <code class=\"codespan\">align</code> 和 <code class=\"codespan\">verticalAlign</code> 定位,再旋转。</p>\n<h2 id=\"-\">文本片段的排版和对齐</h2>\n<p>关于排版方式,每个文本片段,可以想象成 CSS 中的 <code class=\"codespan\">inline-block</code>,在文档流中按行放置。</p>\n<p>每个文本片段的内容盒尺寸(<code class=\"codespan\">content box size</code>),默认是根据文字大小决定的。但是,也可以设置 <code class=\"codespan\">width</code>、<code class=\"codespan\">height</code> 来强制指定,虽然一般不会这么做(参见下文)。文本片段的边框盒尺寸(<code class=\"codespan\">border box size</code>),由上述本身尺寸,加上文本片段的 <code class=\"codespan\">padding</code> 来得到。</p>\n<p>只有 <code class=\"codespan\">&#39;\\n&#39;</code> 是换行符,能导致换行。</p>\n<p>一行内,会有多个文本片段。每行的实际高度,由 <code class=\"codespan\">lineHeight</code> 最大的文本片段决定。文本片段的 <code class=\"codespan\">lineHeight</code> 可直接在 <code class=\"codespan\">rich</code> 中指定,也可以在 <code class=\"codespan\">rich</code> 的父层级中统一指定而采用到 <code class=\"codespan\">rich</code> 的所有项中,如果都不指定,则取文本片段的边框盒尺寸(<code class=\"codespan\">border box size</code>)。</p>\n<p>在一行的 <code class=\"codespan\">lineHeight</code> 被决定后,一行内,文本片段的竖直位置,由文本片段的 <code class=\"codespan\">verticalAlign</code> 来指定(这里和 CSS 中的规则稍有不同):</p>\n<ul>\n<li><code class=\"codespan\">&#39;bottom&#39;</code>:文本片段的盒的底边贴住行底。</li>\n<li><code class=\"codespan\">&#39;top&#39;</code>:文本片段的盒的顶边贴住行顶。</li>\n<li><code class=\"codespan\">&#39;middle&#39;</code>:居行中。</li>\n</ul>\n<p>文本块的宽度,可以直接由文本块的 <code class=\"codespan\">width</code> 指定,否则,由最长的行决定。宽度决定后,在一行中进行文本片段的放置。文本片段的 <code class=\"codespan\">align</code> 决定了文本片段在行中的水平位置:</p>\n<ul>\n<li>首先,从左向右连续紧靠放置 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;left&#39;</code> 的文本片段盒。</li>\n<li>然后,从右向左连续紧靠放置 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;right&#39;</code> 的文本片段盒。</li>\n<li>最后,剩余的没处理的文本片段盒,紧贴着,在中间剩余的区域中居中放置。</li>\n</ul>\n<p>关于文字在文本片段盒中的位置:</p>\n<ul>\n<li>如果 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;center&#39;</code>,则文字在文本片段盒中是居中的。</li>\n<li>如果 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;left&#39;</code>,则文字在文本片段盒中是居左的。</li>\n<li>如果 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;right&#39;</code>,则文字在文本片段盒中是居右的。</li>\n</ul>\n<p>例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-fragment-align&edit=1&reset=1\" width=\"800\" height=\"220\" ></iframe>\n\n\n\n<h2 id=\"-\">特殊效果:图标、分割线、标题块、简单表格</h2>\n<p>看下面的例子:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/title-block&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>文本片段的 <code class=\"codespan\">backgroundColor</code> 可以指定为图片后,就可以在文本中使用图标了:</p>\n<pre><code class=\"lang-js\">rich: {\n    Sunny: {\n        // 这样设定 backgroundColor 就可以是图片了。\n        backgroundColor: {\n            image: &#39;./data/asset/img/weather/sunny_128.png&#39;\n        },\n        // 可以只指定图片的高度,从而图片的宽度根据图片的长宽比自动得到。\n        height: 30\n    }\n}\n</code></pre>\n<p>分割线实际是用 border 实现的:</p>\n<pre><code class=\"lang-js\">rich: {\n    hr: {\n        borderColor: &#39;#777&#39;,\n        // 这里把 width 设置为 &#39;100%&#39;,表示分割线的长度充满文本块。\n        // 注意,这里是文本块内容盒(content box)的 100%,而不包含 padding。\n        // 虽然这和 CSS 相关的定义有所不同,但是在这类场景中更加方便。\n        width: &#39;100%&#39;,\n        borderWidth: 0.5,\n        height: 0\n    }\n}\n</code></pre>\n<p>标题块是使用 <code class=\"codespan\">backgroundColor</code> 实现的:</p>\n<pre><code class=\"lang-js\">// 标题文字居左\nformatter: &#39;{titleBg|Left Title}&#39;,\nrich: {\n    titleBg: {\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n\n// 标题文字居中。\n// 这个实现有些 tricky,但是,能够不引入更复杂的排版规则而实现这个效果。\nformatter: &#39;{tc|Center Title}{titleBg|}&#39;,\nrich: {\n    titleBg: {\n        align: &#39;right&#39;,\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n</code></pre>\n<p>简单表格的设定,其实就是给不同行上纵向对应的文本片段设定同样的宽度就可以了。参见本文最开始的 <a href=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&amp;edit=1&amp;reset=1\" target=\"_blank\">例子</a>。</p>\n"},"服务端渲染":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 可以在服务端进行渲染。例如 <a href=\"https://echarts.apache.org/examples/zh/index.html\" target=\"_blank\">官方示例</a> 里的一个个小截图,就是在服务端预生成出来的。</p>\n<p>服务端渲染可以使用流行的 headless 环境,例如 <a href=\"https://github.com/GoogleChrome/puppeteer\" target=\"_blank\">puppeteer</a>、<a href=\"https://chromium.googlesource.com/chromium/src/+/lkgr/headless/README.md\" target=\"_blank\">headless chrome</a>、<a href=\"https://github.com/Automattic/node-canvas\" target=\"_blank\">node-canvas</a>、<a href=\"https://github.com/jsdom/jsdom\" target=\"_blank\">jsdom</a>、<a href=\"http://phantomjs.org/\" target=\"_blank\">PhantomJS</a> 等。</p>\n<p>这是一些社区贡献的 echarts 服务端渲染方案:</p>\n<ul>\n<li><a href=\"https://github.com/hellosean1025/node-echarts\" target=\"_blank\">https://github.com/hellosean1025/node-echarts</a></li>\n<li><a href=\"https://github.com/chfw/echarts-scrappeteer\" target=\"_blank\">https://github.com/chfw/echarts-scrappeteer</a></li>\n<li><a href=\"https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js\" target=\"_blank\">https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js</a></li>\n<li><a href=\"https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73\" target=\"_blank\">https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73</a></li>\n</ul>\n"},"使用 Canvas 或者 SVG 渲染":{"type":["*"],"description":"<p>浏览器端图表库大多会选择 SVG 或者 Canvas 进行渲染。对于绘制图表来说,这两种技术往往是可替换的,效果相近。但是在一些场景中,他们的表现和能力又有一定差异。于是,对它们的选择取舍,就成为了一个一直存在的不易有标准答案的话题。</p>\n<p>Apache ECharts (incubating)<sup>TM</sup> 从初始一直使用 Canvas 绘制图表(除了对 IE8- 使用 VML)。而 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">ECharts v4.0</a> 发布了 SVG 渲染器,从而提供了一种新的选择。只须在初始化一个图表实例时,设置 <a href=\"api.html#echarts.init\" target=\"_blank\">renderer 参数</a> 为 <code class=\"codespan\">&#39;canvas&#39;</code> 或 <code class=\"codespan\">&#39;svg&#39;</code> 即可指定渲染器,比较方便。</p>\n<blockquote>\n<p>SVG 和 Canvas 这两种使用方式差异很大的技术,能够做到同时被透明支持,主要归功于 ECharts 底层库 <a href=\"https://github.com/ecomfe/zrender\" target=\"_blank\">ZRender</a> 的抽象和实现,形成可互换的 SVG 渲染器和 Canvas 渲染器。</p>\n</blockquote>\n<h2 id=\"-\">选择哪种渲染器</h2>\n<p>一般来说,Canvas 更适合绘制图形元素数量非常大(这一般是由数据量大导致)的图表(如热力图、地理坐标系或平行坐标系上的大规模线图或散点图等),也利于实现某些视觉 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=lines-bmap-effect\" target=\"_blank\">特效</a>。但是,在不少场景中,SVG 具有重要的优势:它的内存占用更低(这对移动端尤其重要)、渲染性能略高、并且用户使用浏览器内置的缩放功能时不会模糊。例如,我们在一些硬件环境中分别使用 Canvas 渲染器和 SVG 渲染器绘制中等数据量的折、柱、饼,统计初始动画阶段的帧率,得到了一个性能对比图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/canvas-vs-svg&reset=1\" width=\"90%\" height=\"400\" ></iframe>\n\n\n<p>上图显示出,在这些场景中,SVG 渲染器相比 Canvas 渲染器在移动端的总体表现更好。当然,这个实验并非是全面的评测,在另一些数据量较大或者有图表交互动画的场景中,目前的 SVG 渲染器的性能还比不过 Canvas 渲染器。但是同时有这两个选项,为开发者们根据自己的情况优化性能提供了更广阔的空间。</p>\n<p>选择哪种渲染器,我们可以根据软硬件环境、数据量、功能需求综合考虑。</p>\n<ul>\n<li>在软硬件环境较好,数据量不大的场景下(例如 PC 端做商务报表),两种渲染器都可以适用,并不需要太多纠结。</li>\n<li>在环境较差,出现性能问题需要优化的场景下,可以通过试验来确定使用哪种渲染器。比如有这些经验:<ul>\n<li>在须要创建很多 ECharts 实例且浏览器易崩溃的情况下(可能是因为 Canvas 数量多导致内存占用超出手机承受能力),可以使用 SVG 渲染器来进行改善。大略得说,如果图表运行在低端安卓机,或者我们在使用一些特定图表如 <a href=\"https://ecomfe.github.io/echarts-liquidfill/example/\" target=\"_blank\">水球图</a> 等,SVG 渲染器可能效果更好。</li>\n<li>数据量很大、较多交互时,可以选用 Canvas 渲染器。</li>\n</ul>\n</li>\n</ul>\n<p>我们强烈欢迎开发者们 <a href=\"https://github.com/apache/incubator-echarts/issues/new\" target=\"_blank\">反馈</a> 给我们使用的体验和场景,帮助我们更好的做优化。</p>\n<p>注:除了某些特殊的渲染可能依赖 Canvas:如<a href=\"option.html#series-lines.effect\" target=\"_blank\">炫光尾迹特效</a>、<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=heatmap-bmap\" target=\"_blank\">带有混合效果的热力图</a>等,绝大部分功能 SVG 都是支持的。此外,目前的 SVG 版中,富文本、材质功能尚未实现。</p>\n<h2 id=\"-\">如何使用渲染器</h2>\n<p>ECharts 默认使用 Canvas 渲染。如果想使用 SVG 渲染,ECharts 代码中须包括有 SVG 渲染器模块。</p>\n<ul>\n<li>ECharts 的 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">预构建文件</a> 中,<a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.common.min.js\" target=\"_blank\">常用版</a> 和 <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js\" target=\"_blank\">完整版</a> 已经包含了 SVG 渲染器,可直接使用。而 <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.simple.min.js\" target=\"_blank\">精简版</a> 没有包括。</li>\n<li>如果 <a href=\"https://echarts.apache.org/zh/builder.html\" target=\"_blank\">在线自定义构建 ECharts</a>,则需要勾上页面下方的 “SVG 渲染”。</li>\n<li>如果 <a href=\"tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">线下自定义构建 ECharts</a>,则须引入 SVG 渲染器模块,即:</li>\n</ul>\n<pre><code class=\"lang-js\">import &#39;zrender/lib/svg/svg&#39;;\n</code></pre>\n<p>然后,我们就可以在代码中,初始化图表实例时,<a href=\"api.html#echarts.init\" target=\"_blank\">传入参数</a> 选择渲染器类型:</p>\n<pre><code class=\"lang-js\">// 使用 Canvas 渲染器(默认)\nvar chart = echarts.init(containerDom, null, {renderer: &#39;canvas&#39;});\n// 等价于:\nvar chart = echarts.init(containerDom);\n\n// 使用 SVG 渲染器\nvar chart = echarts.init(containerDom, null, {renderer: &#39;svg&#39;});\n</code></pre>\n"},"在图表中支持无障碍访问":{"type":["*"],"description":"<p>W3C 制定了无障碍富互联网应用规范集(<a href=\"https://www.w3.org/WAI/intro/aria\" target=\"_blank\">WAI-ARIA</a>,the Accessible Rich Internet Applications Suite),致力于使得网页内容和网页应用能够被更多残障人士访问。Apache ECharts (incubating)<sup>TM</sup> 4.0 遵从这一规范,支持自动根据图表配置项智能生成描述,使得盲人可以在朗读设备的帮助下了解图表内容,让图表可以被更多人群访问。</p>\n<p>默认关闭,需要通过将 <a href=\"option.html#aria.show\" target=\"_blank\">aria.show</a> 设置为 <code class=\"codespan\">true</code> 开启。开启后,会根据图表、数据、标题等情况,自动智能生成关于图表的描述,用户也可以通过配置项修改描述。</p>\n<p>对于配置项:</p>\n<pre><code class=\"lang-js\">option = {\n    aria: {\n        show: true\n    },\n    title: {\n        text: &#39;某站点用户访问来源&#39;,\n        x: &#39;center&#39;\n    },\n    series: [\n        {\n            name: &#39;访问来源&#39;,\n            type: &#39;pie&#39;,\n            data: [\n                { value: 335, name: &#39;直接访问&#39; },\n                { value: 310, name: &#39;邮件营销&#39; },\n                { value: 234, name: &#39;联盟广告&#39; },\n                { value: 135, name: &#39;视频广告&#39; },\n                { value: 1548, name: &#39;搜索引擎&#39; }\n            ]\n        }\n    ]\n};\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/aria-pie&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n<p>生成的图表 DOM 上,会有一个 <code class=\"codespan\">aria-label</code> 属性,在朗读设备的帮助下,盲人能够了解图表的内容。其值为:</p>\n<pre><code>这是一个关于“某站点用户访问来源”的图表。图表类型是饼图,表示访问来源。其数据是——直接访问的数据是335,邮件营销的数据是310,联盟广告的数据是234,视频广告的数据是135,搜索引擎的数据是1548。\n</code></pre><h2 id=\"-\">整体修改描述</h2>\n<p>对于有些图表,默认生成的数据点的描述并不足以表现整体的信息。比如下图的散点图,默认生成的描述可以包含数据点的坐标值,但是知道几百几千个点的坐标并不能帮助我们有效地理解图表表达的信息。</p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/aria-example.png\"></p>\n<p>这时候,用户可以通过 <a href=\"option.html#aria.description\" target=\"_blank\">aria.description</a> 配置项指定图表的整体描述。</p>\n<h2 id=\"-\">定制模板描述</h2>\n<p>除了整体性修改描述之外,我们还提供了生成描述的模板,可以方便地进行细粒度的修改。</p>\n<p>生成描述的基本流程为,如果 <a href=\"option.html#aria.show\" target=\"_blank\">aria.show</a> 设置为 <code class=\"codespan\">true</code>,则生成无障碍访问描述,否则不生成。如果定义了 <a href=\"option.html#aria.description\" target=\"_blank\">aria.description</a>,则将其作为图表的完整描述,否则根据模板拼接生成描述。我们提供了默认的生成描述的算法,仅当生成的描述不太合适时,才需要修改这些模板,甚至使用 <code class=\"codespan\">aria.description</code> 完全覆盖。</p>\n<p>使用模板拼接时,先根据是否存在标题 <a href=\"#title.text\">title.text</a> 决定使用 <a href=\"option.html#aria.general.withTitle\" target=\"_blank\">aria.general.withTitle</a> 还是 <a href=\"option.html#aria.general.withoutTitle\" target=\"_blank\">aria.general.withoutTitle</a> 作为整体性描述。其中,<code class=\"codespan\">aria.general.withTitle</code> 配置项包括模板变量 <code class=\"codespan\">&#39;{title}&#39;</code>,将会被替换成图表标题。也就是说,如果 <code class=\"codespan\">aria.general.withTitle</code> 被设置为 <code class=\"codespan\">&#39;图表的标题是:{title}。&#39;</code>,则如果包含标题 <code class=\"codespan\">&#39;价格分布图&#39;</code>,这部分的描述为 <code class=\"codespan\">&#39;图表的标题是:价格分布图。&#39;</code>。</p>\n<p>拼接完标题之后,会依次拼接系列的描述(<a href=\"option.html#aria.series\" target=\"_blank\">aria.series</a>),和每个系列的数据的描述(<a href=\"option.html#aria.data\" target=\"_blank\">aria.data</a>)。同样,每个模板都有可能包括模板变量,用以替换实际的值。</p>\n<p>完整的描述生成流程请参见 <a href=\"option.html#aria\" target=\"_blank\">ARIA 文档</a>。</p>\n"},"使用 ECharts GL 实现基础的三维可视化":{"type":["*"],"description":"<p>ECharts GL (后面统一简称 GL)为 Apache ECharts (incubating)<sup>TM</sup> 补充了丰富的三维可视化组件,这篇文章我们会简单介绍如何基于 GL 实现一些常见的三维可视化作品。实际上如果你对 ECharts 有一定了解的话,也可以很快的上手 GL,GL 的配置项完全是按照 ECharts 的标准和上手难度来设计的。</p>\n<p>在看完文章之后,你可以前往 <a href=\"https://echarts.apache.org/examples/zh/index.html#chart-type-globe\" target=\"_blank\">官方示例</a> 和 <a href=\"https://gallery.echartsjs.com/explore.html#tags=echarts-gl\" target=\"_blank\">Gallery</a> 去了解更多使用 GL 制作的示例,对于文章中我们没法解释到的代码,也可以前往 <a href=\"option-gl.html\" target=\"_blank\">GL 配置项手册</a> 查看具体的配置项使用方法。</p>\n<h2 id=\"-echarts-gl\">如何下载和引入 ECharts GL</h2>\n<p>为了不再增加已经很大了的 ECharts 完整版的体积,我们将 GL 作为扩展包的形式提供,和诸如水球图这样的扩展类似,如果要使用 GL 里的各种组件,只需要在引入<code class=\"codespan\">echarts.min.js</code>的基础上再引入一个<code class=\"codespan\">echarts-gl.min.js</code>。你可以从 <a href=\"https://echarts.apache.org/zh/download.html\" target=\"_blank\">官网</a> 下载最新版的 GL,然后在页面中通过标签引入:</p>\n<pre><code class=\"lang-html\">&lt;script src=&quot;lib/echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;script src=&quot;lib/echarts-gl.min.js&quot;&gt;&lt;/script&gt;\n</code></pre>\n<p>如果你的项目使用 webpack 或者 rollup 来打包代码的话,也可以通过 npm 安装后引入</p>\n<pre><code class=\"lang-bash\">npm install echarts\nnpm install echarts-gl\n</code></pre>\n<pre><code class=\"lang-js\">// 通过 ES6 的 import 语法引入 ECharts 和 ECharts GL\nimport echarts from &#39;echarts&#39;;\nimport &#39;echarts-gl&#39;;\n</code></pre>\n<h2 id=\"-\">声明一个基础的三维笛卡尔坐标系</h2>\n<p>引入 ECharts 和 ECharts GL 后,我们先来声明一个基础的三维笛卡尔坐标系用于绘制三维的散点图,柱状图,曲面图等常见的统计图。</p>\n<p>在 ECharts 中我们有 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件用于提供一个矩形的区域放置一个二维的笛卡尔坐标系,以及笛卡尔坐标系上上的 x 轴(<a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>)和 y 轴(<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>)。对于三维的笛卡尔坐标系,我们在 GL 中提供了 <a href=\"option-gl.html#grid3D\" target=\"_blank\">grid3D</a> 组件用于划分一块三维的笛卡尔空间,以及放置在这个 <a href=\"option-gl.html#grid3D\" target=\"_blank\">grid3D</a> 上的 <a href=\"option-gl.html#xAxis3D\" target=\"_blank\">xAxis3D</a>, <a href=\"option-gl.html#yAxis3D\" target=\"_blank\">yAxis3D</a>, <a href=\"option-gl.html#zAxis3D\" target=\"_blank\">zAxis3D</a>。</p>\n<blockquote>\n<p>小提示:在 GL 中我们对除了 globe 之外所有的三维组件和系列都加了 3D 的后缀用以区分,例如三维的散点图就是 scatter3D,三维的地图就是 map3D 等等。</p>\n</blockquote>\n<p>下面这段代码就声明了一个最简单的三维笛卡尔坐标系</p>\n<pre><code class=\"lang-js\">var option = {\n    // 需要注意的是我们不能跟 grid 一样省略 grid3D\n    grid3D: {},\n    // 默认情况下, x, y, z 分别是从 0 到 1 的数值轴\n    xAxis3D: {},\n    yAxis3D: {},\n    zAxis3D: {}\n}\n</code></pre>\n<p>效果如下:</p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/grid3D-basic.png\"></p>\n<p>跟二维的笛卡尔坐标系一样,每个轴都会有多种类型,默认是数值轴,如果需要是类目轴的话,简单的设置为 <code class=\"codespan\">type: &#39;category&#39;</code>就行了。</p>\n<h2 id=\"-\">绘制三维的散点图</h2>\n<p>声明好笛卡尔坐标系后,我们先试试用一份程序生成的正态分布数据在这个三维的笛卡尔坐标系中画散点图。</p>\n<p>下面这段是生成正态分布数据的代码,你可以先不用关心这段代码是怎么工作的,只需要知道它生成了一份三维的正态分布数据放在<code class=\"codespan\">data</code>数组中。</p>\n<pre><code class=\"lang-js\">function makeGaussian(amplitude, x0, y0, sigmaX, sigmaY) {\n    return function (amplitude, x0, y0, sigmaX, sigmaY, x, y) {\n        var exponent = -(\n                ( Math.pow(x - x0, 2) / (2 * Math.pow(sigmaX, 2)))\n                + ( Math.pow(y - y0, 2) / (2 * Math.pow(sigmaY, 2)))\n            );\n        return amplitude * Math.pow(Math.E, exponent);\n    }.bind(null, amplitude, x0, y0, sigmaX, sigmaY);\n}\n// 创建一个高斯分布函数\nvar gaussian = makeGaussian(50, 0, 0, 20, 20);\n\nvar data = [];\nfor (var i = 0; i &lt; 1000; i++) {\n    // x, y 随机分布\n    var x = Math.random() * 100 - 50;\n    var y = Math.random() * 100 - 50;\n    var z = gaussian(x, y);\n    data.push([x, y, z]);\n}\n</code></pre>\n<p>生成的正态分布的数据大概长这样:</p>\n<pre><code class=\"lang-js\">[\n  [46.74395071259907, -33.88391024738553, 0.7754030099768191],\n  [-18.45302873809771, 16.88114775416834, 22.87772504105404],\n  [2.9908128281121336, -0.027699444453467947, 49.44400635911886],\n  ...\n]\n</code></pre>\n<p>每一项都包含了<code class=\"codespan\">x</code>, <code class=\"codespan\">y</code>, <code class=\"codespan\">z</code>三个值,这三个值会分别被映射到笛卡尔坐标系的 x 轴,y 轴和 z 轴上。</p>\n<p>然后我们可以使用 GL 提供的 <a href=\"option-gl.html#series-scatter3D\" target=\"_blank\">scatter3D</a> 系列类型把这些数据画成三维空间中正态分布的点。</p>\n<pre><code class=\"lang-js\">option = {\n    grid3D: {},\n    xAxis3D: {},\n    yAxis3D: {},\n    zAxis3D: { max: 100 },\n    series: [{\n        type: &#39;scatter3D&#39;,\n        data: data\n    }]\n}\n</code></pre>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/scatter3D-gaussian.png\"></p>\n<h2 id=\"-\">使用真实数据的三维散点图</h2>\n<p>接下来我们来看一个使用真实多维数据的三维散点图例子。</p>\n<p>可以先从 <a href=\"https://echarts.apache.org/examples/data/asset/data/life-expectancy-table.json\" target=\"_blank\">https://echarts.apache.org/examples/data/asset/data/life-expectancy-table.json</a> 获取这份数据。</p>\n<p>格式化一下可以看到这份数据是很传统转成 JSON 后的表格格式。第一行是每一列数据的属性名,可以从这个属性名看出来每一列数据的含义,分别是人均收入,人均寿命,人口数量,国家和年份。</p>\n<pre><code class=\"lang-js\">[\n    [&quot;Income&quot;, &quot;Life Expectancy&quot;, &quot;Population&quot;, &quot;Country&quot;, &quot;Year&quot;],\n    [815, 34.05, 351014, &quot;Australia&quot;, 1800],\n    [1314, 39, 645526, &quot;Canada&quot;, 1800],\n    [985, 32, 321675013, &quot;China&quot;, 1800],\n    [864, 32.2, 345043, &quot;Cuba&quot;, 1800],\n    [1244, 36.5731262, 977662, &quot;Finland&quot;, 1800],\n    ...\n]\n</code></pre>\n<p>在 ECharts 4 中我们可以使用 dataset 组件非常方便地引入这份数据。如果对 dataset 还不熟悉的话可以看<a href=\"tutorial.html#%E4%BD%BF%E7%94%A8%20dataset%20%E7%AE%A1%E7%90%86%E6%95%B0%E6%8D%AE\" target=\"_blank\">dataset使用教程</a></p>\n<pre><code class=\"lang-js\">$.get(&#39;data/asset/data/life-expectancy-table.json&#39;, function (data) {\n    myChart.setOption({\n        grid3D: {},\n        xAxis3D: {},\n        yAxis3D: {},\n        zAxis3D: {},\n        dataset: {\n            source: data\n        },\n        series: [\n            {\n                type: &#39;scatter3D&#39;,\n                symbolSize: 2.5\n            }\n        ]\n    })\n});\n</code></pre>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/scatter3D-life.png\"></p>\n<p>默认会把前三列,也就是收入(Income),人均寿命(Life Expectancy),人口(Population)分别放到 x、 y、 z 轴上。</p>\n<p>使用 encode 属性我们还可以将指定列的数据映射到指定的坐标轴上,从而省去很多繁琐的数据转换代码。例如我们将 x 轴换成是国家(Country),y 轴换成年份(Year),z 轴换成收入(Income),可以看到不同国家不同年份的人均收入分布。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    grid3D: {},\n    xAxis3D: {\n        // 因为 x 轴和 y 轴都是类目数据,所以需要设置 type: &#39;category&#39; 保证正确显示数据。\n        type: &#39;category&#39;\n    },\n    yAxis3D: {\n        type: &#39;category&#39;\n    },\n    zAxis3D: {},\n    dataset: {\n        source: data\n    },\n    series: [\n        {\n            type: &#39;scatter3D&#39;,\n            symbolSize: 2.5,\n            encode: {\n                // 维度的名字默认就是表头的属性名\n                x: &#39;Country&#39;,\n                y: &#39;Year&#39;,\n                z: &#39;Income&#39;,\n                tooltip: [0, 1, 2, 3, 4]\n            }\n        }\n    ]\n});\n</code></pre>\n<h2 id=\"-visualmap-\">利用 visualMap 组件对三维散点图进行视觉编码</h2>\n<p>刚才多维数据的例子中,我们还有几个维度(列)没能表达出来,利用 ECharts 内置的 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件我们可以继续将第四个维度编码成颜色。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    grid3D: {\n        viewControl: {\n            // 使用正交投影。\n            projection: &#39;orthographic&#39;\n        }\n    },\n    xAxis3D: {\n        // 因为 x 轴和 y 轴都是类目数据,所以需要设置 type: &#39;category&#39; 保证正确显示数据。\n        type: &#39;category&#39;\n    },\n    yAxis3D: {\n        type: &#39;log&#39;\n    },\n    zAxis3D: {},\n    visualMap: {\n        calculable: true,\n        max: 100,\n        // 维度的名字默认就是表头的属性名\n        dimension: &#39;Life Expectancy&#39;,\n        inRange: {\n            color: [&#39;#313695&#39;, &#39;#4575b4&#39;, &#39;#74add1&#39;, &#39;#abd9e9&#39;, &#39;#e0f3f8&#39;, &#39;#ffffbf&#39;, &#39;#fee090&#39;, &#39;#fdae61&#39;, &#39;#f46d43&#39;, &#39;#d73027&#39;, &#39;#a50026&#39;]\n        }\n    },\n    dataset: {\n        source: data\n    },\n    series: [\n        {\n            type: &#39;scatter3D&#39;,\n            symbolSize: 5,\n            encode: {\n                // 维度的名字默认就是表头的属性名\n                x: &#39;Country&#39;,\n                y: &#39;Population&#39;,\n                z: &#39;Income&#39;,\n                tooltip: [0, 1, 2, 3, 4]\n            }\n        }\n    ]\n})\n</code></pre>\n<p>这段代码中我们又在刚才的例子基础上加入了 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件,将<code class=\"codespan\">Life Expectancy</code>这一列数据映射到了不同的颜色。</p>\n<p>除此之外我们还把原来默认的透视投影改成了正交投影。正交投影在某些场景中可以避免因为近大远小所造成的表达错误。</p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/scatter3D-color.png\"></p>\n<p>当然,除了 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件,还可以利用其它的 ECharts 内置组件并且充分利用这些组件的交互效果,比如 <a href=\"option.html#legend\" target=\"_blank\">legend</a>。也可以像 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=scatter3d-scatter&amp;gl=1\" target=\"_blank\">三维散点图和散点矩阵结合使用</a> 这个例子一样实现二维和三维的系列混搭。</p>\n<p>在实现 GL 的时候我们尽可能地把 WebGL 和 Canvas 之间的差异屏蔽了到最小,从而让 GL 的使用可以更加方便自然。</p>\n<h2 id=\"-\">在笛卡尔坐标系上显示其它类型的三维图表</h2>\n<p>除了散点图,我们也可以通过 GL 在三维的笛卡尔坐标系上绘制其它类型的三维图表。比如刚才例子中将 <code class=\"codespan\">scatter3D</code> 类型改成 <code class=\"codespan\">bar3D</code> 就可以变成一个三维的柱状图。</p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/bar3D.png\"></p>\n<p>还有机器学习中会用到的三维曲面图 <a href=\"option-gl.html#series-surface\" target=\"_blank\">surface</a>,三维曲面图常用来表达平面上的数据走势,刚才的正态分布数据我们也可以像下面这样画成曲面图。</p>\n<pre><code class=\"lang-js\">var data = [];\n// 曲面图要求给入的数据是网格形式按顺序分布。\nfor (var y = -50; y &lt;= 50; y++) {\n    for (var x = -50; x &lt;= 50; x++) {\n        var z = gaussian(x, y);\n        data.push([x, y, z]);\n    }\n}\noption = {\n    grid3D: {},\n    xAxis3D: {},\n    yAxis3D: {},\n    zAxis3D: { max: 60 },\n    series: [{\n        type: &#39;surface&#39;,\n        data: data\n    }]\n}\n</code></pre>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/surface.png\"></p>\n<h2 id=\"-\">老板想要立体的柱状图效果</h2>\n<p>最后,我们经常会被问到如何用 ECharts 画只有二维数据的立体柱状图效果。一般来说我们是不推荐这么做的,因为这种不必要的立体柱状图很容易造成错误的表达,具体可以见我们 <a href=\"https://vis.baidu.com/chartusage/bar/\" target=\"_blank\">柱状图使用指南</a> 中的解释。</p>\n<p>但是如果有一些其他因素导致必须得画成立体的柱状图的话,用 GL 也可以实现。<a href=\"https://gallery.echartsjs.com/explore.html?u=bd-3056387051\" target=\"_blank\">丶灬豆奶</a> 和 <a href=\"https://gallery.echartsjs.com/explore.html?u=bd-809368804\" target=\"_blank\">阿洛儿啊</a> 在 Gallery 已经写了类似的例子,大家可以参考。</p>\n<p><a href=\"https://gallery.echartsjs.com/explore.html?u=bd-3056387051\" target=\"_blank\">3D堆积柱状图</a></p>\n<p><a href=\"https://gallery.echartsjs.com/editor.html?c=xryQDPYK0b\" target=\"_blank\">3D柱状图</a></p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/bar3D-2d-data.png\"></p>\n"},"在微信小程序中使用 ECharts":{"type":["*"],"description":"<p>我们接到了很多微信小程序开发者的反馈,表示他们强烈需要像 Apache ECharts (incubating)<sup>TM</sup> 这样的可视化工具。但是微信小程序是不支持 DOM 操作的,Canvas 接口也和浏览器不尽相同。</p>\n<p>因此,我们和微信小程序官方团队合作,提供了 ECharts 的微信小程序版本。开发者可以通过熟悉的 ECharts 配置方式,快速开发图表,满足各种可视化需求。</p>\n<h2 id=\"-\">体验示例小程序</h2>\n<p>在微信中扫描下面的二维码即可体验 ECharts Demo:</p>\n<p><img width=\"auto\" height=\"auto\" src=\"https://github.com/ecomfe/echarts-for-weixin/raw/master/img/weixin-app.jpg\"></p>\n<h2 id=\"-\">下载</h2>\n<p>为了兼容小程序 Canvas,我们提供了一个小程序的组件,用这种方式可以方便地使用 ECharts。</p>\n<p>首先,下载 GitHub 上的 <a href=\"https://github.com/ecomfe/echarts-for-weixin\" target=\"_blank\">ecomfe/echarts-for-weixin</a> 项目。</p>\n<p>其中,<code class=\"codespan\">ec-canvas</code> 是我们提供的组件,其他文件是如何使用该组件的示例。</p>\n<p><code class=\"codespan\">ec-canvas</code> 目录下有一个 <code class=\"codespan\">echarts.js</code>,默认我们会在每次 <code class=\"codespan\">echarts-for-weixin</code> 项目发版的时候替换成最新版的 ECharts。如有必要,可以自行从 ECharts 项目中下载<a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">最新发布版</a>,或者从<a href=\"https://echarts.apache.org/builder.html\" target=\"_blank\">官网自定义构建</a>以减小文件大小。</p>\n<h2 id=\"-\">引入组件</h2>\n<p>微信小程序的项目创建可以参见<a href=\"https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/\" target=\"_blank\">微信公众平台官方文档</a>。</p>\n<p>在创建项目之后,可以将下载的 <a href=\"https://github.com/ecomfe/echarts-for-weixin\" target=\"_blank\">ecomfe/echarts-for-weixin</a> 项目完全替换新建的项目,然后将修改代码;或者仅拷贝 <code class=\"codespan\">ec-canvas</code> 目录到新建的项目下,然后做相应的调整。</p>\n<p>如果采用完全替换的方式,需要将 <code class=\"codespan\">project.config.json</code> 中的 <code class=\"codespan\">appid</code> 替换成在公众平台申请的项目 id。<code class=\"codespan\">pages</code> 目录下的每个文件夹是一个页面,可以根据情况删除不需要的页面,并且在 <code class=\"codespan\">app.json</code> 中删除对应页面。</p>\n<p>如果仅拷贝 <code class=\"codespan\">ec-canvas</code> 目录,则可以参考 <code class=\"codespan\">pages/bar</code> 目录下的几个文件的写法。下面,我们具体地说明。</p>\n<h2 id=\"-\">创建图表</h2>\n<p>首先,在 <code class=\"codespan\">pages/bar</code> 目录下新建以下几个文件:<code class=\"codespan\">index.js</code>、 <code class=\"codespan\">index.json</code>、 <code class=\"codespan\">index.wxml</code>、 <code class=\"codespan\">index.wxss</code>。并且在 <code class=\"codespan\">app.json</code> 的 <code class=\"codespan\">pages</code> 中增加 <code class=\"codespan\">&#39;pages/bar/index&#39;</code>。</p>\n<p><code class=\"codespan\">index.json</code> 配置如下:</p>\n<pre><code class=\"lang-json\">{\n  &quot;usingComponents&quot;: {\n    &quot;ec-canvas&quot;: &quot;../../ec-canvas/ec-canvas&quot;\n  }\n}\n</code></pre>\n<p>这一配置的作用是,允许我们在 <code class=\"codespan\">pages/bar/index.wxml</code> 中使用 <code class=\"codespan\">&lt;ec-canvas&gt;</code> 组件。注意路径的相对位置要写对,如果目录结构和本例相同,就应该像上面这样配置。</p>\n<p><code class=\"codespan\">index.wxml</code> 中,我们创建了一个 <code class=\"codespan\">&lt;ec-canvas&gt;</code> 组件,内容如下:</p>\n<pre><code class=\"lang-xml\">&lt;view class=&quot;container&quot;&gt;\n  &lt;ec-canvas id=&quot;mychart-dom-bar&quot; canvas-id=&quot;mychart-bar&quot; ec=&quot;{{ ec }}&quot;&gt;&lt;/ec-canvas&gt;\n&lt;/view&gt;\n</code></pre>\n<p>其中 <code class=\"codespan\">ec</code> 是一个我们在 <code class=\"codespan\">index.js</code> 中定义的对象,它使得图表能够在页面加载后被初始化并设置。<code class=\"codespan\">index.js</code> 的结构如下:</p>\n<pre><code class=\"lang-js\">function initChart(canvas, width, height) {\n  const chart = echarts.init(canvas, null, {\n    width: width,\n    height: height\n  });\n  canvas.setChart(chart);\n\n  var option = {\n    ...\n  };\n  chart.setOption(option);\n  return chart;\n}\n\nPage({\n  data: {\n    ec: {\n      onInit: initChart\n    }\n  }\n});\n</code></pre>\n<p>这对于所有 ECharts 图表都是通用的,用户只需要修改上面 <code class=\"codespan\">option</code> 的内容,即可改变图表。<code class=\"codespan\">option</code> 的使用方法参见 <a href=\"option.html\" target=\"_blank\">ECharts 配置项文档</a>。对于不熟悉 ECharts 的用户,可以参见 <a href=\"tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts\" target=\"_blank\">5 分钟上手 ECharts</a> 教程。</p>\n<p>完整的例子请参见 <a href=\"https://github.com/ecomfe/echarts-for-weixin\" target=\"_blank\">ecomfe/echarts-for-weixin</a> 项目。</p>\n<h2 id=\"-\">暂不支持的功能</h2>\n<p>ECharts 中的绝大部分功能都支持小程序版本,因此这里仅说明不支持的功能,以及存在的问题。</p>\n<p>以下功能尚不支持,如果有相关需求请在 <a href=\"https://github.com/ecomfe/echarts-for-weixin/issues\" target=\"_blank\">issue</a> 中向我们反馈,对于反馈人数多的需求将优先支持:</p>\n<ul>\n<li>Tooltip</li>\n<li>图片</li>\n<li>多个 zlevel 分层</li>\n</ul>\n<p>此外,目前还有一些 bug 尚未修复,部分需要小程序团队配合上线支持,但不影响基本的使用。已知的 bug 包括:</p>\n<ul>\n<li>安卓平台:transform 的问题(会影响关系图边两端的标记位置、旭日图文字位置等)</li>\n<li>iOS 平台:半透明略有变深的问题</li>\n<li>iOS 平台:渐变色出现在定义区域之外的地方</li>\n</ul>\n<p>如有其它问题,也欢迎在 <a href=\"https://github.com/ecomfe/echarts-for-weixin/issues\" target=\"_blank\">issue</a> 中向我们反馈,谢谢!</p>\n"}}}}
\ No newline at end of file
+{"$schema":"https://echarts.apache.org/doc/json-schem","option":{"type":"Object","properties":{"5 分钟上手 ECharts":{"type":["*"],"description":"<h2 id=\"-echarts\">获取 ECharts</h2>\n<p>你可以通过以下几种方式获取 Apache ECharts (incubating)<sup>TM</sup>。</p>\n<ul>\n<li><p>从 <a href=\"https://echarts.apache.org/zh/download.html\" target=\"_blank\">Apache ECharts (incubating) 官网下载界面</a> 获取官方源码包后构建。</p>\n</li>\n<li><p>在 ECharts 的 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a> 获取。</p>\n</li>\n<li><p>通过 npm 获取 echarts,<code class=\"codespan\">npm install echarts --save</code>,详见“<a href=\"tutorial.html#%E5%9C%A8%20webpack%20%E4%B8%AD%E4%BD%BF%E7%94%A8%20ECharts\" target=\"_blank\">在 webpack 中使用 echarts</a>”</p>\n</li>\n<li><p>通过 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">jsDelivr</a> 等 CDN 引入</p>\n</li>\n</ul>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过标签方式直接引入构建好的 echarts 文件</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;!-- 引入 ECharts 文件 --&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;/html&gt;\n</code></pre>\n<h2 id=\"-\">绘制一个简单的图表</h2>\n<p>在绘图前我们需要为 ECharts 准备一个具备高宽的 DOM 容器。</p>\n<pre><code>&lt;body&gt;\n    &lt;!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n&lt;/body&gt;\n</code></pre><p>然后就可以通过 <a href=\"api.html#echarts.init\" target=\"_blank\">echarts.init</a> 方法初始化一个 echarts 实例并通过 <a href=\"api.html#echartsInstance.setOption\" target=\"_blank\">setOption</a> 方法生成一个简单的柱状图,下面是完整代码。</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;ECharts&lt;/title&gt;\n    &lt;!-- 引入 echarts.js --&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- 为ECharts准备一个具备大小(宽高)的Dom --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n        // 基于准备好的dom,初始化echarts实例\n        var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n        // 指定图表的配置项和数据\n        var option = {\n            title: {\n                text: &#39;ECharts 入门示例&#39;\n            },\n            tooltip: {},\n            legend: {\n                data:[&#39;销量&#39;]\n            },\n            xAxis: {\n                data: [&quot;衬衫&quot;,&quot;羊毛衫&quot;,&quot;雪纺衫&quot;,&quot;裤子&quot;,&quot;高跟鞋&quot;,&quot;袜子&quot;]\n            },\n            yAxis: {},\n            series: [{\n                name: &#39;销量&#39;,\n                type: &#39;bar&#39;,\n                data: [5, 20, 36, 10, 10, 20]\n            }]\n        };\n\n        // 使用刚指定的配置项和数据显示图表。\n        myChart.setOption(option);\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>这样你的第一个图表就诞生了!</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/getting-started&reset=1&edit=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p>你也可以直接进入 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=doc-example/getting-started\" target=\"_blank\">ECharts Gallery</a> 中查看编辑示例</p>\n"},"自定义构建 ECharts":{"type":["*"],"description":"<p>一般来说,可以直接从 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> 中获取构建后的 Apache ECharts (incubating)<sup>TM</sup>,也可以从 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">GitHub</a> 中的 <code class=\"codespan\">echarts/dist</code> 文件夹中获取构建好的 echarts,这都可以直接在浏览器端项目中使用。这些构建好的 echarts 提供了下面这几种定制:</p>\n<ul>\n<li>完全版:<code class=\"codespan\">echarts/dist/echarts.js</code>,体积最大,包含所有的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.all.js</code>。</li>\n<li>常用版:<code class=\"codespan\">echarts/dist/echarts.common.js</code>,体积适中,包含常见的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.common.js</code>。</li>\n<li>精简版:<code class=\"codespan\">echarts/dist/echarts.simple.js</code>,体积较小,仅包含最常用的图表和组件,所包含内容参见:<code class=\"codespan\">echarts/echarts.simple.js</code>。</li>\n</ul>\n<p>我们也可以自己构建 echarts,能够仅仅包括自己所需要的图表和组件。可以用这几种方式自定义构建:</p>\n<ul>\n<li><a href=\"https://echarts.apache.org/zh/builder.html\" target=\"_blank\">在线自定义构建</a>:比较方便。</li>\n<li>使用 <code class=\"codespan\">echarts/build/build.js</code> 脚本自定义构建:比在线构建更灵活一点,并且支持多语言。</li>\n<li>直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自己构建:也是一种选择。</li>\n</ul>\n<p>下面我们举些小例子,介绍后两种方式。</p>\n<h2 id=\"-echarts\">准备工作:创建自己的工程和安装 echarts</h2>\n<p>使用命令行,创建自己的工程:</p>\n<pre><code class=\"lang-shell\">mkdir myProject\ncd myProject\n</code></pre>\n<p>在 <code class=\"codespan\">myProject</code> 目录下使用命令行,初始化工程的 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a> 环境并安装 echarts(这里前提是您已经安装了 <a href=\"https://www.npmjs.com/\" target=\"_blank\">npm</a>):</p>\n<pre><code class=\"lang-shell\">npm init\nnpm install echarts --save\n</code></pre>\n<p>通过 npm 安装的 echarts 会出现在 <code class=\"codespan\">myProject/node_modules</code> 目录下,从而可以直接在项目代码中得到 echarts,例如:</p>\n<p>使用 ES Module:</p>\n<pre><code class=\"lang-js\">import * as echarts from &#39;echarts&#39;;\n</code></pre>\n<p>使用 CommonJS:</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;)\n</code></pre>\n<p>下面仅以使用 ES Module 的方式来举例。</p>\n<h2 id=\"-echarts-\">使用 echarts 提供的构建脚本自定义构建</h2>\n<p>在这个例子中,我们要创建一个饼图,并且想自定义构建一个只含有饼图的 echarts 文件,从而能使 echarts 文件的大小比较小一些。</p>\n<p>echarts 已经提供了构建脚本 <code class=\"codespan\">echarts/build/build.js</code>,基于 <a href=\"https://nodejs.org\" target=\"_blank\">Node.js</a> 运行。我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,看到它的使用方式:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --help\n</code></pre>\n<p>其中我们在这个例子里会用到的参数有:</p>\n<ul>\n<li><code class=\"codespan\">-i</code>:代码入口文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">-o</code>:生成的 bundle 文件,可以是绝对路径或者基于当前命令行路径的相对路径。</li>\n<li><code class=\"codespan\">--min</code>:是否压缩文件(默认不压缩),并且去多余的打印错误信息的代码,形成生产环境可用的文件。</li>\n<li><code class=\"codespan\">--lang &lt;language shortcut or file path&gt;</code>:是否使用其他语言版本,默认是中文。例如:<code class=\"codespan\">--lang en</code> 表示使用英文,<code class=\"codespan\">--lang my/langXX.js</code> 表示构建时使用 <code class=\"codespan\">&lt;cwd&gt;/my/langXX.js</code> 替代 <code class=\"codespan\">echarts/lib/lang.js</code> 文件。</li>\n<li><code class=\"codespan\">--sourcemap</code>:是否输出 source map,以便于调试。</li>\n<li><code class=\"codespan\">--format</code>:输出的格式,可选 <code class=\"codespan\">&#39;umb&#39;</code>(默认)、<code class=\"codespan\">&#39;amd&#39;</code>、<code class=\"codespan\">&#39;iife&#39;</code>、<code class=\"codespan\">&#39;cjs&#39;</code>、<code class=\"codespan\">&#39;es&#39;</code>。</li>\n</ul>\n<p>既然我们想自定义构建一个只含有饼图的 echarts 文件,我们需要创建一个入口文件,可以命名为 <code class=\"codespan\">myProject/echarts.custom.js</code>,文件里会引用所需要的 echarts 模块:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nexport * from &#39;echarts/src/echarts&#39;;\n// 引入饼图。\nimport &#39;echarts/src/chart/pie&#39;;\n// 在这个场景下,可以引用 `echarts/src` 或者 `echarts/lib` 下的文件(但是不可混用),\n// 参见下方的解释:“引用 `echarts/lib/**` 还是 `echarts/src/**`”。\n</code></pre>\n<p>然后我们可以在 <code class=\"codespan\">myProject</code> 目录下使用命令行,这样开始构建:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js\n</code></pre>\n<p>这样,<code class=\"codespan\">myProject/lib/echarts.custom.min.js</code> 就生成了。我们可以创建 <code class=\"codespan\">myProject/pie.html</code> 来使用它:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n    &lt;!-- 引入 lib/echarts.custom.min.js --&gt;\n    &lt;script src=&quot;lib/echarts.custom.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script&gt;\n        // 绘制图表。\n        echarts.init(document.getElementById(&#39;main&#39;)).setOption({\n            series: {\n                type: &#39;pie&#39;,\n                data: [\n                    {name: &#39;A&#39;, value: 1212},\n                    {name: &#39;B&#39;, value: 2323},\n                    {name: &#39;C&#39;, value: 1919}\n                ]\n            }\n        });\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>然后在浏览器里打开 <code class=\"codespan\">myProject/pie.html</code>,就可以看到一个饼图:</p>\n<p><img width=\"300\" height=\"auto\" src=\"documents/asset/img/custom-build-pie.png\"></p>\n<h2 id=\"-\">允许被引用的模块</h2>\n<p>在自定义构建中,允许被引用的模块,全声明在 <a href=\"https://github.com/apache/incubator-echarts/blob/master/echarts.all.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/echarts.all.js</code></a> 和 <a href=\"https://github.com/apache/incubator-echarts/blob/master/src/export.js\" target=\"_blank\"><code class=\"codespan\">myProject/node_module/echarts/src/export.js</code></a> 中。echarts 和 zrender 源代码中的其他模块,都是 echarts 的内部模块,<strong>不应该去引用</strong>。因为在后续 echarts 版本升级中,内部模块的接口和功能可能变化,甚至模块本身也可能被移除。</p>\n<h2 id=\"-echarts-lib-echarts-src-\">引用 <code class=\"codespan\">echarts/lib/**</code> 还是 <code class=\"codespan\">echarts/src/**</code></h2>\n<ul>\n<li>项目中如果直接引用 echarts 里的一些模块并自行构建,应该使用 <code class=\"codespan\">echarts/lib/**</code> 路径,而不可使用 <code class=\"codespan\">echarts/src/**</code>。</li>\n<li>当使用构建脚本 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle,那么两者可以选其一使用(不可混用),使用 <code class=\"codespan\">echarts/src/**</code> 可以获得稍微小一些的文件体积。</li>\n</ul>\n<blockquote>\n<p>原因是:目前,<code class=\"codespan\">echarts/src/**</code> 中是采用 ES Module 的源代码,<code class=\"codespan\">echarts/lib/**</code> 中是 <code class=\"codespan\">echarts/src/**</code> 编译成为 CommonJS 后的产物(编译成 CommonJS 是为了向后兼容一些不支持 ES Module 的老版本 NodeJS 和 webpack)。\n因为历史上,各个 echarts 扩展、各个用户项目,一直是使用的包路径是 <code class=\"codespan\">echarts/lib/**</code>,所以这个路径不应该改变,否则,可能导致混合使用 <code class=\"codespan\">echarts/src/**</code> 和 <code class=\"codespan\">echarts/lib/**</code> 得到两个不同的 echarts 名空间,造成问题。而使用 <code class=\"codespan\">echarts/build/build.js</code> 打包 bundle 时没有涉及这个问题,<code class=\"codespan\">echarts/src/**</code> 中的 ES Module 便于静态分析从而得到稍微小些的文件体积。</p>\n</blockquote>\n<h2 id=\"-rollup-\">直接使用 rollup 自定义构建</h2>\n<p>上文中介绍了如何使用 echarts 提供的脚本 <code class=\"codespan\">echarts/build/build.js</code> 自定义构建。与此并列的另一种选择是,我们直接使用构建工具(如 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>、<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a>、<a href=\"http://browserify.org/\" target=\"_blank\">browserify</a>)自定义构建,并且把 echarts 代码和项目代码在构建成一体。在一些项目中可能需要这么做。下面我们仅仅介绍如何使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 来构建。<a href=\"https://webpack.js.org/\" target=\"_blank\">webpack</a> 和 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 与此类同,不赘述。</p>\n<p>首先我们在 <code class=\"codespan\">myProject</code> 目录下使用 npm 安装 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a>:</p>\n<pre><code class=\"lang-shell\">npm install rollup --save-dev\nnpm install rollup-plugin-node-resolve --save-dev\nnpm install rollup-plugin-uglify --save-dev\n</code></pre>\n<p>接下来创建项目 JS 文件 <code class=\"codespan\">myProject/line.js</code> 来绘制图表,内容为:</p>\n<pre><code class=\"lang-js\">// 引入 echarts 主模块。\nimport * as echarts from &#39;echarts/lib/echarts&#39;;\n// 引入折线图。\nimport &#39;echarts/lib/chart/line&#39;;\n// 引入提示框组件、标题组件、工具箱组件。\nimport &#39;echarts/lib/component/tooltip&#39;;\nimport &#39;echarts/lib/component/title&#39;;\nimport &#39;echarts/lib/component/toolbox&#39;;\n\n// 基于准备好的dom,初始化 echarts 实例并绘制图表。\necharts.init(document.getElementById(&#39;main&#39;)).setOption({\n    title: {text: &#39;Line Chart&#39;},\n    tooltip: {},\n    toolbox: {\n        feature: {\n            dataView: {},\n            saveAsImage: {\n                pixelRatio: 2\n            },\n            restore: {}\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [{\n        type: &#39;line&#39;,\n        smooth: true,\n        data: [[12, 5], [24, 20], [36, 36], [48, 10], [60, 10], [72, 20]]\n    }]\n});\n</code></pre>\n<p>对于不支持 ES Module 的浏览器而言,刚才创建的 <code class=\"codespan\">myProject/line.js</code> 还不能直接被网页引用并在浏览器中运行,需要进行构建。使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 构建前,需要创建它的配置文件 <code class=\"codespan\">myProject/rollup.config.js</code>,内容如下:</p>\n<pre><code class=\"lang-js\">// 这个插件用于在 `node_module` 文件夹(即 npm 用于管理模块的文件夹)中寻找模块。比如,代码中有\n// `import &#39;echarts/lib/chart/line&#39;;` 时,这个插件能够寻找到\n// `node_module/echarts/lib/chart/line.js` 这个模块文件。\nimport nodeResolve from &#39;rollup-plugin-node-resolve&#39;;\n// 用于压缩构建出的代码。\nimport uglify from &#39;rollup-plugin-uglify&#39;;\n// 用于多语言支持(如果不需要可忽略此 plugin)。\n// import ecLangPlugin from &#39;echarts/build/rollup-plugin-ec-lang&#39;;\n\nexport default {\n    name: &#39;myProject&#39;,\n    // 入口代码文件,就是刚才所创建的文件。\n    input: &#39;./line.js&#39;,\n    plugins: [\n        nodeResolve(),\n        // ecLangPlugin({lang: &#39;en&#39;}),\n        // 消除代码中的 __DEV__ 代码段,从而不在控制台打印错误提示信息。\n        uglify()\n    ],\n    output: {\n        // 以 UMD 格式输出,从而能在各种浏览器中加载使用。\n        format: &#39;umd&#39;,\n        // 输出 source map 便于调试。\n        sourcemap: true,\n        // 输出文件的路径。\n        file: &#39;lib/line.min.js&#39;\n    }\n};\n</code></pre>\n<p>然后在 <code class=\"codespan\">myProject</code> 目录下使用命令行,构建工程代码 <code class=\"codespan\">myProject/line.js</code>:</p>\n<pre><code class=\"lang-shell\">./node_modules/.bin/rollup -c\n</code></pre>\n<blockquote>\n<p>其中 <code class=\"codespan\">-c</code> 表示让 <code class=\"codespan\">rollup</code> 使用我们刚才创建的 <code class=\"codespan\">myProject/rollup.config.js</code> 文件作为配置文件。</p>\n</blockquote>\n<p>构建生成的 <code class=\"codespan\">myProject/lib/line.min.js</code> 文件包括了工程代码和 echarts 代码,并且仅仅包括我们所需要的图和组件,并且可以在浏览器中使用。我们可以用一个示例页面来测试一下,创建文件 <code class=\"codespan\">myProject/line.html</code>,内容如下:</p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;myProject&lt;/title&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;!-- 为 echarts 准备一个具备大小(宽高)的Dom。 --&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;!-- 引入刚才构建好的文件。 --&gt;\n    &lt;script src=&quot;lib/line.min.js&quot;&gt;&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre>\n<p>在浏览器里打开 <code class=\"codespan\">myProject/line.html</code> 则会得到如下效果:</p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/custom-build-line.png\"></p>\n<h2 id=\"-\">多语言支持</h2>\n<p>上面的例子中能看到,工具箱组件(toolbox)的提示文字是中文。本质上,echarts 图表显示出来的文字,都可以通过 <code class=\"codespan\">option</code> 来定制,改成任意语言。但是如果想“默认就是某种语言”,则需要通过构建来实现。</p>\n<p>在上面的例子中,可以在 <code class=\"codespan\">echarts/build/build.js</code> 的参数中指定语言:</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang en\n</code></pre>\n<p>表示使用内置的英文。此外还可以是 <code class=\"codespan\">--lang fi</code>。</p>\n<pre><code class=\"lang-shell\">node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echarts.custom.min.js --lang my/langXX.js\n</code></pre>\n<p>表示在构建时使用 <code class=\"codespan\">myProject/my/langXX.js</code> 文件来替换 <code class=\"codespan\">myProject/node_modules/echarts/lib/lang.js</code> 文件。这样可以在 <code class=\"codespan\">myProject/my/langXX.js</code> 文件中自定义语言。注意这种方式中,必须指定 <code class=\"codespan\">-o</code> 或者 <code class=\"codespan\">--output</code>。</p>\n<p>另外,上面的 rollup 插件 <code class=\"codespan\">echarts/build/rollup-plugin-ec-lang</code> 也可以传入同样的参数,实现同样的功能。</p>\n"},"在 webpack 中使用 ECharts":{"type":["*"],"description":"<p><a href=\"https://webpack.js.org/\" target=\"_blank\">Webpack</a> 是目前比较流行的模块打包工具,你可以在使用 webpack 的项目中轻松的引入和打包 Apache ECharts (incubating)<sup>TM</sup>,这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。</p>\n<h2 id=\"npm-echarts\">npm 安装 ECharts</h2>\n<p>你可以使用如下命令通过 npm 安装 ECharts</p>\n<pre><code class=\"lang-shell\">npm install echarts --save\n</code></pre>\n<h2 id=\"-echarts\">引入 ECharts</h2>\n<p>通过 npm 上安装的 ECharts 和 zrender 会放在<code class=\"codespan\">node_modules</code>目录下。可以直接在项目代码中 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到 ECharts。</p>\n<pre><code class=\"lang-js\">var echarts = require(&#39;echarts&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<h2 id=\"-echarts-\">按需引入 ECharts 图表和组件</h2>\n<p>默认使用 <code class=\"codespan\">require(&#39;echarts&#39;)</code> 得到的是已经加载了所有图表和组件的 ECharts 包,因此体积会比较大,如果在项目中对体积要求比较苛刻,也可以只按需引入需要的模块。</p>\n<p>例如上面示例代码中只用到了柱状图,提示框和标题组件,因此在引入的时候也只需要引入这些模块,可以有效的将打包后的体积从 400 多 KB 减小到 170 多 KB。</p>\n<pre><code class=\"lang-js\">// 引入 ECharts 主模块\nvar echarts = require(&#39;echarts/lib/echarts&#39;);\n// 引入柱状图\nrequire(&#39;echarts/lib/chart/bar&#39;);\n// 引入提示框和标题组件\nrequire(&#39;echarts/lib/component/tooltip&#39;);\nrequire(&#39;echarts/lib/component/title&#39;);\n\n// 基于准备好的dom,初始化echarts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 绘制图表\nmyChart.setOption({\n    title: {\n        text: &#39;ECharts 入门示例&#39;\n    },\n    tooltip: {},\n    xAxis: {\n        data: [&#39;衬衫&#39;, &#39;羊毛衫&#39;, &#39;雪纺衫&#39;, &#39;裤子&#39;, &#39;高跟鞋&#39;, &#39;袜子&#39;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n});\n</code></pre>\n<p>可以按需引入的模块列表见 <a href=\"https://github.com/apache/incubator-echarts/blob/master/index.js\" target=\"_blank\">https://github.com/apache/incubator-echarts/blob/master/index.js</a></p>\n<p>对于流行的模块打包工具 <a href=\"http://browserify.org/\" target=\"_blank\">browserify</a> 也是同样的用法,这里就不赘述了。而对于使用 <a href=\"https://rollupjs.org/\" target=\"_blank\">rollup</a> 的自定义构建,参见 <a href=\"https://echarts.apache.org/zh/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">自定义构建 ECharts</a>。</p>\n"},"ECharts 基础概念概览":{"type":["*"],"description":"<p>本文介绍 Apache ECharts (incubating)<sup>TM</sup> 最基本的名词和概念。</p>\n<h2 id=\"echarts-\">echarts 实例</h2>\n<p>一个网页中可以创建多个 <code class=\"codespan\">echarts 实例</code>。每个 <code class=\"codespan\">echarts 实例</code> 中可以创建多个图表和坐标系等等(用 <code class=\"codespan\">option</code> 来描述)。准备一个 DOM 节点(作为 echarts 的渲染容器),就可以在上面创建一个 echarts 实例。每个 echarts 实例独占一个 DOM 节点。</p>\n<p><br></p>\n<p><img width=\"500\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/multiple-ec-instance.jpg\"></p>\n<h2 id=\"-series-\">系列(series)</h2>\n<p><code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是很常见的名词。在 echarts 里,<code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>)是指:一组数值以及他们映射成的图。“系列”这个词原本可能来源于“一系列的数据”,而在 echarts 中取其扩展的概念,不仅表示数据,也表示数据映射成为的图。所以,一个 <code class=\"codespan\">系列</code> 包含的要素至少有:一组数值、图表类型(<code class=\"codespan\">series.type</code>)、以及其他的关于这些数据如何映射成图的参数。</p>\n<p>echarts 里系列类型(<code class=\"codespan\">series.type</code>)就是图表类型。系列类型(<code class=\"codespan\">series.type</code>)至少有:<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)、...</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了三个 <code class=\"codespan\">系列</code>(<a href=\"option.html#series\" target=\"_blank\">series</a>):<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图系列)、<a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图系列)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图系列),每个系列中有他所需要的数据(<a href=\"option.html#series.data\" target=\"_blank\">series.data</a>)。</p>\n<p><br></p>\n<p><img width=\"700\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-a.jpg\"></p>\n<p><br></p>\n<p>类同地,下图中是另一种配置方式,系列的数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/series-all-b.jpg\"></p>\n<h2 id=\"-component-\">组件(component)</h2>\n<p>在系列之上,echarts 中各种内容,被抽象为“组件”。例如,echarts 中至少有这些组件:<a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)、<a href=\"option.html#angleAxis\" target=\"_blank\">angleAxis</a>(极坐标系角度轴)、<a href=\"option.html#radiusAxis\" target=\"_blank\">radiusAxis</a>(极坐标系半径轴)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系底板)、<a href=\"option.html#geo\" target=\"_blank\">geo</a>(地理坐标系)、<a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>(数据区缩放组件)、<a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>(视觉映射组件)、<a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a>(提示框组件)、<a href=\"option.html#toolbox\" target=\"_blank\">toolbox</a>(工具栏组件)、<a href=\"option.html#series\" target=\"_blank\">series</a>(系列)、...</p>\n<p>我们注意到,其实系列(<a href=\"option.html#series\" target=\"_blank\">series</a>)也是一种组件,可以理解为:系列是专门绘制“图”的组件。</p>\n<p>如下图,右侧的 <code class=\"codespan\">option</code> 中声明了各个组件(包括系列),各个组件就出现在图中。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/components.jpg\"></p>\n<p><br></p>\n<p>注:因为系列是一种特殊的组件,所以有时候也会出现 “组件和系列” 这样的描述,这种语境下的 “组件” 是指:除了 “系列” 以外的其他组件。</p>\n<h2 id=\"-option-\">用 option 描述图表</h2>\n<p>上面已经出现了 <code class=\"codespan\">option</code> 这个概念。echarts 的使用者,使用 <code class=\"codespan\">option</code> 来描述其对图表的各种需求,包括:有什么数据、要画什么图表、图表长什么样子、含有什么组件、组件能操作什么事情等等。简而言之,<code class=\"codespan\">option</code> 表述了:<code class=\"codespan\">数据</code>、<code class=\"codespan\">数据如何映射成图形</code>、<code class=\"codespan\">交互行为</code>。</p>\n<pre><code class=\"lang-js\">// 创建 echarts 实例。\nvar dom = document.getElementById(&#39;dom-id&#39;);\nvar chart = echarts.init(dom);\n\n// 用 option 描述 `数据`、`数据如何映射成图形`、`交互行为` 等。\n// option 是个大的 JavaScript 对象。\nvar option = {\n    // option 每个属性是一类组件。\n    legend: {...},\n    grid: {...},\n    tooltip: {...},\n    toolbox: {...},\n    dataZoom: {...},\n    visualMap: {...},\n    // 如果有多个同类组件,那么就是个数组。例如这里有三个 X 轴。\n    xAxis: [\n        // 数组每项表示一个组件实例,用 type 描述“子类型”。\n        {type: &#39;category&#39;, ...},\n        {type: &#39;category&#39;, ...},\n        {type: &#39;value&#39;, ...}\n    ],\n    yAxis: [{...}, {...}],\n    // 这里有多个系列,也是构成一个数组。\n    series: [\n        // 每个系列,也有 type 描述“子类型”,即“图表类型”。\n        {type: &#39;line&#39;, data: [[&#39;AA&#39;, 332], [&#39;CC&#39;, 124], [&#39;FF&#39;, 412], ... ]},\n        {type: &#39;line&#39;, data: [2231, 1234, 552, ... ]},\n        {type: &#39;line&#39;, data: [[4, 51], [8, 12], ... ]}\n    }]\n};\n\n// 调用 setOption 将 option 输入 echarts,然后 echarts 渲染图表。\nchart.setOption(option);\n</code></pre>\n<p>系列里的 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 是本系列的数据。而另一种描述方式,系列数据从 <a href=\"option.html#dataset\" target=\"_blank\">dataset</a> 中取:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [121, &#39;XX&#39;, 442, 43.11],\n            [663, &#39;ZZ&#39;, 311, 91.14],\n            [913, &#39;ZZ&#39;, 312, 92.12],\n            ...\n        ]\n    },\n    xAxis: {},\n    yAxis: {},\n    series: [\n        // 数据从 dataset 中取,encode 中的数值是 dataset.source 的维度 index (即第几列)\n        {type: &#39;bar&#39;, encode: {x: 1, y: 0}},\n        {type: &#39;bar&#39;, encode: {x: 1, y: 2}},\n        {type: &#39;scatter&#39;, encode: {x: 1, y: 3}},\n        ...\n    ]\n};\n</code></pre>\n<h2 id=\"-\">组件的定位</h2>\n<p>不同的组件、系列,常有不同的定位方式。</p>\n<p><br></p>\n<p><strong>[类 CSS 的绝对定位]</strong></p>\n<p><br></p>\n<p>多数组件和系列,都能够基于 <code class=\"codespan\">top</code> / <code class=\"codespan\">right</code> / <code class=\"codespan\">down</code> / <code class=\"codespan\">left</code> / <code class=\"codespan\">width</code> / <code class=\"codespan\">height</code> 绝对定位。\n这种绝对定位的方式,类似于 <code class=\"codespan\">CSS</code> 的绝对定位(<code class=\"codespan\">position: absolute</code>)。绝对定位基于的是 echarts 容器 DOM 节点。</p>\n<p>其中,他们每个值都可以是:</p>\n<ul>\n<li>绝对数值(例如 <code class=\"codespan\">bottom: 54</code> 表示:距离 echarts 容器底边界 <code class=\"codespan\">54</code> 像素)。</li>\n<li>或者基于 echarts 容器高宽的百分比(例如 <code class=\"codespan\">right: &#39;20%&#39;</code> 表示:距离 echarts 容器右边界的距离是 echarts 容器宽度的 <code class=\"codespan\">20%</code>)。</li>\n</ul>\n<p>如下图的例子,对 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件(也就是直角坐标系的底板)设置 <code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">bottom</code> 达到的效果。</p>\n<p><br></p>\n<p><img width=\"800\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/locate.jpg\"></p>\n<p><br></p>\n<p>我们可以注意到,<code class=\"codespan\">left</code> <code class=\"codespan\">right</code> <code class=\"codespan\">width</code> 是一组(横向)、<code class=\"codespan\">top</code> <code class=\"codespan\">bottom</code> <code class=\"codespan\">height</code> 是另一组(纵向)。这两组没有什么关联。每组中,至多设置两项就可以了,第三项会被自动算出。例如,设置了 <code class=\"codespan\">left</code> 和 <code class=\"codespan\">right</code> 就可以了,<code class=\"codespan\">width</code> 会被自动算出。</p>\n<p><br></p>\n<p><strong>[中心半径定位]</strong></p>\n<p><br></p>\n<p>少数圆形的组件或系列,可以使用“中心半径定位”,例如,<a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-sunburst\" target=\"_blank\">sunburst</a>(旭日图)、<a href=\"option.html#polar\" target=\"_blank\">polar</a>(极坐标系)。</p>\n<p>中心半径定位,往往依据 <a href=\"option.html#series-pie.center\" target=\"_blank\">center</a>(中心)、<a href=\"option.html#series-pie.radius\" target=\"_blank\">radius</a>(半径)来决定位置。</p>\n<p><br></p>\n<p><strong>[其他定位]</strong></p>\n<p><br></p>\n<p>少数组件和系列可能有自己的特殊的定位方式。在他们的文档中会有说明。</p>\n<h2 id=\"-\">坐标系</h2>\n<p>很多系列,例如 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)、<a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)、<a href=\"option.html#series-heatmap\" target=\"_blank\">heatmap</a>(热力图)等等,需要运行在 “坐标系” 上。坐标系用于布局这些图,以及显示数据的刻度等等。例如 echarts 中至少支持这些坐标系:<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a>、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a>、<a href=\"option.html#singleAxis\" target=\"_blank\">单轴坐标系</a>、<a href=\"option.html#calendar\" target=\"_blank\">日历坐标系</a> 等。其他一些系列,例如 <a href=\"option.html#series-pie\" target=\"_blank\">pie</a>(饼图)、<a href=\"option.html#series-tree\" target=\"_blank\">tree</a>(树图)等等,并不依赖坐标系,能独立存在。还有一些图,例如 <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>(关系图)等,既能独立存在,也能布局在坐标系中,依据用户的设定而来。</p>\n<p>一个坐标系,可能由多个组件协作而成。我们以最常见的直角坐标系来举例。直角坐标系中,包括有 <a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>(直角坐标系 X 轴)、<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>(直角坐标系 Y 轴)、<a href=\"option.html#grid\" target=\"_blank\">grid</a>(直角坐标系底板)三种组件。<code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 被 <code class=\"codespan\">grid</code> 自动引用并组织起来,共同工作。</p>\n<p>我们来看下图,这是最简单的使用直角坐标系的方式:只声明了 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code> 和一个 <code class=\"codespan\">scatter</code>(散点图系列),echarts 暗自为他们创建了 <code class=\"codespan\">grid</code> 并关联起他们:</p>\n<p><br></p>\n<p><img width=\"450\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-0.jpg\"></p>\n<p><br></p>\n<p>再来看下图,两个 <code class=\"codespan\">yAxis</code>,共享了一个 <code class=\"codespan\">xAxis</code>。两个 <code class=\"codespan\">series</code>,也共享了这个 <code class=\"codespan\">xAxis</code>,但是分别使用不同的 <code class=\"codespan\">yAxis</code>,使用 <a href=\"option.html#series-line.yAxisIndex\" target=\"_blank\">yAxisIndex</a> 来指定它自己使用的是哪个 <code class=\"codespan\">yAxis</code>:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-1.jpg\"></p>\n<p><br></p>\n<p>再来看下图,一个 echarts 实例中,有多个 <code class=\"codespan\">grid</code>,每个 <code class=\"codespan\">grid</code> 分别有 <code class=\"codespan\">xAxis</code>、<code class=\"codespan\">yAxis</code>,他们使用 <code class=\"codespan\">xAxisIndex</code>、<code class=\"codespan\">yAxisIndex</code>、<code class=\"codespan\">gridIndex</code> 来指定引用关系:</p>\n<p><br></p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/basic-concepts-overview/coord-sys-2.jpg\"></p>\n<p><br></p>\n<p>另外,一个系列,往往能运行在不同的坐标系中。例如,一个 <a href=\"option.html#series-scatter\" target=\"_blank\">scatter</a>(散点图)能运行在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系</a> 、<a href=\"option.html#geo\" target=\"_blank\">地理坐标系(GEO)</a> 等各种坐标系中。同样,一个坐标系,也能承载不同的系列,如上面出现的各种例子,<a href=\"option.html#grid\" target=\"_blank\">直角坐标系</a> 里承载了 <a href=\"option.html#series-line\" target=\"_blank\">line</a>(折线图)、<a href=\"option.html#series-bar\" target=\"_blank\">bar</a>(柱状图)等等。</p>\n"},"个性化图表的样式":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 提供了丰富的自定义配置选项,并且能够从全局、系列、数据三个层级去设置数据图形的样式。下面我们来看如何使用 ECharts 实现下面这个南丁格尔图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n<h2 id=\"-\">绘制南丁格尔图</h2>\n<p><a href=\"#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts\">5分钟上手ECharts</a> 中讲了如何绘制一个简单的柱状图,这次要画的是饼图,饼图主要是通过扇形的弧度表现不同类目的数据在总和中的占比,它的数据格式比柱状图更简单,只有一维的数值,不需要给类目。因为不在直角坐标系上,所以也不需要<code class=\"codespan\">xAxis</code>,<code class=\"codespan\">yAxis</code>。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    series : [\n        {\n            name: &#39;访问来源&#39;,\n            type: &#39;pie&#39;,\n            radius: &#39;55%&#39;,\n            data:[\n                {value:235, name:&#39;视频广告&#39;},\n                {value:274, name:&#39;联盟广告&#39;},\n                {value:310, name:&#39;邮件营销&#39;},\n                {value:335, name:&#39;直接访问&#39;},\n                {value:400, name:&#39;搜索引擎&#39;}\n            ]\n        }\n    ]\n})\n</code></pre>\n<p>上面代码就能画出一个简单的饼图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step0&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>这里<code class=\"codespan\">data</code>属性值不像入门教程里那样每一项都是单个数值,而是一个包含 <code class=\"codespan\">name</code> 和 <code class=\"codespan\">value</code> 属性的对象,ECharts 中的数据项都是既可以只设成数值,也可以设成一个包含有名称、该数据图形的样式配置、标签配置的对象,具体见 <a href=\"option.html#series-pie.data\" target=\"_blank\">data</a> 文档。</p>\n<p>ECharts 中的<a href=\"option.html#series-pie\" target=\"_blank\">饼图</a>也支持通过设置 <a href=\"option.html#series-pie.roseType\" target=\"_blank\">roseType</a> 显示成南丁格尔图。</p>\n<pre><code class=\"lang-js\">roseType: &#39;angle&#39;\n</code></pre>\n<p>南丁格尔图会通过半径表示数据的大小。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step1&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"-\">阴影的配置</h2>\n<p>ECharts 中有一些通用的样式,诸如阴影、透明度、颜色、边框颜色、边框宽度等,这些样式一般都会在系列的 <a href=\"#series-pie.itemStyle\">itemStyle</a> 里设置。例如阴影的样式可以通过下面几个配置项设置:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // 阴影的大小\n    shadowBlur: 200,\n    // 阴影水平方向上的偏移\n    shadowOffsetX: 0,\n    // 阴影垂直方向上的偏移\n    shadowOffsetY: 0,\n    // 阴影颜色\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<p>加上阴影后的效果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step2&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p><code class=\"codespan\">itemStyle</code>的<code class=\"codespan\">emphasis</code>是鼠标 hover 时候的高亮样式。这个示例里是正常的样式下加阴影,但是可能更多的时候是 hover 的时候通过阴影突出。</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    emphasis: {\n        shadowBlur: 200,\n        shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n    }\n}\n</code></pre>\n<h2 id=\"-\">深色背景和浅色标签</h2>\n<p>现在我们需要把整个主题改成开始的示例中那样的深色主题,这就需要改背景色和文本颜色。</p>\n<p>背景色是全局的,所以直接在 option 下设置 <a href=\"option.html#backgroundColor\" target=\"_blank\">backgroundColor</a></p>\n<pre><code class=\"lang-js\">setOption({\n    backgroundColor: &#39;#2c343c&#39;\n})\n</code></pre>\n<p>文本的样式可以设置全局的 <a href=\"option.html#textStyle\" target=\"_blank\">textStyle</a>。</p>\n<pre><code class=\"lang-js\">setOption({\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n})\n</code></pre>\n<p>也可以每个系列分别设置,每个系列的文本设置在 <a href=\"option.html#series-pie.label.textStyle\" target=\"_blank\">label.textStyle</a>。</p>\n<pre><code class=\"lang-js\">label: {\n    textStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>饼图的话还要将标签的视觉引导线的颜色设为浅色。</p>\n<pre><code class=\"lang-js\">labelLine: {\n    lineStyle: {\n        color: &#39;rgba(255, 255, 255, 0.3)&#39;\n    }\n}\n</code></pre>\n<p>如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step3&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>跟<code class=\"codespan\">itemStyle</code>一样,<code class=\"codespan\">label</code>和<code class=\"codespan\">labelLine</code>的样式也有<code class=\"codespan\">emphasis</code>状态。</p>\n<h2 id=\"-\">设置扇形的颜色</h2>\n<p>扇形的颜色也是在 itemStyle 中设置:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    // 设置扇形的颜色\n    color: &#39;#c23531&#39;,\n    shadowBlur: 200,\n    shadowColor: &#39;rgba(0, 0, 0, 0.5)&#39;\n}\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step4&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>跟我们要实现的效果已经挺像了,除了每个扇形的颜色,效果中阴影下面的扇形颜色更深,有种光线被遮住的感觉,从而会出现层次感和空间感。</p>\n<p>ECharts 中每个扇形颜色的可以通过分别设置 data 下的数据项实现。</p>\n<pre><code class=\"lang-js\">data: [{\n    value:400,\n    name:&#39;搜索引擎&#39;,\n    itemStyle: {\n        color: &#39;#c23531&#39;\n    }\n}, ...]\n</code></pre>\n<p>但是这次因为只有明暗度的变化,所以有一种更快捷的方式是通过 <a href=\"#option.html#visualMap\">visualMap</a> 组件将数值的大小映射到明暗度。</p>\n<pre><code class=\"lang-js\">visualMap: {\n    // 不显示 visualMap 组件,只用于明暗度的映射\n    show: false,\n    // 映射的最小值为 80\n    min: 80,\n    // 映射的最大值为 600\n    max: 600,\n    inRange: {\n        // 明暗度的范围是 0 到 1\n        colorLightness: [0, 1]\n    }\n}\n</code></pre>\n<p>最终效果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-styling-step5&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n\n\n"},"ECharts 中的样式简介":{"type":["*"],"description":"<p>本文主要是大略概述,用哪些方法,可以在 Apache ECharts (incubating)<sup>TM</sup> 中设置样式,改变图形元素或者文字的颜色、明暗、大小等。</p>\n<blockquote>\n<p>之所以用“样式”这种可能不很符合数据可视化思维的词,是因为,比较通俗易懂。</p>\n</blockquote>\n<p>本文介绍这几种方式,他们的功能范畴可能会有交叉(即同一种细节的效果可能可以用不同的方式实现),但是他们各有各的场景偏好。</p>\n<ul>\n<li>颜色主题(Theme)</li>\n<li>调色盘</li>\n<li>直接样式设置(itemStyle、lineStyle、areaStyle、label、...)</li>\n<li>视觉映射(visualMap)</li>\n</ul>\n<p>其他关于样式的文章,参见:<a href=\"#%E4%B8%AA%E6%80%A7%E5%8C%96%E5%9B%BE%E8%A1%A8%E7%9A%84%E6%A0%B7%E5%BC%8F\">个性化图表的样式</a>,<a href=\"#%E6%95%B0%E6%8D%AE%E7%9A%84%E8%A7%86%E8%A7%89%E6%98%A0%E5%B0%84\">数据的视觉映射</a>。</p>\n<h2 id=\"-theme-\">颜色主题(Theme)</h2>\n<p>最简单的更改全局样式的方式,是直接采用颜色主题(theme)。例如,在 <a href=\"https://echarts.apache.org/examples/zh/index.html\" target=\"_blank\">示例集合</a> 中,可以选择 “Theme”,直接看到采用主题的效果。</p>\n<p>ECharts4 开始,除了一贯的默认主题外,新内置了两套主题,分别为 <code class=\"codespan\">&#39;light&#39;</code> 和 <code class=\"codespan\">&#39;dark&#39;</code>。可以这么来使用它们:</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;light&#39;);\n</code></pre>\n<p>或者</p>\n<pre><code class=\"lang-js\">var chart = echarts.init(dom, &#39;dark&#39;);\n</code></pre>\n<p>其他的主题,没有内置在 ECharts 中,需要自己加载。这些主题可以在 <a href=\"https://www.echartsjs.com/theme-builder/\" target=\"_blank\">主题编辑器</a> 里访问到。也可以使用这个主题编辑器,自己编辑主题。下载下来的主题可以这样使用:</p>\n<p>如果主题保存为 JSON 文件,那么可以自行加载和注册,例如:</p>\n<pre><code class=\"lang-js\">// 假设主题名称是 &quot;vintage&quot;\n$.getJSON(&#39;xxx/xxx/vintage.json&#39;, function (themeJSON) {\n    echarts.registerTheme(&#39;vintage&#39;, JSON.parse(themeJSON))\n    var chart = echarts.init(dom, &#39;vintage&#39;);\n});\n</code></pre>\n<p>如果保存为 UMD 格式的 JS 文件,那么支持了自注册,直接引入 JS 文件即可:</p>\n<pre><code class=\"lang-js\">// HTML 引入 vintage.js 文件后(假设主题名称是 &quot;vintage&quot;)\nvar chart = echarts.init(dom, &#39;vintage&#39;);\n// ...\n</code></pre>\n<h2 id=\"-\">调色盘</h2>\n<p>调色盘,可以在 option 中设置。它给定了一组颜色,图形、系列会自动从其中选择颜色。\n可以设置全局的调色盘,也可以设置系列自己专属的调色盘。</p>\n<pre><code class=\"lang-js\">option = {\n    // 全局调色盘。\n    color: [&#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\n    series: [{\n        type: &#39;bar&#39;,\n        // 此系列自己的调色盘。\n        color: [&#39;#dd6b66&#39;,&#39;#759aa0&#39;,&#39;#e69d87&#39;,&#39;#8dc1a9&#39;,&#39;#ea7e53&#39;,&#39;#eedd78&#39;,&#39;#73a373&#39;,&#39;#73b9bc&#39;,&#39;#7289ab&#39;, &#39;#91ca8c&#39;,&#39;#f49f42&#39;],\n        ...\n    }, {\n        type: &#39;pie&#39;,\n        // 此系列自己的调色盘。\n        color: [&#39;#37A2DA&#39;, &#39;#32C5E9&#39;, &#39;#67E0E3&#39;, &#39;#9FE6B8&#39;, &#39;#FFDB5C&#39;,&#39;#ff9f7f&#39;, &#39;#fb7293&#39;, &#39;#E062AE&#39;, &#39;#E690D1&#39;, &#39;#e7bcf3&#39;, &#39;#9d96f5&#39;, &#39;#8378EA&#39;, &#39;#96BFFF&#39;],\n        ...\n    }]\n}\n</code></pre>\n<h2 id=\"-itemstyle-linestyle-areastyle-label-\">直接的样式设置 itemStyle, lineStyle, areaStyle, label, ...</h2>\n<p>直接的样式设置是比较常用设置方式。纵观 ECharts 的 <a href=\"option.html\" target=\"_blank\">option</a> 中,很多地方可以设置 <a href=\"option.html#series.itemStyle\" target=\"_blank\">itemStyle</a>、<a href=\"option.html#series-line.lineStyle\" target=\"_blank\">lineStyle</a>、<a href=\"option.html#series-line.areaStyle\" target=\"_blank\">areaStyle</a>、<a href=\"option.html#series.label\" target=\"_blank\">label</a> 等等。这些的地方可以直接设置图形元素的颜色、线宽、点的大小、标签的文字、标签的样式等等。</p>\n<p>一般来说,ECharts 的各个系列和组件,都遵从这些命名习惯,虽然不同图表和组件中,<code class=\"codespan\">itemStyle</code>、<code class=\"codespan\">label</code> 等可能出现在不同的地方。</p>\n<p>直接样式设置的另一篇介绍,参见 <a href=\"#%E4%B8%AA%E6%80%A7%E5%8C%96%E5%9B%BE%E8%A1%A8%E7%9A%84%E6%A0%B7%E5%BC%8F\">个性化图表的样式</a>。</p>\n<h2 id=\"-emphasis\">高亮的样式:emphasis</h2>\n<p>在鼠标悬浮到图形元素上时,一般会出现高亮的样式。默认情况下,高亮的样式是根据普通样式自动生成的。但是高亮的样式也可以自己定义,主要是通过 <a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphasis</a> 属性来定制。<a href=\"option.html#series-scatter.emphasis\" target=\"_blank\">emphsis</a> 中的结构,和普通样式的结构相同,例如:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        // 普通样式。\n        itemStyle: {\n            // 点的颜色。\n            color: &#39;red&#39;\n        },\n        label: {\n            show: true,\n            // 标签的文字。\n            formatter: &#39;This is a normal label.&#39;\n        },\n\n        // 高亮样式。\n        emphasis: {\n            itemStyle: {\n                // 高亮时点的颜色。\n                color: &#39;blue&#39;\n            },\n            label: {\n                show: true,\n                // 高亮时标签的文字。\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>注意:在 ECharts4 以前,高亮和普通样式的写法,是这样的:</p>\n<pre><code class=\"lang-js\">option = {\n    series: {\n        type: &#39;scatter&#39;,\n\n        itemStyle: {\n            // 普通样式。\n            normal: {\n                // 点的颜色。\n                color: &#39;red&#39;\n            },\n            // 高亮样式。\n            emphasis: {\n                // 高亮时点的颜色。\n                color: &#39;blue&#39;\n            }\n        },\n\n        label: {\n            // 普通样式。\n            normal: {\n                show: true,\n                // 标签的文字。\n                formatter: &#39;This is a normal label.&#39;\n            },\n            // 高亮样式。\n            emphasis: {\n                show: true,\n                // 高亮时标签的文字。\n                formatter: &#39;This is a emphasis label.&#39;\n            }\n        }\n    }\n}\n</code></pre>\n<p>这种写法 <strong>仍然被兼容</strong>,但是,不再推荐。事实上,多数情况下,使用者只会配置普通状态下的样式,而使用默认的高亮样式。所以在 ECharts4 中,支持不写 <code class=\"codespan\">normal</code> 的配置方法(即本文开头的那种写法),使得配置项更扁平简单。</p>\n<h2 id=\"-visualmap-\">通过 visualMap 组件设定样式</h2>\n<p><a href=\"option.html#visualMap\" target=\"_blank\">visualMap 组件</a> 能指定数据到颜色、图形尺寸的映射规则,详见 <a href=\"#%E6%95%B0%E6%8D%AE%E7%9A%84%E8%A7%86%E8%A7%89%E6%98%A0%E5%B0%84\">数据的视觉映射</a>。</p>\n"},"异步数据加载和更新":{"type":["*"],"description":"<h2 id=\"-\">异步加载</h2>\n<p><a href=\"#getting-started\">入门示例</a>中的数据是在初始化后 <code class=\"codespan\">setOption</code> 中直接填入的,但是很多时候可能数据需要异步加载后再填入。Apache ECharts (incubating)<sup>TM</sup> 中实现异步数据的更新非常简单,在图表初始化后不管任何时候只要通过 jQuery 等工具异步获取数据后通过 <code class=\"codespan\">setOption</code> 填入数据和配置项就行。</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.setOption({\n        title: {\n            text: &#39;异步数据加载示例&#39;\n        },\n        tooltip: {},\n        legend: {\n            data:[&#39;销量&#39;]\n        },\n        xAxis: {\n            data: [&quot;衬衫&quot;,&quot;羊毛衫&quot;,&quot;雪纺衫&quot;,&quot;裤子&quot;,&quot;高跟鞋&quot;,&quot;袜子&quot;]\n        },\n        yAxis: {},\n        series: [{\n            name: &#39;销量&#39;,\n            type: &#39;bar&#39;,\n            data: [5, 20, 36, 10, 10, 20]\n        }]\n    });\n});\n</code></pre>\n<p>或者先设置完其它的样式,显示一个空的直角坐标轴,然后获取数据后填入数据。</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n// 显示标题,图例和空的坐标轴\nmyChart.setOption({\n    title: {\n        text: &#39;异步数据加载示例&#39;\n    },\n    tooltip: {},\n    legend: {\n        data:[&#39;销量&#39;]\n    },\n    xAxis: {\n        data: []\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: []\n    }]\n});\n\n// 异步加载数据\n$.get(&#39;data.json&#39;).done(function (data) {\n    // 填入数据\n    myChart.setOption({\n        xAxis: {\n            data: data.categories\n        },\n        series: [{\n            // 根据名字对应到相应的系列\n            name: &#39;销量&#39;,\n            data: data.data\n        }]\n    });\n});\n</code></pre>\n<p>如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-async&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<p>ECharts 中在更新数据的时候需要通过<code class=\"codespan\">name</code>属性对应到相应的系列,上面示例中如果<code class=\"codespan\">name</code>不存在也可以根据系列的顺序正常更新,但是更多时候推荐更新数据的时候加上系列的<code class=\"codespan\">name</code>数据。</p>\n<h2 id=\"loading-\">loading 动画</h2>\n<p>如果数据加载时间较长,一个空的坐标轴放在画布上也会让用户觉得是不是产生 bug 了,因此需要一个 loading 的动画来提示用户数据正在加载。</p>\n<p>ECharts 默认有提供了一个简单的加载动画。只需要调用 <a href=\"api.html#echartsInstance.showLoading\" target=\"_blank\">showLoading</a> 方法显示。数据加载完成后再调用 <a href=\"api.html#echartsInstance.hideLoading\" target=\"_blank\">hideLoading</a> 方法隐藏加载动画。</p>\n<pre><code class=\"lang-js\">myChart.showLoading();\n$.get(&#39;data.json&#39;).done(function (data) {\n    myChart.hideLoading();\n    myChart.setOption(...);\n});\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-loading&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n<h2 id=\"-\">数据的动态更新</h2>\n<p>ECharts 由数据驱动,数据的改变驱动图表展现的改变,因此动态数据的实现也变得异常简单。</p>\n<p>所有数据的更新都通过 <a href=\"#api.html#echartsInstance.setOption\">setOption</a>实现,你只需要定时获取数据,<a href=\"#api.html#echartsInstance.setOption\">setOption</a> 填入数据,而不用考虑数据到底产生了那些变化,ECharts 会找到两组数据之间的差异然后通过合适的动画去表现数据的变化。</p>\n<blockquote>\n<p>ECharts 3 中移除了 ECharts 2 中的 addData 方法。如果只需要加入单个数据,可以先 data.push(value) 后 setOption</p>\n</blockquote>\n<p>具体可以看下面示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/tutorial-dynamic-data&edit=1&reset=1\" width=\"400\" height=\"300\" ></iframe>\n\n\n\n"},"使用 dataset 管理数据":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 4 开始支持了 <code class=\"codespan\">dataset</code> 组件用于单独的数据集声明,从而数据可以单独管理,被多个组件复用,并且可以基于数据指定数据到视觉的映射。这在不少场景下能带来使用上的方便。</p>\n<p>ECharts 4 以前,数据只能声明在各个“系列(series)”中,例如:</p>\n<pre><code class=\"lang-js\">option = {\n    xAxis: {\n        type: &#39;category&#39;,\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2015&#39;,\n            data: [89.3, 92.1, 94.4, 85.4]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2016&#39;,\n            data: [95.8, 89.4, 91.2, 76.9]\n        },\n        {\n            type: &#39;bar&#39;,\n            name: &#39;2017&#39;,\n            data: [97.7, 83.1, 92.5, 78.1]\n        }\n    ]\n}\n</code></pre>\n<p>这种方式的优点是,直观易理解,以及适于对一些特殊图表类型进行一定的数据类型定制。但是缺点是,为匹配这种数据输入形式,常需要有数据处理的过程,把数据分割设置到各个系列(和类目轴)中。此外,不利于多个系列共享一份数据,也不利于基于原始数据进行图表类型、系列的映射安排。</p>\n<p>于是,ECharts 4 提供了 <code class=\"codespan\">数据集</code>(<code class=\"codespan\">dataset</code>)组件来单独声明数据,它带来了这些效果:</p>\n<ul>\n<li>能够贴近这样的数据可视化常见思维方式:(I) 提供数据,(II) 指定数据到视觉的映射,从而形成图表。</li>\n<li>数据和其他配置可以被分离开来。数据常变,其他配置常不变。分开易于分别管理。</li>\n<li>数据可以被多个系列或者组件复用,对于大数据量的场景,不必为每个系列创建一份数据。</li>\n<li>支持更多的数据的常用格式,例如二维数组、对象数组等,一定程度上避免使用者为了数据格式而进行转换。</li>\n</ul>\n<h2 id=\"-\">入门例子</h2>\n<p>下面是一个最简单的 <code class=\"codespan\">dataset</code> 的例子:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // 提供一份数据。\n        source: [\n            [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n            [&#39;Matcha Latte&#39;, 43.3, 85.8, 93.7],\n            [&#39;Milk Tea&#39;, 83.1, 73.4, 55.1],\n            [&#39;Cheese Cocoa&#39;, 86.4, 65.2, 82.5],\n            [&#39;Walnut Brownie&#39;, 72.4, 53.9, 39.1]\n        ]\n    },\n    // 声明一个 X 轴,类目轴(category)。默认情况下,类目轴对应到 dataset 第一列。\n    xAxis: {type: &#39;category&#39;},\n    // 声明一个 Y 轴,数值轴。\n    yAxis: {},\n    // 声明多个 bar 系列,默认情况下,每个系列会自动对应到 dataset 的每一列。\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n}\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n<p>或者也可以使用常见的对象数组的格式:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        // 用 dimensions 指定了维度的顺序。直角坐标系中,\n        // 默认把第一个维度映射到 X 轴上,第二个维度映射到 Y 轴上。\n        // 如果不指定 dimensions,也可以通过指定 series.encode\n        // 完成映射,参见后文。\n        dimensions: [&#39;product&#39;, &#39;2015&#39;, &#39;2016&#39;, &#39;2017&#39;],\n        source: [\n            {product: &#39;Matcha Latte&#39;, &#39;2015&#39;: 43.3, &#39;2016&#39;: 85.8, &#39;2017&#39;: 93.7},\n            {product: &#39;Milk Tea&#39;, &#39;2015&#39;: 83.1, &#39;2016&#39;: 73.4, &#39;2017&#39;: 55.1},\n            {product: &#39;Cheese Cocoa&#39;, &#39;2015&#39;: 86.4, &#39;2016&#39;: 65.2, &#39;2017&#39;: 82.5},\n            {product: &#39;Walnut Brownie&#39;, &#39;2015&#39;: 72.4, &#39;2016&#39;: 53.9, &#39;2017&#39;: 39.1}\n        ]\n    },\n    xAxis: {type: &#39;category&#39;},\n    yAxis: {},\n    series: [\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;},\n        {type: &#39;bar&#39;}\n    ]\n};\n</code></pre>\n<h2 id=\"-\">数据到图形的映射</h2>\n<p>本篇里,我们制作数据可视化图表的逻辑是这样的:基于数据,在配置项中指定如何映射到图形。</p>\n<p>概略而言,可以进行这些映射:</p>\n<ul>\n<li>指定 dataset 的列(column)还是行(row)映射为图形系列(series)。这件事可以使用 <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">series.seriesLayoutBy</a> 属性来配置。默认是按照列(column)来映射。</li>\n<li>指定维度映射的规则:如何从 dataset 的维度(一个“维度”的意思是一行/列)映射到坐标轴(如 X、Y 轴)、提示框(tooltip)、标签(label)、图形元素大小颜色等(visualMap)。这件事可以使用 <a href=\"option.html#series.encode\" target=\"_blank\">series.encode</a> 属性,以及 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件(如果有需要映射颜色大小等视觉维度的话)来配置。上面的例子中,没有给出这种映射配置,那么 ECharts 就按最常见的理解进行默认映射:X 坐标轴声明为类目轴,默认情况下会自动对应到 dataset.source 中的第一列;三个柱图系列,一一对应到 dataset.source 中后面每一列。</li>\n</ul>\n<p>下面详细解释。</p>\n<h2 id=\"-dataset-series-\">把数据集( dataset )的行或列映射为系列(series)</h2>\n<p>有了数据表之后,使用者可以灵活得配置:数据如何对应到轴和图形系列。</p>\n<p>用户可以使用 <code class=\"codespan\">seriesLayoutBy</code> 配置项,改变图表对于行列的理解。<code class=\"codespan\">seriesLayoutBy</code> 可取值:</p>\n<ul>\n<li>&#39;column&#39;: 默认值。系列被安放到 <code class=\"codespan\">dataset</code> 的列上面。</li>\n<li>&#39;row&#39;: 系列被安放到 <code class=\"codespan\">dataset</code> 的行上面。</li>\n</ul>\n<p>看这个例子:</p>\n<pre><code class=\"lang-js\">option = {\n    legend: {},\n    tooltip: {},\n    dataset: {\n        source: [\n            [&#39;product&#39;, &#39;2012&#39;, &#39;2013&#39;, &#39;2014&#39;, &#39;2015&#39;],\n            [&#39;Matcha Latte&#39;, 41.1, 30.4, 65.1, 53.3],\n            [&#39;Milk Tea&#39;, 86.5, 92.1, 85.7, 83.1],\n            [&#39;Cheese Cocoa&#39;, 24.1, 67.2, 79.5, 86.4]\n        ]\n    },\n    xAxis: [\n        {type: &#39;category&#39;, gridIndex: 0},\n        {type: &#39;category&#39;, gridIndex: 1}\n    ],\n    yAxis: [\n        {gridIndex: 0},\n        {gridIndex: 1}\n    ],\n    grid: [\n        {bottom: &#39;55%&#39;},\n        {top: &#39;55%&#39;}\n    ],\n    series: [\n        // 这几个系列会在第一个直角坐标系中,每个系列对应到 dataset 的每一行。\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        {type: &#39;bar&#39;, seriesLayoutBy: &#39;row&#39;},\n        // 这几个系列会在第二个直角坐标系中,每个系列对应到 dataset 的每一列。\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1},\n        {type: &#39;bar&#39;, xAxisIndex: 1, yAxisIndex: 1}\n    ]\n}\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-series-layout-by&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n<h2 id=\"-dimension-\">维度(dimension)</h2>\n<p>介绍 <code class=\"codespan\">encode</code> 之前,首先要介绍“维度(dimension)”的概念。</p>\n<p>常用图表所描述的数据大部分是“二维表”结构,上述的例子中,我们都使用二维数组来容纳二维表。现在,当我们把系列(series)对应到“列”的时候,那么每一列就称为一个“维度(dimension)”,而每一行称为数据项(item)。反之,如果我们把系列(series)对应到表行,那么每一行就是“维度(dimension)”,每一列就是数据项(item)。</p>\n<p>维度可以有单独的名字,便于在图表中显示。维度名(dimension name)可以在定义在 dataset 的第一行(或者第一列)。例如上面的例子中,<code class=\"codespan\">&#39;score&#39;</code>、<code class=\"codespan\">&#39;amount&#39;</code>、<code class=\"codespan\">&#39;product&#39;</code> 就是维度名。从第二行开始,才是正式的数据。<code class=\"codespan\">dataset.source</code> 中第一行(列)到底包含不包含维度名,ECharts 默认会自动探测。当然也可以设置 <code class=\"codespan\">dataset.sourceHeader: true</code> 显示声明第一行(列)就是维度,或者 <code class=\"codespan\">dataset.sourceHeader: false</code> 表明第一行(列)开始就直接是数据。</p>\n<p>维度的定义,也可以使用单独的 <code class=\"codespan\">dataset.dimensions</code> 或者 <code class=\"codespan\">series.dimensions</code> 来定义,这样可以同时指定维度名,和维度的类型(dimension type):</p>\n<pre><code class=\"lang-js\">var option1 = {\n    dataset: {\n        dimensions: [\n            {name: &#39;score&#39;},\n            // 可以简写为 string,表示维度名。\n            &#39;amount&#39;,\n            // 可以在 type 中指定维度类型。\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ],\n        source: [...]\n    },\n    ...\n};\n\nvar option2 = {\n    dataset: {\n        source: [...]\n    },\n    series: {\n        type: &#39;line&#39;,\n        // 在系列中设置的 dimensions 会更优先采纳。\n        dimensions: [\n            null, // 可以设置为 null 表示不想设置维度名\n            &#39;amount&#39;,\n            {name: &#39;product&#39;, type: &#39;ordinal&#39;}\n        ]\n    },\n    ...\n};\n</code></pre>\n<p>大多数情况下,我们并不需要去设置维度类型,因为会自动判断。但是如果因为数据为空之类原因导致判断不足够准确时,可以手动设置维度类型。</p>\n<p>维度类型(dimension type)可以取这些值:</p>\n<ul>\n<li><code class=\"codespan\">&#39;number&#39;</code>: 默认,表示普通数据。</li>\n<li><code class=\"codespan\">&#39;ordinal&#39;</code>: 对于类目、文本这些 string 类型的数据,如果需要能在数轴上使用,须是 &#39;ordinal&#39; 类型。ECharts 默认会自动判断这个类型。但是自动判断也是不可能很完备的,所以使用者也可以手动强制指定。</li>\n<li><code class=\"codespan\">&#39;time&#39;</code>: 表示时间数据。设置成 <code class=\"codespan\">&#39;time&#39;</code> 则能支持自动解析数据成时间戳(timestamp),比如该维度的数据是 &#39;2017-05-10&#39;,会自动被解析。如果这个维度被用在时间数轴(<a href=\"option.html#xAxis.type\" target=\"_blank\">axis.type</a> 为 <code class=\"codespan\">&#39;time&#39;</code>)上,那么会被自动设置为 <code class=\"codespan\">&#39;time&#39;</code> 类型。时间类型的支持参见 <a href=\"option.html#series.data\" target=\"_blank\">data</a>。</li>\n<li><code class=\"codespan\">&#39;float&#39;</code>: 如果设置成 <code class=\"codespan\">&#39;float&#39;</code>,在存储时候会使用 <code class=\"codespan\">TypedArray</code>,对性能优化有好处。</li>\n<li><code class=\"codespan\">&#39;int&#39;</code>: 如果设置成 <code class=\"codespan\">&#39;int&#39;</code>,在存储时候会使用 <code class=\"codespan\">TypedArray</code>,对性能优化有好处。</li>\n</ul>\n<h2 id=\"-series-encode-\">数据到图形的映射( series.encode )</h2>\n<p>了解了维度的概念后,我们就可以使用 <a href=\"option.html#series.encode\" target=\"_blank\">encode</a> 来做映射。总体是这样的感觉:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [&#39;score&#39;, &#39;amount&#39;, &#39;product&#39;],\n            [89.3, 58212, &#39;Matcha Latte&#39;],\n            [57.1, 78254, &#39;Milk Tea&#39;],\n            [74.4, 41032, &#39;Cheese Cocoa&#39;],\n            [50.1, 12755, &#39;Cheese Brownie&#39;],\n            [89.7, 20145, &#39;Matcha Cocoa&#39;],\n            [68.1, 79146, &#39;Tea&#39;],\n            [19.6, 91852, &#39;Orange Juice&#39;],\n            [10.6, 101852, &#39;Lemon Juice&#39;],\n            [32.7, 20112, &#39;Walnut Brownie&#39;]\n        ]\n    },\n    xAxis: {},\n    yAxis: {type: &#39;category&#39;},\n    series: [\n        {\n            type: &#39;bar&#39;,\n            encode: {\n                // 将 &quot;amount&quot; 列映射到 X 轴。\n                x: &#39;amount&#39;,\n                // 将 &quot;product&quot; 列映射到 Y 轴。\n                y: &#39;product&#39;\n            }\n        }\n    ]\n};\n</code></pre>\n<p>效果如下:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/dataset-encode-simple0&edit=1&reset=1\" width=\"500\" height=\"300\" ></iframe>\n\n\n\n<p><code class=\"codespan\">series.encode</code> 声明的基本结构如下,其中冒号左边是坐标系、标签等特定名称,如 <code class=\"codespan\">&#39;x&#39;</code>, <code class=\"codespan\">&#39;y&#39;</code>, <code class=\"codespan\">&#39;tooltip&#39;</code> 等,冒号右边是数据中的维度名(string 格式)或者维度的序号(number 格式,从 0 开始计数),可以指定一个或多个维度(使用数组)。通常情况下,下面各种信息不需要所有的都写,按需写即可。</p>\n<p>下面是 <code class=\"codespan\">series.encode</code> 支持的属性:</p>\n<pre><code class=\"lang-js\">// 在任何坐标系和系列中,都支持:\nencode: {\n    // 使用 “名为 product 的维度” 和 “名为 score 的维度” 的值在 tooltip 中显示\n    tooltip: [&#39;product&#39;, &#39;score&#39;]\n    // 使用 “维度 1” 和 “维度 3” 的维度名连起来作为系列名。(有时候名字比较长,这可以避免在 series.name 重复输入这些名字)\n    seriesName: [1, 3],\n    // 表示使用 “维度2” 中的值作为 id。这在使用 setOption 动态更新数据时有用处,可以使新老数据用 id 对应起来,从而能够产生合适的数据更新动画。\n    itemId: 2,\n    // 指定数据项的名称使用 “维度3” 在饼图等图表中有用,可以使这个名字显示在图例(legend)中。\n    itemName: 3\n}\n\n// 直角坐标系(grid/cartesian)特有的属性:\nencode: {\n    // 把 “维度1”、“维度5”、“名为 score 的维度” 映射到 X 轴:\n    x: [1, 5, &#39;score&#39;],\n    // 把“维度0”映射到 Y 轴。\n    y: 0\n}\n\n// 单轴(singleAxis)特有的属性:\nencode: {\n    single: 3\n}\n\n// 极坐标系(polar)特有的属性:\nencode: {\n    radius: 3,\n    angle: 2\n}\n\n// 地理坐标系(geo)特有的属性:\nencode: {\n    lng: 3,\n    lat: 2\n}\n\n// 对于一些没有坐标系的图表,例如饼图、漏斗图等,可以是:\nencode: {\n    value: 3\n}\n</code></pre>\n<p>下面给出个更丰富的 <code class=\"codespan\">series.encode</code> 的示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode1&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n\n<h2 id=\"-\">视觉通道(颜色、尺寸等)的映射</h2>\n<p>我们可以使用 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件进行视觉通道的映射。详见 <code class=\"codespan\">visualMap</code> 文档的介绍。这是一个示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-encode0&edit=1&reset=1\" width=\"500\" height=\"400\" ></iframe>\n\n\n\n<h2 id=\"-encode\">默认的 encode</h2>\n<p>值得一提的是,当 <code class=\"codespan\">series.encode</code> 并没有指定时,ECharts 针对最常见直角坐标系中的图表(折线图、柱状图、散点图、K线图等)、饼图、漏斗图,会采用一些默认的映射规则。默认的映射规则比较简单,大体是:</p>\n<ul>\n<li>在坐标系中(如直角坐标系、极坐标系等)<ul>\n<li>如果有类目轴(axis.type 为 &#39;category&#39;),则将第一列(行)映射到这个轴上,后续每一列(行)对应一个系列。</li>\n<li>如果没有类目轴,假如坐标系有两个轴(例如直角坐标系的 X Y 轴),则每两列对应一个系列,这两列分别映射到这两个轴上。</li>\n</ul>\n</li>\n<li>如果没有坐标系(如饼图)<ul>\n<li>取第一列(行)为名字,第二列(行)为数值(如果只有一列,则取第一列为数值)。</li>\n</ul>\n</li>\n</ul>\n<p>默认的规则不能满足要求时,就可以自己来配置 <code class=\"codespan\">encode</code>,也并不复杂。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-default&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n\n<h2 id=\"-series-encode-\">几个常见的 series.encode 设置方式举例</h2>\n<p>问:如何把第三列设置为 X 轴,第五列设置为 Y 轴?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">series: {\n    // 注意维度序号(dimensionIndex)从 0 开始计数,第三列是 dimensions[2]。\n    encode: {x: 2, y: 4},\n    ...\n}\n</code></pre>\n<p>问:如何把第三行设置为 X 轴,第五行设置为 Y 轴?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {x: 2, y: 4},\n    seriesLayoutBy: &#39;row&#39;,\n    ...\n}\n</code></pre>\n<p>问:如何把第二列设置为标签?</p>\n<p>答:\n关于标签的显示 <a href=\"option.html#series.label.formatter\" target=\"_blank\">label.formatter</a>,现在支持引用特定维度的值,例如:</p>\n<pre><code class=\"lang-js\">series: {\n    label: {\n        // `&#39;{@score}&#39;` 表示 “名为 score” 的维度里的值。\n        // `&#39;{@[4]}&#39;` 表示引用序号为 4 的维度里的值。\n        formatter: &#39;aaa{@product}bbb{@score}ccc{@[4]}ddd&#39;\n    }\n}\n</code></pre>\n<p>问:如何让第 2 列和第 3 列显示在提示框(tooltip)中?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">series: {\n    encode: {\n        tooltip: [1, 2]\n        ...\n    },\n    ...\n}\n</code></pre>\n<p>问:数据里没有维度名,那么怎么给出维度名?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">dataset: {\n    dimensions: [&#39;score&#39;, &#39;amount&#39;],\n    source: [\n        [89.3, 3371],\n        [92.1, 8123],\n        [94.4, 1954],\n        [85.4, 829]\n    ]\n}\n</code></pre>\n<p>问:如何把第三列映射为气泡图的点的大小?</p>\n<p>答:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: {\n        source: [\n            [12, 323, 11.2],\n            [23, 167, 8.3],\n            [81, 284, 12],\n            [91, 413, 4.1],\n            [13, 287, 13.5]\n        ]\n    },\n    visualMap: {\n        show: false,\n        dimension: 2, // 指向第三列(列序号从 0 开始记,所以设置为 2)。\n        min: 2, // 需要给出数值范围,最小数值。\n        max: 15, // 需要给出数值范围,最大数值。\n        inRange: {\n            // 气泡尺寸:5 像素到 60 像素。\n            symbolSize: [5, 60]\n        }\n    },\n    xAxis: {},\n    yAxis: {},\n    series: {\n        type: &#39;scatter&#39;\n    }\n};\n</code></pre>\n<p>问:encode 里指定了映射,但是不管用?</p>\n<p>答:可以查查有没有拼错,比如,维度名是:<code class=\"codespan\">&#39;Life Expectancy&#39;</code>,encode 中拼成了 <code class=\"codespan\">&#39;Life Expectency&#39;</code>。</p>\n<h2 id=\"-\">数据的各种格式</h2>\n<p>多数常见图表中,数据适于用二维表的形式描述。广为使用的数据表格软件(如 MS Excel、Numbers)或者关系数据数据库都是二维表。他们的数据可以导出成 JSON 格式,输入到 <code class=\"codespan\">dataset.source</code> 中,在不少情况下可以免去一些数据处理的步骤。</p>\n<blockquote>\n<p>假如数据导出成 csv 文件,那么可以使用一些 csv 工具如 <a href=\"https://github.com/d3/d3-dsv\" target=\"_blank\">dsv</a> 或者 <a href=\"https://github.com/mholt/PapaParse\" target=\"_blank\">PapaParse</a> 将 csv 转成 JSON。</p>\n</blockquote>\n<p>在 JavaScript 常用的数据传输格式中,二维数组可以比较直观的存储二维表。前面的示例都是使用二维数组表示。</p>\n<p>除了二维数组以外,dataset 也支持例如下面 key-value 方式的数据格式,这类格式也非常常见。但是这类格式中,目前并不支持 <a href=\"option.html#series.seriesLayoutBy\" target=\"_blank\">seriesLayoutBy</a> 参数。</p>\n<pre><code class=\"lang-js\">dataset: [{\n    // 按行的 key-value 形式(对象数组),这是个比较常见的格式。\n    source: [\n        {product: &#39;Matcha Latte&#39;, count: 823, score: 95.8},\n        {product: &#39;Milk Tea&#39;, count: 235, score: 81.4},\n        {product: &#39;Cheese Cocoa&#39;, count: 1042, score: 91.2},\n        {product: &#39;Walnut Brownie&#39;, count: 988, score: 76.9}\n    ]\n}, {\n    // 按列的 key-value 形式。\n    source: {\n        &#39;product&#39;: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;],\n        &#39;count&#39;: [823, 235, 1042, 988],\n        &#39;score&#39;: [95.8, 81.4, 91.2, 76.9]\n    }\n}]\n</code></pre>\n<h2 id=\"-dataset-\">多个 dataset 以及如何引用他们</h2>\n<p>可以同时定义多个 dataset。系列可以通过 <a href=\"option.html#series.datasetIndex\" target=\"_blank\">series.datasetIndex</a> 来指定引用哪个 dataset。例如:</p>\n<pre><code class=\"lang-js\">var option = {\n    dataset: [{\n        // 序号为 0 的 dataset。\n        source: [...],\n    }, {\n        // 序号为 1 的 dataset。\n        source: [...]\n    }, {\n        // 序号为 2 的 dataset。\n        source: [...]\n    }],\n    series: [{\n        // 使用序号为 2 的 dataset。\n        datasetIndex: 2\n    }, {\n        // 使用序号为 1 的 dataset。\n        datasetIndex: 1\n    }]\n}\n</code></pre>\n<h2 id=\"echarts-3-series-data-\">ECharts 3 的数据设置方式(series.data)仍正常使用</h2>\n<p>ECharts 4 之前一直以来的数据声明方式仍然被正常支持,如果系列已经声明了 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a>, 那么就会使用 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 而非 <code class=\"codespan\">dataset</code>。</p>\n<pre><code class=\"lang-js\">{\n    xAxis: {\n        type: &#39;category&#39;\n        data: [&#39;Matcha Latte&#39;, &#39;Milk Tea&#39;, &#39;Cheese Cocoa&#39;, &#39;Walnut Brownie&#39;]\n    },\n    yAxis: {},\n    series: [{\n        type: &#39;bar&#39;,\n        name: &#39;2015&#39;,\n        data: [89.3, 92.1, 94.4, 85.4]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2016&#39;,\n        data: [95.8, 89.4, 91.2, 76.9]\n    }, {\n        type: &#39;bar&#39;,\n        name: &#39;2017&#39;,\n        data: [97.7, 83.1, 92.5, 78.1]\n    }]\n}\n</code></pre>\n<p>其实,<a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 也是种会一直存在的重要设置方式。一些特殊的非 table 格式的图表,如 <a href=\"option.html#series-treemap\" target=\"_blank\">treemap</a>、<a href=\"option.html#series-graph\" target=\"_blank\">graph</a>、<a href=\"option.html#series-lines\" target=\"_blank\">lines</a> 等,现在仍不支持在 dataset 中设置,仍然需要使用 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a>。另外,对于巨大数据量的渲染(如百万以上的数据量),需要使用 <a href=\"api.html#echartsInstance.appendData\" target=\"_blank\">appendData</a> 进行增量加载,这种情况不支持使用 <code class=\"codespan\">dataset</code>。</p>\n<h2 id=\"-\">其他</h2>\n<p>目前并非所有图表都支持 dataset。支持 dataset 的图表有:\n<code class=\"codespan\">line</code>、<code class=\"codespan\">bar</code>、<code class=\"codespan\">pie</code>、<code class=\"codespan\">scatter</code>、<code class=\"codespan\">effectScatter</code>、<code class=\"codespan\">parallel</code>、<code class=\"codespan\">candlestick</code>、<code class=\"codespan\">map</code>、<code class=\"codespan\">funnel</code>、<code class=\"codespan\">custom</code>。\n后续会有更多的图表进行支持。</p>\n<p>最后,给出一个示例,多个图表共享一个 <code class=\"codespan\">dataset</code>,并带有联动交互:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=dataset-link&edit=1&reset=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n\n\n"},"在图表中加入交互组件":{"type":["*"],"description":"<p>除了图表外 Apache ECharts (incubating)<sup>TM</sup> 中,提供了很多交互组件。例如:</p>\n<p><code class=\"codespan\">图例组件</code> <a href=\"option.html#legend\" target=\"_blank\">legend</a>、<code class=\"codespan\">标题组件</code> <a href=\"option.html#title\" target=\"_blank\">title</a>、<code class=\"codespan\">视觉映射组件</code> <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a>、<code class=\"codespan\">数据区域缩放组件</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>、<code class=\"codespan\">时间线组件</code> <a href=\"option.html#timeline\" target=\"_blank\">timeline</a></p>\n<p>下面以 <code class=\"codespan\">数据区域缩放组件</code> <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> 为例,介绍如何加入这种组件。</p>\n<h2 id=\"-datazoom-\">数据区域缩放组件(dataZoom)介绍</h2>\n<p>『概览数据整体,按需关注数据细节』是数据可视化的基本交互需求。<code class=\"codespan\">dataZoom</code> 组件能够在直角坐标系(<a href=\"option.html#grid\" target=\"_blank\">grid</a>)、极坐标系(<a href=\"option.html#polar\" target=\"_blank\">polar</a>)中实现这一功能。</p>\n<p><strong>如下例子:</strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-dataZoom-all&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<ul>\n<li><code class=\"codespan\">dataZoom</code> 组件是对 <code class=\"codespan\">数轴(axis)</code> 进行『数据窗口缩放』『数据窗口平移』操作。</li>\n</ul>\n<blockquote>\n<p>可以通过 <a href=\"option.html#dataZoom.xAxisIndex\" target=\"_blank\">dataZoom.xAxisIndex</a> 或 <a href=\"option.html#dataZoom.yAxisIndex\" target=\"_blank\">dataZoom.yAxisIndex</a> 来指定 <code class=\"codespan\">dataZoom</code> 控制哪个或哪些数轴。</p>\n</blockquote>\n<ul>\n<li><p><code class=\"codespan\">dataZoom</code> 组件可同时存在多个,起到共同控制的作用。控制同一个数轴的组件,会自动联动。下面例子中会详细说明。</p>\n</li>\n<li><p><code class=\"codespan\">dataZoom</code> 的运行原理是通过『数据过滤』来达到『数据窗口缩放』的效果。</p>\n<p>  数据过滤模式的设置不同,效果也不同,参见:<a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a>。</p>\n</li>\n<li><p><code class=\"codespan\">dataZoom</code> 的数据窗口范围的设置,目前支持两种形式:</p>\n<ul>\n<li><p>百分比形式:参见 <a href=\"option.html#dataZoom.start\" target=\"_blank\">dataZoom.start</a> 和 <a href=\"option.html#dataZoom.end\" target=\"_blank\">dataZoom.end</a>。</p>\n</li>\n<li><p>绝对数值形式:参见 <a href=\"option.html#dataZoom.startValue\" target=\"_blank\">dataZoom.startValue</a> 和 <a href=\"option.html#dataZoom.endValue\" target=\"_blank\">dataZoom.endValue</a>。</p>\n</li>\n</ul>\n</li>\n</ul>\n<p><strong>dataZoom 组件现在支持几种子组件:</strong></p>\n<ul>\n<li><p><a href=\"option.html#dataZoom-inside\" target=\"_blank\">内置型数据区域缩放组件(dataZoomInside)</a>:内置于坐标系中。</p>\n</li>\n<li><p><a href=\"option.html#dataZoom-slider\" target=\"_blank\">滑动条型数据区域缩放组件(dataZoomSlider)</a>:有单独的滑动条操作。</p>\n</li>\n<li><p><a href=\"option.html#toolbox.feature.dataZoom\" target=\"_blank\">框选型数据区域缩放组件(dataZoomSelect)</a>:全屏的选框进行数据区域缩放。入口和配置项均在 <code class=\"codespan\">toolbox</code>中。</p>\n</li>\n</ul>\n<h2 id=\"-datazoom-\">在代码加入 dataZoom 组件</h2>\n<p>先只在对单独一个横轴,加上 dataZoom 组件,代码示例如下:</p>\n<pre><code class=\"lang-javascript\">\noption = {\n    xAxis: {\n        type: &#39;value&#39;\n    },\n    yAxis: {\n        type: &#39;value&#39;\n    },\n    dataZoom: [\n        {   // 这个dataZoom组件,默认控制x轴。\n            type: &#39;slider&#39;, // 这个 dataZoom 组件是 slider 型 dataZoom 组件\n            start: 10,      // 左边在 10% 的位置。\n            end: 60         // 右边在 60% 的位置。\n        }\n    ],\n    series: [\n        {\n            type: &#39;scatter&#39;, // 这是个『散点图』\n            itemStyle: {\n                opacity: 0.8\n            },\n            symbolSize: function (val) {\n                return val[2] * 40;\n            },\n            data: [[&quot;14.616&quot;,&quot;7.241&quot;,&quot;0.896&quot;],[&quot;3.958&quot;,&quot;5.701&quot;,&quot;0.955&quot;],[&quot;2.768&quot;,&quot;8.971&quot;,&quot;0.669&quot;],[&quot;9.051&quot;,&quot;9.710&quot;,&quot;0.171&quot;],[&quot;14.046&quot;,&quot;4.182&quot;,&quot;0.536&quot;],[&quot;12.295&quot;,&quot;1.429&quot;,&quot;0.962&quot;],[&quot;4.417&quot;,&quot;8.167&quot;,&quot;0.113&quot;],[&quot;0.492&quot;,&quot;4.771&quot;,&quot;0.785&quot;],[&quot;7.632&quot;,&quot;2.605&quot;,&quot;0.645&quot;],[&quot;14.242&quot;,&quot;5.042&quot;,&quot;0.368&quot;]]\n        }\n    ]\n}\n</code></pre>\n<p>可以看到如下结果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-1&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n<p><br></p>\n<p>上面的图只能拖动 dataZoom 组件导致窗口变化。如果想在坐标系内进行拖动,以及用滚轮(或移动触屏上的两指滑动)进行缩放,那么要再加上一个 inside 型的 dataZoom组件。直接在上面的 <code class=\"codespan\">option.dataZoom</code> 中增加即可:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {   // 这个dataZoom组件,默认控制x轴。\n            type: &#39;slider&#39;, // 这个 dataZoom 组件是 slider 型 dataZoom 组件\n            start: 10,      // 左边在 10% 的位置。\n            end: 60         // 右边在 60% 的位置。\n        },\n        {   // 这个dataZoom组件,也控制x轴。\n            type: &#39;inside&#39;, // 这个 dataZoom 组件是 inside 型 dataZoom 组件\n            start: 10,      // 左边在 10% 的位置。\n            end: 60         // 右边在 60% 的位置。\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>可以看到如下结果(能在坐标系中进行滑动,以及使用滚轮缩放了):</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-2&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n<p><br></p>\n<p>如果想 y 轴也能够缩放,那么在 y 轴上也加上 dataZoom 组件:</p>\n<pre><code class=\"lang-javascript\">option = {\n    ...,\n    dataZoom: [\n        {\n            type: &#39;slider&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;inside&#39;,\n            xAxisIndex: 0,\n            start: 10,\n            end: 60\n        },\n        {\n            type: &#39;slider&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        },\n        {\n            type: &#39;inside&#39;,\n            yAxisIndex: 0,\n            start: 30,\n            end: 80\n        }\n    ],\n    ...\n}\n</code></pre>\n<p>可以看到如下结果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-tutorial-dataZoom-3&edit=1&reset=1\" width=\"600\" height=\"300\" ></iframe>\n\n\n\n\n\n\n\n"},"移动端自适应":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 工作在用户指定高宽的 DOM 节点(容器)中。ECharts 的『组件』和『系列』都在这个 DOM 节点中,每个节点都可以由用户指定位置。图表库内部并不适宜实现 DOM 文档流布局,因此采用类似绝对布局的简单容易理解的布局方式。但是有时候容器尺寸极端时,这种方式并不能自动避免组件重叠的情况,尤其在移动端小屏的情况下。</p>\n<p>另外,有时会出现一个图表需要同时在PC、移动端上展现的场景。这需要 ECharts 内部组件随着容器尺寸变化而变化的能力。</p>\n<p>为了解决这个问题,ECharts 完善了组件的定位设置,并且实现了类似 <a href=\"https://www.w3.org/TR/css3-mediaqueries/\" target=\"_blank\">CSS Media Query</a> 的自适应能力。</p>\n<h2 id=\"echarts-\">ECharts组件的定位和布局</h2>\n<p>大部分『组件』和『系列』会遵循两种定位方式:</p>\n<p><br>\n<strong>left/right/top/bottom/width/height 定位方式:</strong></p>\n<p>这六个量中,每个量都可以是『绝对值』或者『百分比』或者『位置描述』。</p>\n<ul>\n<li><p>绝对值</p>\n<p>  单位是浏览器像素(px),用 <code class=\"codespan\">number</code> 形式书写(不写单位)。例如 <code class=\"codespan\">{left: 23, height: 400}</code>。</p>\n</li>\n<li><p>百分比</p>\n<p>  表示占 DOM 容器高宽的百分之多少,用 <code class=\"codespan\">string</code> 形式书写。例如 <code class=\"codespan\">{right: &#39;30%&#39;, bottom: &#39;40%&#39;}</code>。</p>\n</li>\n<li><p>位置描述</p>\n<ul>\n<li>可以设置 <code class=\"codespan\">left: &#39;center&#39;</code>,表示水平居中。</li>\n<li>可以设置 <code class=\"codespan\">top: &#39;middle&#39;</code>,表示垂直居中。</li>\n</ul>\n</li>\n</ul>\n<p>这六个量的概念,和 CSS 中六个量的概念类似:</p>\n<ul>\n<li>left:距离 DOM 容器左边界的距离。</li>\n<li>right:距离 DOM 容器右边界的距离。</li>\n<li>top:距离 DOM 容器上边界的距离。</li>\n<li>bottom:距离 DOM 容器下边界的距离。</li>\n<li>width:宽度。</li>\n<li>height:高度。</li>\n</ul>\n<p>在横向,<code class=\"codespan\">left</code>、<code class=\"codespan\">right</code>、<code class=\"codespan\">width</code> 三个量中,只需两个量有值即可,因为任两个量可以决定组件的位置和大小,例如 <code class=\"codespan\">left</code> 和 <code class=\"codespan\">right</code> 或者 <code class=\"codespan\">right</code> 和 <code class=\"codespan\">width</code> 都可以决定组件的位置和大小。\n纵向,<code class=\"codespan\">top</code>、<code class=\"codespan\">bottom</code>、<code class=\"codespan\">height</code> 三个量,和横向类同不赘述。</p>\n<p><br>\n<strong><code class=\"codespan\">center</code> / <code class=\"codespan\">radius</code> 定位方式:</strong></p>\n<ul>\n<li><p><code class=\"codespan\">center</code></p>\n<p>  是一个数组,表示 <code class=\"codespan\">[x, y]</code>,其中,<code class=\"codespan\">x</code>、<code class=\"codespan\">y</code>可以是『绝对值』或者『百分比』,含义和前述相同。</p>\n</li>\n<li><p><code class=\"codespan\">radius</code></p>\n<p>  是一个数组,表示 <code class=\"codespan\">[内半径, 外半径]</code>,其中,内外半径可以是『绝对值』或者『百分比』,含义和前述相同。</p>\n<p>  在自适应容器大小时,百分比设置是很有用的。</p>\n</li>\n</ul>\n<p><br>\n<strong>横向(horizontal)和纵向(vertical)</strong></p>\n<p>ECharts的『外观狭长』型的组件(如 <code class=\"codespan\">legend</code>、<code class=\"codespan\">visualMap</code>、<code class=\"codespan\">dataZoom</code>、<code class=\"codespan\">timeline</code>等),大多提供了『横向布局』『纵向布局』的选择。例如,在细长的移动端屏幕上,可能适合使用『纵向布局』;在PC宽屏上,可能适合使用『横向布局』。</p>\n<p>横纵向布局的设置,一般在『组件』或者『系列』的 <code class=\"codespan\">orient</code> 或者 <code class=\"codespan\">layout</code> 配置项上,设置为 <code class=\"codespan\">&#39;horizontal&#39;</code> 或者 <code class=\"codespan\">&#39;vertical&#39;</code>。</p>\n<p><br>\n<strong>与 ECharts2 的兼容:</strong></p>\n<p>ECharts2 中的 <code class=\"codespan\">x/x2/y/y2</code> 的命名方式仍被兼容,对应于 <code class=\"codespan\">left/right/top/bottom</code>。但是建议写 <code class=\"codespan\">left/right/top/bottom</code>。</p>\n<p>位置描述中,为兼容 ECharts2,可以支持一些看起来略奇怪的设置:<code class=\"codespan\">left: &#39;right&#39;</code>、<code class=\"codespan\">left: &#39;left&#39;</code>、<code class=\"codespan\">top: &#39;bottom&#39;</code>、<code class=\"codespan\">top: &#39;top&#39;</code>。这些语句分别等效于:<code class=\"codespan\">right: 0</code>、<code class=\"codespan\">left: 0</code>、<code class=\"codespan\">bottom: 0</code>、<code class=\"codespan\">top: 0</code>,写成后者就不奇怪了。</p>\n<h2 id=\"media-query\">Media Query</h2>\n<p><a href=\"https://www.w3.org/TR/css3-mediaqueries/#media1\" target=\"_blank\">Media Query</a> 提供了『随着容器尺寸改变而改变』的能力。</p>\n<p>如下例子,可尝试拖动<strong>右下角的圆点</strong>,随着尺寸变化,legend 和 系列会自动改变布局位置和方式。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-media&edit=1&reset=1\" width=\"750\" height=\"600\" ></iframe>\n\n\n<p>要在 option 中设置 Media Query 须遵循如下格式:</p>\n<pre><code class=\"lang-javascript\">option = {\n    baseOption: { // 这里是基本的『原子option』。\n        title: {...},\n        legend: {...},\n        series: [{...}, {...}, ...],\n        ...\n    },\n    media: [ // 这里定义了 media query 的逐条规则。\n        {\n            query: {...},   // 这里写规则。\n            option: {       // 这里写此规则满足下的option。\n                legend: {...},\n                ...\n            }\n        },\n        {\n            query: {...},   // 第二个规则。\n            option: {       // 第二个规则对应的option。\n                legend: {...},\n                ...\n            }\n        },\n        {                   // 这条里没有写规则,表示『默认』,\n            option: {       // 即所有规则都不满足时,采纳这个option。\n                legend: {...},\n                ...\n            }\n        }\n    ]\n};\n</code></pre>\n<p>上面的例子中,<code class=\"codespan\">baseOption</code>、以及 <code class=\"codespan\">media</code> 每个 option 都是『原子 option』,即普通的含有各组件、系列定义的 option。而由『原子option』组合成的整个 option,我们称为『复合 option』。<code class=\"codespan\">baseOption</code> 是必然被使用的,此外,满足了某个 <code class=\"codespan\">query</code> 条件时,对应的 option 会被使用 <code class=\"codespan\">chart.mergeOption()</code> 来 merge 进去。</p>\n<p><strong>query:</strong></p>\n<p>每个 <code class=\"codespan\">query</code> 类似于这样:</p>\n<pre><code class=\"lang-javascript\">{\n    minWidth: 200,\n    maxHeight: 300,\n    minAspectRatio: 1.3\n}\n</code></pre>\n<p>现在支持三个属性:<code class=\"codespan\">width</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">aspectRatio</code>(长宽比)。每个属性都可以加上 <code class=\"codespan\">min</code> 或 <code class=\"codespan\">max</code> 前缀。比如,<code class=\"codespan\">minWidth: 200</code> 表示『大于等于200px宽度』。两个属性一起写表示『并且』,比如:<code class=\"codespan\">{minWidth: 200, maxHeight: 300}</code> 表示『大于等于200px宽度,并且小于等于300px高度』。</p>\n<p><strong>option:</strong></p>\n<p><code class=\"codespan\">media</code>中的 option 既然是『原子 option』,理论上可以写任何 option 的配置项。但是一般我们只写跟布局定位相关的,例如截取上面例子中的一部分 query option:</p>\n<pre><code class=\"lang-javascript\">media: [\n    ...,\n    {\n        query: {\n            maxAspectRatio: 1           // 当长宽比小于1时。\n        },\n        option: {\n            legend: {                   // legend 放在底部中间。\n                right: &#39;center&#39;,\n                bottom: 0,\n                orient: &#39;horizontal&#39;    // legend 横向布局。\n            },\n            series: [                   // 两个饼图左右布局。\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;70%&#39;]\n                }\n            ]\n        }\n    },\n    {\n        query: {\n            maxWidth: 500               // 当容器宽度小于 500 时。\n        },\n        option: {\n            legend: {\n                right: 10,              // legend 放置在右侧中间。\n                top: &#39;15%&#39;,\n                orient: &#39;vertical&#39;      // 纵向布局。\n            },\n            series: [                   // 两个饼图上下布局。\n                {\n                    radius: [20, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;30%&#39;]\n                },\n                {\n                    radius: [30, &#39;50%&#39;],\n                    center: [&#39;50%&#39;, &#39;75%&#39;]\n                }\n            ]\n        }\n    },\n    ...\n]\n</code></pre>\n<p><strong>多个 query 被满足时的优先级:</strong></p>\n<p>注意,可以有多个 <code class=\"codespan\">query</code> 同时被满足,会都被 <code class=\"codespan\">mergeOption</code>,定义在后的后被 merge(即优先级更高)。</p>\n<p><strong>默认 query:</strong></p>\n<p>如果 <code class=\"codespan\">media</code> 中有某项不写 <code class=\"codespan\">query</code>,则表示『默认值』,即所有规则都不满足时,采纳这个option。</p>\n<p><strong>容器大小实时变化时的注意事项:</strong></p>\n<p>在不少情况下,并不需要容器DOM节点任意随着拖拽变化大小,而是只是根据不同终端设置几个典型尺寸。</p>\n<p>但是如果容器DOM节点需要能任意随着拖拽变化大小,那么目前使用时需要注意这件事:某个配置项,如果在某一个 <code class=\"codespan\">query option</code> 中出现,那么在其他 <code class=\"codespan\">query option</code> 中也必须出现,否则不能够回归到原来的状态。(<code class=\"codespan\">left/right/top/bottom/width/height</code> 不受这个限制。)</p>\n<p><strong>『复合 option』 中的 <code class=\"codespan\">media</code> 不支持 merge</strong></p>\n<p>也就是说,当第二(或三、四、五 ...)次 <code class=\"codespan\">chart.setOption(rawOption)</code> 时,如果 <code class=\"codespan\">rawOption</code> 是 <code class=\"codespan\">复合option</code>(即包含 <code class=\"codespan\">media</code> 列表),那么新的 <code class=\"codespan\">rawOption.media</code> 列表不会和老的 <code class=\"codespan\">media</code> 列表进行 merge,而是简单替代。当然,<code class=\"codespan\">rawOption.baseOption</code> 仍然会正常和老的 option 进行merge。</p>\n<p>其实,很少有场景需要使用『复合 option』来多次 <code class=\"codespan\">setOption</code>,而我们推荐的做法是,使用 mediaQuery 时,第一次setOption使用『复合 option』,后面 <code class=\"codespan\">setOption</code> 时仅使用 『原子 option』,也就是仅仅用 setOption 来改变 <code class=\"codespan\">baseOption</code>。</p>\n<p><br>\n最后看一个和时间轴结合的例子:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/bar-media-timeline&edit=1&reset=1\" width=\"750\" height=\"700\" ></iframe>\n\n\n\n\n\n"},"数据的视觉映射":{"type":["*"],"description":"<p>数据可视化是 <strong>数据</strong> 到 <strong>视觉元素</strong> 的映射过程(这个过程也可称为视觉编码,视觉元素也可称为视觉通道)。</p>\n<p>Apache ECharts (incubating)<sup>TM</sup> 的每种图表本身就内置了这种映射过程,比如折线图把数据映射到『线』,柱状图把数据映射到『长度』。一些更复杂的图表,如 <code class=\"codespan\">graph</code>、<code class=\"codespan\">事件河流图</code>、<code class=\"codespan\">treemap</code> 也都会做出他们内置的映射。</p>\n<p>此外,ECharts 还提供了 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap 组件</a> 来提供通用的视觉映射。<code class=\"codespan\">visualMap</code> 组件中可以使用的视觉元素有:<br>\n<code class=\"codespan\">图形类别(symbol)</code>、<code class=\"codespan\">图形大小(symbolSize)</code><br>\n<code class=\"codespan\">颜色(color)</code>、<code class=\"codespan\">透明度(opacity)</code>、<code class=\"codespan\">颜色透明度(colorAlpha)</code>、<br>\n<code class=\"codespan\">颜色明暗度(colorLightness)</code>、<code class=\"codespan\">颜色饱和度(colorSaturation)</code>、<code class=\"codespan\">色调(colorHue)</code></p>\n<p>下面对 <code class=\"codespan\">visualMap</code> 组件的使用方式进行简要的介绍。</p>\n<h2 id=\"-\">数据和维度</h2>\n<p>ECharts中的数据,一般存放于 <a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 中。根据图表类型不同,数据的具体形式也可能有些许差异。比如可能是『线性表』、『树』、『图』等。但他们都有个共性:都是『数据项(dataItem)』的集合。每个数据项含有『数据值(value)』和其他信息(如果需要的话)。每个数据值,可以是单一的数值(一维)或者一个数组(多维)。</p>\n<p>例如,<a href=\"option.html#series.data\" target=\"_blank\">series.data</a> 最常见的形式,是『线性表』,即一个普通数组:</p>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {       // 这里每一个项就是数据项(dataItem)\n            value: 2323, // 这是数据项的数据值(value)\n            itemStyle: {...}\n        },\n        1212,   // 也可以直接是 dataItem 的 value,这更常见。\n        2323,   // 每个 value 都是『一维』的。\n        4343,\n        3434\n    ]\n}\n</code></pre>\n<pre><code class=\"lang-javascript\">series: {\n    data: [\n        {                        // 这里每一个项就是数据项(dataItem)\n            value: [3434, 129,  &#39;圣马力诺&#39;], // 这是数据项的数据值(value)\n            itemStyle: {...}\n        },\n        [1212, 5454, &#39;梵蒂冈&#39;],   // 也可以直接是 dataItem 的 value,这更常见。\n        [2323, 3223, &#39;瑙鲁&#39;],     // 每个 value 都是『三维』的,每列是一个维度。\n        [4343, 23,   &#39;图瓦卢&#39;]    // 假如是『气泡图』,常见第一维度映射到x轴,\n                                 // 第二维度映射到y轴,\n                                 // 第三维度映射到气泡半径(symbolSize)\n    ]\n}\n</code></pre>\n<p>在图表中,往往默认把 value 的前一两个维度进行映射,比如取第一个维度映射到x轴,取第二个维度映射到y轴。如果想要把更多的维度展现出来,可以借助 <code class=\"codespan\">visualMap</code> 。最常见的情况,<a href=\"option.html#series-scatter\" target=\"_blank\">气泡图(scatter)</a> 使用半径展现了第三个维度。</p>\n<h2 id=\"visualmap-\">visualMap 组件</h2>\n<p>visualMap 组件定义了把数据的『哪个维度』映射到『什么视觉元素上』。</p>\n<p>现在提供如下两种类型的visualMap组件,通过 <a href=\"option.html#visualMap.type\" target=\"_blank\">visualMap.type</a> 来区分。</p>\n<p>其定义结构例如:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [ // 可以同时定义多个 visualMap 组件。\n        { // 第一个 visualMap 组件\n            type: &#39;continuous&#39;, // 定义为连续型 visualMap\n            ...\n        },\n        { // 第二个 visualMap 组件\n            type: &#39;piecewise&#39;, // 定义为分段型 visualMap\n            ...\n        }\n    ],\n    ...\n};\n</code></pre>\n<p><br>\n<a href=\"option.html#visualMap-continuous\" target=\"_blank\">连续型(visualMapContinuous)</a></p>\n<p><a href=\"option.html#visualMap-piecewise\" target=\"_blank\">分段型(visualMapPiecewise)</a>:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/scatter-visualMap-piecewise&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p><br>\n分段型视觉映射组件(visualMapPiecewise),有三种模式:</p>\n<ul>\n<li>连续型数据平均分段: 依据 <a href=\"option.html#visualMap-piecewise.splitNumber\" target=\"_blank\">visualMap-piecewise.splitNumber</a> 来自动平均分割成若干块。</li>\n<li>连续型数据自定义分段: 依据 <a href=\"option.html#visualMap-piecewise.pieces\" target=\"_blank\">visualMap-piecewise.pieces</a> 来定义每块范围。</li>\n<li>离散数据(类别性数据): 类别定义在 <a href=\"option.html#visualMap-piecewise.categories\" target=\"_blank\">visualMap-piecewise.categories</a> 中。</li>\n</ul>\n<p><br>\n<strong>视觉映射方式的配置</strong></p>\n<p>既然是『数据』到『视觉元素』的映射,<code class=\"codespan\">visualMap</code> 中可以指定数据的『哪个维度』(参见<a href=\"#visualMap.dimension\">visualMap.dimension</a>)映射到哪些『视觉元素』(参见 <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> 和 <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>)中。</p>\n<p>例一:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            type: &#39;piecewise&#39;,\n            min: 0,\n            max: 5000,\n            dimension: 3,       // series.data 的第四个维度(即 value[3])被映射\n            seriesIndex: 4,     // 对第四个系列进行映射。\n            inRange: {          // 选中范围中的视觉配置\n                color: [&#39;blue&#39;, &#39;#121122&#39;, &#39;red&#39;], // 定义了图形颜色映射的颜色列表,\n                                                    // 数据最小值映射到&#39;blue&#39;上,\n                                                    // 最大值映射到&#39;red&#39;上,\n                                                    // 其余自动线性计算。\n                symbolSize: [30, 100]               // 定义了图形尺寸的映射范围,\n                                                    // 数据最小值映射到30上,\n                                                    // 最大值映射到100上,\n                                                    // 其余自动线性计算。\n            },\n            outOfRange: {       // 选中范围外的视觉配置\n                symbolSize: [30, 100]\n            }\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>例二:</p>\n<pre><code class=\"lang-javascript\">option = {\n    visualMap: [\n        {\n            ...,\n            inRange: {          // 选中范围中的视觉配置\n                colorLightness: [0.2, 1], // 映射到明暗度上。也就是对本来的颜色进行明暗度处理。\n                                          // 本来的颜色可能是从全局色板中选取的颜色,visualMap组件并不关心。\n                symbolSize: [30, 100]\n            },\n            ...\n        },\n        ...\n    ]\n};\n</code></pre>\n<p>更多详情,参见 <a href=\"option.html#visualMap.inRange\" target=\"_blank\">visualMap.inRange</a> 和 <a href=\"option.html#visualMap.outOfRange\" target=\"_blank\">visualMap.outOfRange</a>。</p>\n"},"ECharts 中的事件和行为":{"type":["*"],"description":"<p>在 Apache ECharts (incubating)<sup>TM</sup> 的图表中用户的操作将会触发相应的事件。开发者可以监听这些事件,然后通过回调函数做相应的处理,比如跳转到一个地址,或者弹出对话框,或者做数据下钻等等。</p>\n<p>在 ECharts 3 中绑定事件跟 2 一样都是通过 <a href=\"api.html#EChartsInstance.on\" target=\"_blank\">on</a> 方法,但是事件名称比 2 更加简单了。ECharts 3 中,事件名称对应 DOM 事件名称,均为小写的字符串,如下是一个绑定点击操作的示例。</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    // 控制台打印数据的名称\n    console.log(params.name);\n});\n</code></pre>\n<p>在 ECharts 中事件分为两种类型,一种是用户鼠标操作点击,或者 hover 图表的图形时触发的事件,还有一种是用户在使用可以交互的组件后触发的行为事件,例如在切换图例开关时触发的 <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;legendselectchanged&#39;</a> 事件(这里需要注意切换图例开关是不会触发<code class=\"codespan\">&#39;legendselected&#39;</code>事件的),数据区域缩放时触发的 <a href=\"api.html#events.legendselectchanged\" target=\"_blank\">&#39;datazoom&#39;</a> 事件等等。</p>\n<h2 id=\"-\">鼠标事件的处理</h2>\n<p>ECharts 支持常规的鼠标事件类型,包括 <code class=\"codespan\">&#39;click&#39;</code>、<code class=\"codespan\">&#39;dblclick&#39;</code>、<code class=\"codespan\">&#39;mousedown&#39;</code>、<code class=\"codespan\">&#39;mousemove&#39;</code>、<code class=\"codespan\">&#39;mouseup&#39;</code>、<code class=\"codespan\">&#39;mouseover&#39;</code>、<code class=\"codespan\">&#39;mouseout&#39;</code>、<code class=\"codespan\">&#39;globalout&#39;</code>、<code class=\"codespan\">&#39;contextmenu&#39;</code> 事件。下面先来看一个简单的点击柱状图后打开相应的百度搜索页面的示例。</p>\n<pre><code class=\"lang-js\">// 基于准备好的dom,初始化ECharts实例\nvar myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n// 指定图表的配置项和数据\nvar option = {\n    xAxis: {\n        data: [&quot;衬衫&quot;,&quot;羊毛衫&quot;,&quot;雪纺衫&quot;,&quot;裤子&quot;,&quot;高跟鞋&quot;,&quot;袜子&quot;]\n    },\n    yAxis: {},\n    series: [{\n        name: &#39;销量&#39;,\n        type: &#39;bar&#39;,\n        data: [5, 20, 36, 10, 10, 20]\n    }]\n};\n// 使用刚指定的配置项和数据显示图表。\nmyChart.setOption(option);\n// 处理点击事件并且跳转到相应的百度搜索页面\nmyChart.on(&#39;click&#39;, function (params) {\n    window.open(&#39;https://www.baidu.com/s?wd=&#39; + encodeURIComponent(params.name));\n});\n</code></pre>\n<p>所有的鼠标事件包含参数 <code class=\"codespan\">params</code>,这是一个包含点击图形的数据信息的对象,如下格式:</p>\n<pre><code class=\"lang-js\">{\n    // 当前点击的图形元素所属的组件名称,\n    // 其值如 &#39;series&#39;、&#39;markLine&#39;、&#39;markPoint&#39;、&#39;timeLine&#39; 等。\n    componentType: string,\n    // 系列类型。值可能为:&#39;line&#39;、&#39;bar&#39;、&#39;pie&#39; 等。当 componentType 为 &#39;series&#39; 时有意义。\n    seriesType: string,\n    // 系列在传入的 option.series 中的 index。当 componentType 为 &#39;series&#39; 时有意义。\n    seriesIndex: number,\n    // 系列名称。当 componentType 为 &#39;series&#39; 时有意义。\n    seriesName: string,\n    // 数据名,类目名\n    name: string,\n    // 数据在传入的 data 数组中的 index\n    dataIndex: number,\n    // 传入的原始数据项\n    data: Object,\n    // sankey、graph 等图表同时含有 nodeData 和 edgeData 两种 data,\n    // dataType 的值会是 &#39;node&#39; 或者 &#39;edge&#39;,表示当前点击在 node 还是 edge 上。\n    // 其他大部分图表中只有一种 data,dataType 无意义。\n    dataType: string,\n    // 传入的数据值\n    value: number|Array\n    // 数据图形的颜色。当 componentType 为 &#39;series&#39; 时有意义。\n    color: string\n}\n</code></pre>\n<p>如何区分鼠标点击到了哪里:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (params) {\n    if (params.componentType === &#39;markPoint&#39;) {\n        // 点击到了 markPoint 上\n        if (params.seriesIndex === 5) {\n            // 点击到了 index 为 5 的 series 的 markPoint 上。\n        }\n    }\n    else if (params.componentType === &#39;series&#39;) {\n        if (params.seriesType === &#39;graph&#39;) {\n            if (params.dataType === &#39;edge&#39;) {\n                // 点击到了 graph 的 edge(边)上。\n            }\n            else {\n                // 点击到了 graph 的 node(节点)上。\n            }\n        }\n    }\n});\n</code></pre>\n<p>使用 <code class=\"codespan\">query</code> 只对指定的组件的图形元素的触发回调:</p>\n<pre><code class=\"lang-js\">chart.on(eventName, query, handler);\n</code></pre>\n<p><code class=\"codespan\">query</code> 可为 <code class=\"codespan\">string</code> 或者 <code class=\"codespan\">Object</code>。</p>\n<p>如果为 <code class=\"codespan\">string</code> 表示组件类型。格式可以是 &#39;mainType&#39; 或者 &#39;mainType.subType&#39;。例如:</p>\n<pre><code class=\"lang-js\">chart.on(&#39;click&#39;, &#39;series&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;series.line&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;dataZoom&#39;, function () {...});\nchart.on(&#39;click&#39;, &#39;xAxis.category&#39;, function () {...});\n</code></pre>\n<p>如果为 <code class=\"codespan\">Object</code>,可以包含以下一个或多个属性,每个属性都是可选的:</p>\n<pre><code class=\"lang-js\">{\n    &lt;mainType&gt;Index: number // 组件 index\n    &lt;mainType&gt;Name: string // 组件 name\n    &lt;mainType&gt;Id: string // 组件 id\n    dataIndex: number // 数据项 index\n    name: string // 数据项 name\n    dataType: string // 数据项 type,如关系图中的 &#39;node&#39;, &#39;edge&#39;\n    element: string // 自定义系列中的 el 的 name\n}\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        name: &#39;uuu&#39;\n        // ...\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesName: &#39;uuu&#39;}, function () {\n    // series name 为 &#39;uuu&#39; 的系列中的图形元素被 &#39;mouseover&#39; 时,此方法被回调。\n});\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        // ...\n    }, {\n        // ...\n        data: [\n            {name: &#39;xx&#39;, value: 121},\n            {name: &#39;yy&#39;, value: 33}\n        ]\n    }]\n});\nchart.on(&#39;mouseover&#39;, {seriesIndex: 1, name: &#39;xx&#39;}, function () {\n    // series index 1 的系列中的 name 为 &#39;xx&#39; 的元素被 &#39;mouseover&#39; 时,此方法被回调。\n});\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: [{\n        type: &#39;graph&#39;,\n        nodes: [{name: &#39;a&#39;, value: 10}, {name: &#39;b&#39;, value: 20}],\n        edges: [{source: 0, target: 1}]\n    }]\n});\nchart.on(&#39;click&#39;, {dataType: &#39;node&#39;}, function () {\n    // 关系图的节点被点击时此方法被回调。\n});\nchart.on(&#39;click&#39;, {dataType: &#39;edge&#39;}, function () {\n    // 关系图的边被点击时此方法被回调。\n});\n</code></pre>\n<p>例如:</p>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        // ...\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;,\n                    name: &#39;my_el&#39;,\n                    // ...\n                }, {\n                    // ...\n                }]\n            }\n        },\n        data: [[12, 33]]\n    }\n})\nchart.on(&#39;mouseup&#39;, {element: &#39;my_el&#39;}, function () {\n    // name 为 &#39;my_el&#39; 的元素被 &#39;mouseup&#39; 时,此方法被回调。\n});\n</code></pre>\n<p>你可以在回调函数中获得这个对象中的数据名、系列名称后在自己的数据仓库中索引得到其它的信息候更新图表,显示浮层等等,如下示例代码:</p>\n<pre><code class=\"lang-js\">myChart.on(&#39;click&#39;, function (parmas) {\n    $.get(&#39;detail?q=&#39; + params.name, function (detail) {\n        myChart.setOption({\n            series: [{\n                name: &#39;pie&#39;,\n                // 通过饼图表现单个柱子中的数据分布\n                data: [detail.data]\n            }]\n        });\n    });\n});\n</code></pre>\n<h2 id=\"-\">组件交互的行为事件</h2>\n<p>在 ECharts 中基本上所有的组件交互行为都会触发相应的事件,常用的事件和事件对应参数在 <a href=\"api.html#events\" target=\"_blank\">events</a> 文档中有列出。</p>\n<p>下面是监听一个图例开关的示例:</p>\n<pre><code class=\"lang-js\">// 图例开关的行为只会触发 legendselectchanged 事件\nmyChart.on(&#39;legendselectchanged&#39;, function (params) {\n    // 获取点击图例的选中状态\n    var isSelected = params.selected[params.name];\n    // 在控制台中打印\n    console.log((isSelected ? &#39;选中了&#39; : &#39;取消选中了&#39;) + &#39;图例&#39; + params.name);\n    // 打印所有图例的状态\n    console.log(params.selected);\n});\n</code></pre>\n<h2 id=\"-echarts-\">代码触发 ECharts 中组件的行为</h2>\n<p>上面提到诸如<code class=\"codespan\">&#39;legendselectchanged&#39;</code>事件会由组件交互的行为触发,那除了用户的交互操作,有时候也会有需要在程序里调用方法触发图表的行为,诸如显示 tooltip,选中图例。</p>\n<p>在 ECharts 2.x 是通过 <code class=\"codespan\">myChart.component.tooltip.showTip</code> 这种形式调用相应的接口触发图表行为,入口很深,而且涉及到内部组件的组织。相对地,在 ECharts 3 里改为通过调用 <code class=\"codespan\">myChart.dispatchAction({ type: &#39;&#39; })</code> 触发图表行为,统一管理了所有动作,也可以方便地根据需要去记录用户的行为路径。</p>\n<p>常用的动作和动作对应参数在 <a href=\"api.html#action\" target=\"_blank\">action</a> 文档中有列出。</p>\n<p>下面示例演示了如何通过<code class=\"codespan\">dispatchAction</code>去轮流高亮饼图的每个扇形。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/pie-highlight&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n\n\n"},"小例子:自己实现拖拽":{"type":["*"],"description":"<p>介绍一个实现拖拽的小例子。这个例子是在原生 Apache ECharts (incubating)<sup>TM</sup> 基础上做了些小小扩展,带有一定的交互性。通过这个例子,我们可以了解到,如何使用 ECharts 提供的 API 实现定制化的富交互的功能。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=line-draggable&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>这个例子主要做到了这样一件事,用鼠标可以拖拽曲线的点,从而改变曲线的形状。例子很简单,但是有了这个基础我们还可以做更多的事情,比如在图中可视化得编辑。所以我们从这个简单的例子开始。</p>\n<p>echarts 本身没有提供封装好的『拖拽改变图表』功能,因为现在认为这个功能并不足够有通用性。那么这个功能就留给开发者用 API 实现,这也有助于开发者按自己的需要个性定制。</p>\n<h2 id=\"-\">(一)实现基本的拖拽功能</h2>\n<p>在这个例子中,基础的图表是一个 <a href=\"option.html#series-line\" target=\"_blank\">折线图 (series-line)</a>。参见如下配置:</p>\n<pre><code class=\"lang-js\">var symbolSize = 20;\n\n// 这个 data 变量在这里单独声明,在后面也会用到。\nvar data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\nmyChart.setOption({\n    xAxis: {\n        min: -100,\n        max: 80,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    yAxis: {\n        min: -30,\n        max: 60,\n        type: &#39;value&#39;,\n        axisLine: {onZero: false}\n    },\n    series: [\n        {\n            id: &#39;a&#39;,\n            type: &#39;line&#39;,\n            smooth: true,\n            symbolSize: symbolSize, // 为了方便拖拽,把 symbolSize 尺寸设大了。\n            data: data\n        }\n    ]\n});\n</code></pre>\n<p>既然折线中原生的点没有拖拽功能,我们就为它加上拖拽功能:用 <a href=\"option.html#graphic\" target=\"_blank\">graphic</a> 组件,在每个点上面,覆盖一个隐藏的可拖拽的圆点。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    // 声明一个 graphic component,里面有若干个 type 为 &#39;circle&#39; 的 graphic elements。\n    // 这里使用了 echarts.util.map 这个帮助方法,其行为和 Array.prototype.map 一样,但是兼容 es5 以下的环境。\n    // 用 map 方法遍历 data 的每项,为每项生成一个圆点。\n    graphic: echarts.util.map(data, function (dataItem, dataIndex) {\n        return {\n            // &#39;circle&#39; 表示这个 graphic element 的类型是圆点。\n            type: &#39;circle&#39;,\n\n            shape: {\n                // 圆点的半径。\n                r: symbolSize / 2\n            },\n            // 用 transform 的方式对圆点进行定位。position: [x, y] 表示将圆点平移到 [x, y] 位置。\n            // 这里使用了 convertToPixel 这个 API 来得到每个圆点的位置,下面介绍。\n            position: myChart.convertToPixel(&#39;grid&#39;, dataItem),\n\n            // 这个属性让圆点不可见(但是不影响他响应鼠标事件)。\n            invisible: true,\n            // 这个属性让圆点可以被拖拽。\n            draggable: true,\n            // 把 z 值设得比较大,表示这个圆点在最上方,能覆盖住已有的折线图的圆点。\n            z: 100,\n            // 此圆点的拖拽的响应事件,在拖拽过程中会不断被触发。下面介绍详情。\n            // 这里使用了 echarts.util.curry 这个帮助方法,意思是生成一个与 onPointDragging\n            // 功能一样的新的函数,只不过第一个参数永远为此时传入的 dataIndex 的值。\n            ondrag: echarts.util.curry(onPointDragging, dataIndex)\n        };\n    })\n});\n</code></pre>\n<p>上面的代码中,使用 <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a> 这个 API,进行了从 data 到『像素坐标』的转换,从而得到了每个圆点应该在的位置,从而能绘制这些圆点。<code class=\"codespan\">myChart.convertToPixel(&#39;grid&#39;, dataItem)</code> 这句话中,第一个参数 <code class=\"codespan\">&#39;grid&#39;</code> 表示 <code class=\"codespan\">dataItem</code> 在 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 这个组件中(即直角坐标系)中进行转换。所谓『像素坐标』,就是以 echarts 容器 dom element 的左上角为零点的以像素为单位的坐标系中的坐标。</p>\n<p>注意这件事需要在第一次 setOption 后再进行,也就是说,须在坐标系(<a href=\"option.html#grid\" target=\"_blank\">grid</a>)初始化后才能调用 <code class=\"codespan\">myChart.convertToPixel(&#39;grid&#39;, dataItem)</code>。</p>\n<p>有了这段代码后,就有了诸个能拖拽的点。接下来要为每个点,加上拖拽响应的事件:</p>\n<pre><code class=\"lang-js\">// 拖拽某个圆点的过程中会不断调用此函数。\n// 此函数中会根据拖拽后的新位置,改变 data 中的值,并用新的 data 值,重绘折线图,从而使折线图同步于被拖拽的隐藏圆点。\nfunction onPointDragging(dataIndex) {\n    // 这里的 data 就是本文最初的代码块中声明的 data,在这里会被更新。\n    // 这里的 this 就是被拖拽的圆点。this.position 就是圆点当前的位置。\n    data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n    // 用更新后的 data,重绘折线图。\n    myChart.setOption({\n        series: [{\n            id: &#39;a&#39;,\n            data: data\n        }]\n    });\n}\n</code></pre>\n<p>上面的代码中,使用了 <a href=\"api.html#echartsInstance.convertFromPixel\" target=\"_blank\">convertFromPixel</a> 这个 API。它是 <a href=\"api.html#echartsInstance.convertToPixel\" target=\"_blank\">convertToPixel</a> 的逆向过程。<code class=\"codespan\">myChart.convertFromPixel(&#39;grid&#39;, this.position)</code> 表示把当前像素坐标转换成 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件中直角坐标系的 dataItem 值。</p>\n<p>最后,为了使 dom 尺寸改变时,图中的元素能自适应得变化,加上这些代码:</p>\n<pre><code class=\"lang-js\">window.addEventListener(&#39;resize&#39;, function () {\n    // 对每个拖拽圆点重新计算位置,并用 setOption 更新。\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                position: myChart.convertToPixel(&#39;grid&#39;, item)\n            };\n        })\n    });\n});\n\n</code></pre>\n<h2 id=\"-tooltip-\">(二)添加 tooltip 组件</h2>\n<p>到此,拖拽的基本功能就完成了。但是想要更进一步得实时看到拖拽过程中,被拖拽的点的 data 值的变化状况,我们可以使用 <a href=\"option.html#tooltip\" target=\"_blank\">tooltip</a> 组件来实时显示这个值。但是,tooltip 有其默认的『显示』『隐藏』触发规则,在我们拖拽的场景中并不适用,所以我们还要手动定制 tooltip 的『显示』『隐藏』行为。</p>\n<p>在上述代码中分别添加如下定义:</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    ...,\n    tooltip: {\n        // 表示不使用默认的『显示』『隐藏』触发规则。\n        triggerOn: &#39;none&#39;,\n        formatter: function (params) {\n            return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n        }\n    }\n});\n</code></pre>\n<pre><code class=\"lang-js\">myChart.setOption({\n    graphic: echarts.util.map(data, function (item, dataIndex) {\n        return {\n            type: &#39;circle&#39;,\n            ...,\n            // 在 mouseover 的时候显示,在 mouseout 的时候隐藏。\n            onmousemove: echarts.util.curry(showTooltip, dataIndex),\n            onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n        };\n    })\n});\n\nfunction showTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;showTip&#39;,\n        seriesIndex: 0,\n        dataIndex: dataIndex\n    });\n}\n\nfunction hideTooltip(dataIndex) {\n    myChart.dispatchAction({\n        type: &#39;hideTip&#39;\n    });\n}\n</code></pre>\n<p>这里使用了 <a href=\"api.html#echartsInstance.dispatchAction\" target=\"_blank\">dispatchAction</a> 来显示隐藏 tooltip。用到了 <a href=\"api.html#action.tooltip.showTip\" target=\"_blank\">showTip</a>、<a href=\"api.html#action.tooltip.hideTip\" target=\"_blank\">hideTip</a>。</p>\n<h2 id=\"-\">(三)全部代码</h2>\n<p>总结一下,全部的代码如下:</p>\n<pre><code>&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;script src=&quot;dist/echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width: 600px;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n\n    var symbolSize = 20;\n    var data = [[15, 0], [-50, 10], [-56.5, 20], [-46.5, 30], [-22.1, 40]];\n\n    var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n    myChart.setOption({\n        tooltip: {\n            triggerOn: &#39;none&#39;,\n            formatter: function (params) {\n                return &#39;X: &#39; + params.data[0].toFixed(2) + &#39;&lt;br&gt;Y: &#39; + params.data[1].toFixed(2);\n            }\n        },\n        xAxis: {\n            min: -100,\n            max: 80,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        yAxis: {\n            min: -30,\n            max: 60,\n            type: &#39;value&#39;,\n            axisLine: {onZero: false}\n        },\n        series: [\n            {\n                id: &#39;a&#39;,\n                type: &#39;line&#39;,\n                smooth: true,\n                symbolSize: symbolSize,\n                data: data\n            }\n        ],\n    });\n\n    myChart.setOption({\n        graphic: echarts.util.map(data, function (item, dataIndex) {\n            return {\n                type: &#39;circle&#39;,\n                position: myChart.convertToPixel(&#39;grid&#39;, item),\n                shape: {\n                    r: symbolSize / 2\n                },\n                invisible: true,\n                draggable: true,\n                ondrag: echarts.util.curry(onPointDragging, dataIndex),\n                onmousemove: echarts.util.curry(showTooltip, dataIndex),\n                onmouseout: echarts.util.curry(hideTooltip, dataIndex),\n                z: 100\n            };\n        })\n    });\n\n    window.addEventListener(&#39;resize&#39;, function () {\n        myChart.setOption({\n            graphic: echarts.util.map(data, function (item, dataIndex) {\n                return {\n                    position: myChart.convertToPixel(&#39;grid&#39;, item)\n                };\n            })\n        });\n    });\n\n    function showTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;showTip&#39;,\n            seriesIndex: 0,\n            dataIndex: dataIndex\n        });\n    }\n\n    function hideTooltip(dataIndex) {\n        myChart.dispatchAction({\n            type: &#39;hideTip&#39;\n        });\n    }\n\n    function onPointDragging(dataIndex, dx, dy) {\n        data[dataIndex] = myChart.convertFromPixel(&#39;grid&#39;, this.position);\n        myChart.setOption({\n            series: [{\n                id: &#39;a&#39;,\n                data: data\n            }]\n        });\n    }\n\n&lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n</code></pre><p><br></p>\n<p>有了这些基础,就可以定制更多的功能了。可以加 <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> 组件,可以制作一个直角坐标系上的绘图板等等。可以发挥想象力。</p>\n"},"小例子:实现日历图":{"type":["*"],"description":"<p>在 Apache ECharts (incubating)<sup>TM</sup> 中,我们新增了日历坐标系,如何快速写出一个日历图呢?</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-simple&edit=1&reset=1\" width=\"800\" height=\"300\" ></iframe>\n\n\n<p>通过以下三个步骤即可实现上述效果:</p>\n<h2 id=\"-js-\">第一步:引入js文件</h2>\n<p>下载的最新完整版本 echarts.min.js 即可,无需再单独引入其他文件哦</p>\n<pre><code class=\"lang-html\">&lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;script&gt;\n    // ...\n&lt;/script&gt;\n</code></pre>\n<h2 id=\"-dom-\">第二步:指定DOM元素作为图表容器</h2>\n<p>和ECharts中的其他图表一样,创建一个DOM来作为绘制图表的容器</p>\n<pre><code class=\"lang-html\">&lt;div id=&quot;main&quot; style=&quot;width=100%; height = 400px&quot;&gt;&lt;/div&gt;\n</code></pre>\n<p>使用ECharts进行初始化</p>\n<pre><code class=\"lang-js\">var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n</code></pre>\n<h2 id=\"-\">第三步:配置参数</h2>\n<p>以常见的日历图为例: calendar坐标 + heatmap图</p>\n<pre><code class=\"lang-js\">var option = {\n    visualMap: {\n        show: false\n        min: 0,\n        max: 1000\n    },\n    calendar: {\n        range: &#39;2017&#39;\n    },\n    series: {\n        type: &#39;heatmap&#39;,\n        coordinateSystem: &#39;calendar&#39;,\n        data: [[&#39;2017-01-02&#39;, 900], [&#39;2017-01-02&#39;, 877], [&#39;2017-01-02&#39;, 699], ...]\n    }\n}\nmyChart.setOption(option);\n</code></pre>\n<p>在heatmap图的基础上,加上<code class=\"codespan\">coordinateSystem: &#39;calendar&#39;,</code>和<code class=\"codespan\">calendar: { range: &#39;2017&#39; }</code>heatmap图就秒变为日历图了。</p>\n<blockquote>\n<p>若发现图表没有正确显示,你可以检查以下几种可能:</p>\n<ul>\n<li>JS文件是否正确加载;</li>\n<li><code class=\"codespan\">echarts</code> 变量是否存在;</li>\n<li>控制台是否报错;</li>\n<li>DOM 元素在 <code class=\"codespan\">echarts.init</code> 的时候是否有高度和宽度。</li>\n<li>若为 <code class=\"codespan\">type: heatmap</code>,检查是否配置了 <code class=\"codespan\">visualMap</code>。</li>\n</ul>\n</blockquote>\n<p><strong>附完整示例代码</strong></p>\n<pre><code class=\"lang-html\">&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n    &lt;meta charset=&quot;utf-8&quot;&gt;\n    &lt;title&gt;ECharts&lt;/title&gt;\n    &lt;script src=&quot;echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;/head&gt;\n&lt;body&gt;\n    &lt;div id=&quot;main&quot; style=&quot;width:100%;height:400px;&quot;&gt;&lt;/div&gt;\n    &lt;script type=&quot;text/javascript&quot;&gt;\n        var myChart = echarts.init(document.getElementById(&#39;main&#39;));\n\n        // 模拟数据\n        function getVirtulData(year) {\n            year = year || &#39;2017&#39;;\n            var date = +echarts.number.parseDate(year + &#39;-01-01&#39;);\n            var end = +echarts.number.parseDate(year + &#39;-12-31&#39;);\n            var dayTime = 3600 * 24 * 1000;\n            var data = [];\n            for (var time = date; time &lt;= end; time += dayTime) {\n                data.push([\n                    echarts.format.formatTime(&#39;yyyy-MM-dd&#39;, time),\n                    Math.floor(Math.random() * 10000)\n                ]);\n            }\n            return data;\n        }\n        var option = {\n            visualMap: {\n                show: false,\n                min: 0,\n                max: 10000\n            },\n            calendar: {\n                range: &#39;2017&#39;\n            },\n            series: {\n                type: &#39;heatmap&#39;,\n                coordinateSystem: &#39;calendar&#39;,\n                data: getVirtulData(2017)\n            }\n        };\n        myChart.setOption(option);\n    &lt;/script&gt;\n&lt;/body&gt;\n&lt;/html&gt;\n\n</code></pre>\n<p>以上就是绘制最简日历图的步骤了,如若还想进一步私人定制,还可以通过自定义配置参数来实现</p>\n<h2 id=\"-\">自定义配置参数</h2>\n<p>使用日历坐标绘制日历图时,支持自定义各项属性:</p>\n<ul>\n<li><p><a href=\"option.html#calendar.range\" target=\"_blank\">range</a>: <code class=\"codespan\">设置时间的范围,可支持某年、某月、某天,还可支持跨年</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.cellSize\" target=\"_blank\">cellSize</a>: <code class=\"codespan\">设置日历格的大小,可支持设置不同高宽,还可支持自适应auto</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.width\" target=\"_blank\">width</a>、<a href=\"http://xxx\" target=\"_blank\">height</a>: <code class=\"codespan\">也可以直接设置改日历图的整体高宽,让其基于已有的高宽全部自适应</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.orient\" target=\"_blank\">orient</a>: <code class=\"codespan\">设置坐标的方向,既可以横着也可以竖着</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.splitLine\" target=\"_blank\">splitLine</a>: <code class=\"codespan\">设置分隔线样式,也可以直接不显示</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.itemStyle\" target=\"_blank\">itemStyle</a>: <code class=\"codespan\">设置日历格的样式,背景色、方框线颜色大小类型、透明度均可自定义,甚至还能加阴影</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.dayLabel\" target=\"_blank\">dayLabel</a>: <code class=\"codespan\">设置坐标中 星期样式,可以设置星期从第几天开始,快捷设置中英文、甚至是自定义中英文混搭、或局部不显示、通过formatter 可以想怎么显示就怎么显示;</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.monthLabel\" target=\"_blank\">monthLabel</a>: <code class=\"codespan\">设置坐标中 月样式,和星期一样,可快捷设置中英文和自定义混搭</code></p>\n</li>\n<li><p><a href=\"option.html#calendar.yearLabel\" target=\"_blank\">yearLabel</a>: <code class=\"codespan\">设置坐标中 年样式,默认显示一年,通过formatter 文字可以想显示什么就能通过string function任性自定义,上下左右方位随便选;</code></p>\n</li>\n</ul>\n<p>完整的配置项参数参见:<a href=\"option.html#calendar\" target=\"_blank\">calendar API</a></p>\n<h2 id=\"-\">日历坐标系的其他形式</h2>\n<p>日历坐标系是一种新的 <code class=\"codespan\">ECharts</code> 坐标系,提供了在日历上绘制图表的能力; 所以除了制作常用的日历图外,我们可以在热力图、散点图、关系图中使用日历坐标系。</p>\n<p>在日历坐标系中使用热力图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-heatmap&edit=1&reset=1\" width=\"800\" height=\"300\" ></iframe>\n\n\n<p>在日历坐标系中使用散点图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-effectscatter&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n<p>还可以混合放置不同的图表,例如下例子,同时放置了热力图和关系图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-graph&edit=1&reset=1\" width=\"800\" height=\"600\" ></iframe>\n\n\n<p><strong>其他更丰富的效果</strong></p>\n<p>灵活利用 <code class=\"codespan\">ECharts</code> 图表和坐标系的组合,以及 API,还可以实现更丰富的效果。</p>\n<p>例如,制作农历:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-lunar&edit=1&reset=1\" width=\"600\" height=\"500\" ></iframe>\n\n\n<p>例如,使用 <code class=\"codespan\">chart.convertToPixel</code> 接口,在日历坐标系绘制饼图。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=calendar-pie&edit=1&reset=1\" width=\"800\" height=\"640\" ></iframe>\n\n\n\n\n\n\n\n"},"旭日图":{"type":["*"],"description":"<p><a href=\"https://en.wikipedia.org/wiki/Pie_chart#Ring_chart_/_Sunburst_chart_/_Multilevel_pie_chart\" target=\"_blank\">旭日图(Sunburst)</a>由多层的环形图组成,在数据结构上,内圈是外圈的父节点。因此,它既能像<a href=\"option.html#series-pie\" target=\"_blank\">饼图</a>一样表现局部和整体的占比,又能像<a href=\"option.html#series-treemap\" target=\"_blank\">矩形树图</a>一样表现层级关系。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-monochrome&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n<h2 id=\"-\">引入相关文件</h2>\n<p>旭日图是 Apache ECharts (incubating)<sup>TM</sup> 4.0 新增的图表类型,从 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">CDN</a> 引入完整版的 <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js\" target=\"_blank\">echarts.min.js</a></p>\n<h2 id=\"-\">最简单的旭日图</h2>\n<p>创建旭日图需要在 <code class=\"codespan\">series</code> 配置项中声明类型为 <code class=\"codespan\">&#39;sunburst&#39;</code> 的系列,并且以树形结构声明其 <code class=\"codespan\">data</code>:</p>\n<pre><code class=\"lang-js\">var option = {\n    series: {\n        type: &#39;sunburst&#39;,\n        data: [{\n            name: &#39;A&#39;,\n            value: 10,\n            children: [{\n                value: 3,\n                name: &#39;Aa&#39;\n            }, {\n                value: 5,\n                name: &#39;Ab&#39;\n            }]\n        }, {\n            name: &#39;B&#39;,\n            children: [{\n                name: &#39;Ba&#39;,\n                value: 4\n            }, {\n                name: &#39;Bb&#39;,\n                value: 2\n            }]\n        }, {\n            name: &#39;C&#39;,\n            value: 3\n        }]\n    }\n};\n</code></pre>\n<p>得到以下结果:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-simple&edit=1&reset=1\" width=\"700\" height=\"400\" ></iframe>\n\n\n<h2 id=\"-\">颜色等样式调整</h2>\n<p>默认情况下会使用全局调色盘 <a href=\"option.html#color\" target=\"_blank\">color</a> 分配最内层的颜色,其余层则与其父元素同色。在旭日图中,扇形块的颜色有以下三种设置方式:</p>\n<ul>\n<li>在 <a href=\"option.html#series-sunburst.data.itemStyle\" target=\"_blank\">series.data.itemStyle</a> 中设置每个扇形块的样式;</li>\n<li>在 <a href=\"option.html#series-sunburst.levels.itemStyle\" target=\"_blank\">series.levels.itemStyle</a> 中设置每一层的样式;</li>\n<li>在 <a href=\"option.html#series-sunburst.itemStyle\" target=\"_blank\">series.itemStyle</a> 中设置整个旭日图的样式。</li>\n</ul>\n<p>上述三者的优先级是从高到低的,也就是说,配置了 <code class=\"codespan\">series.data.itemStyle</code> 的扇形块将会覆盖 <code class=\"codespan\">series.levels.itemStyle</code> 和 <code class=\"codespan\">series.itemStyle</code> 的设置。</p>\n<p>下面,我们将整体的颜色设为灰色 <code class=\"codespan\">&#39;#aaa&#39;</code>,将最内层的颜色设为蓝色 <code class=\"codespan\">&#39;blue&#39;</code>,将 <code class=\"codespan\">Aa</code>、<code class=\"codespan\">B</code> 这两块设为红色 <code class=\"codespan\">&#39;red&#39;</code>。</p>\n<pre><code class=\"lang-js\">var option = {\n    series: {\n        type: &#39;sunburst&#39;,\n        data: [{\n            name: &#39;A&#39;,\n            value: 10,\n            children: [{\n                value: 3,\n                name: &#39;Aa&#39;,\n                itemStyle: {\n                    color: &#39;red&#39;\n                }\n            }, {\n                value: 5,\n                name: &#39;Ab&#39;\n            }]\n        }, {\n            name: &#39;B&#39;,\n            children: [{\n                name: &#39;Ba&#39;,\n                value: 4\n            }, {\n                name: &#39;Bb&#39;,\n                value: 2\n            }],\n            itemStyle: {\n                color: &#39;red&#39;\n            }\n        }, {\n            name: &#39;C&#39;,\n            value: 3\n        }],\n        itemStyle: {\n            color: &#39;#aaa&#39;\n        },\n        levels: [{\n            // 留给数据下钻的节点属性\n        }, {\n            itemStyle: {\n                color: &#39;blue&#39;\n            }\n        }]\n    }\n};\n</code></pre>\n<p>效果为:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-color&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n\n<h2 id=\"-\">按层配置样式</h2>\n<p>旭日图是一种有层次的结构,为了方便同一层样式的配置,我们提供了 <a href=\"option.html#series-sunburst.levels\" target=\"_blank\">levels</a> 配置项。它是一个数组,其中的第 0 项表示数据下钻后返回上级的图形,其后的每一项分别表示从圆心向外层的层级。</p>\n<p>例如,假设我们没有数据下钻功能,并且希望将最内层的扇形块的颜色设为红色,文字设为蓝色,可以这样设置:</p>\n<pre><code class=\"lang-js\">series: {\n    // ...\n    levels: [\n        {\n            // 留给数据下钻点的空白配置\n        },\n        {\n            // 最靠内测的第一层\n            itemStyle: {\n                color: &#39;red&#39;\n            },\n            label: {\n                color: &#39;blue&#39;\n            }\n        },\n        {\n            // 第二层 ...\n        }\n    ]\n}\n</code></pre>\n<p>在实际使用的过程中,你会发现按层配置样式是一个很常用的功能,能够很大程度上提高配置的效率。</p>\n<h2 id=\"-\">数据下钻</h2>\n<p>旭日图默认支持数据下钻,也就是说,当点击了扇形块之后,将以该扇形块的数据作为根节点,便于进一步了解该数据的细节。</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-simple&edit=1&reset=1\" width=\"700\" height=\"500\" ></iframe>\n\n\n<p>当数据下钻后,中间会出现一个用于返回上一层的图形,该图形的样式可以通过 <a href=\"option.html#series-sunburst.levels\" target=\"_blank\">levels[0]</a> 配置。</p>\n<p>如果不需要数据下钻功能,可以通过将 <a href=\"option.html#series-sunburst.nodeClick\" target=\"_blank\">nodeClick</a> 设置为 <code class=\"codespan\">false</code> 关闭;或者将其设为 <code class=\"codespan\">&#39;link&#39;</code>,并将 <a href=\"option.html#series-sunburst.data.link\" target=\"_blank\">data.link</a> 设为点击扇形块对应打开的链接。</p>\n<h2 id=\"-\">高亮相关扇形块</h2>\n<p>旭日图支持鼠标移动到某扇形块时,高亮相关数据块的操作,可以通过设置 <a href=\"option.html#series-sunburst.highlightPolicy\" target=\"_blank\">highlightPolicy</a>,包括以下几种高亮方式:</p>\n<ul>\n<li><code class=\"codespan\">&#39;descendant&#39;</code>(默认值):高亮鼠标移动所在扇形块与其后代元素;</li>\n<li><code class=\"codespan\">&#39;ancestor&#39;</code>:高亮鼠标所在扇形块与其祖先元素;</li>\n<li><code class=\"codespan\">&#39;self&#39;</code>:仅高亮鼠标所在扇形块;</li>\n<li><code class=\"codespan\">&#39;none&#39;</code>:不会淡化(downplay)其他元素。</li>\n</ul>\n<p>上面提到的“高亮”,对于鼠标所在的扇形块,会使用 <code class=\"codespan\">emphasis</code> 样式;对于其他相关扇形块,则会使用 <code class=\"codespan\">highlight</code> 样式。通过这种方式,可以很方便地实现突出显示相关数据的需求。</p>\n<p>具体来说,对于配置项:</p>\n<pre><code class=\"lang-js\">itemStyle: {\n    color: &#39;yellow&#39;,\n    borderWidth: 2,\n    emphasis: {\n        color: &#39;red&#39;\n    },\n    highlight: {\n        color: &#39;orange&#39;\n    },\n    downplay: {\n        color: &#39;#ccc&#39;\n    }\n}\n</code></pre>\n<p><code class=\"codespan\">highlightPolicy</code> 为 <code class=\"codespan\">&#39;descendant&#39;</code> 或 <code class=\"codespan\">&#39;ancestor&#39;</code> 的效果分别为:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-highlight-descendant&edit=1&reset=1\" width=\"700\" height=\"350\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/sunburst-highlight-ancestor&edit=1&reset=1\" width=\"700\" height=\"350\" ></iframe>\n\n\n<h2 id=\"-\">总结</h2>\n<p>上面的教程主要讲述的是如何入门使用旭日图,感兴趣的用户可以在 <a href=\"option.html#series-sunburst\" target=\"_blank\">配置项手册</a> 查看更完整的文档。在灵活应用这些配置项之后,就能做出丰富多彩的旭日图了!</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-book&edit=1&reset=1\" width=\"700\" height=\"600\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=sunburst-drink&edit=1&reset=1\" width=\"700\" height=\"600\" ></iframe>\n\n\n\n\n\n\n\n\n"},"自定义系列":{"type":["*"],"description":"<p><a href=\"option.html#series-custom\" target=\"_blank\">自定义系列(custom series)</a>,是一种系列的类型。它把绘制图形元素这一步留给开发者去做,从而开发者能在坐标系中自由绘制出自己需要的图表。</p>\n<p>Apache ECharts (incubating)<sup>TM</sup> 为什么会要支持 <code class=\"codespan\">自定义系列</code> 呢?</p>\n<p>ECharts 内置支持的图表类型是最常见的图表类型,但是图表类型是难于穷举的,有很多小众的需求 echarts 并不能内置的支持。那么就需要提供一种方式来让开发者自己扩展。另一方面,所提供的扩展方式要尽可能得简单,例如图形元素创建和释放、过渡动画、tooltip、<a href=\"option.html#dataZoom\" target=\"_blank\">数据区域缩放(dataZoom)</a>、<a href=\"option.html#visualMap\" target=\"_blank\">视觉映射(visualMap)</a>等功能,尽量在 ECharts 中内置得处理,使开发者不必纠结于这些细节。综上考虑形成了 <a href=\"option.html#series-custom\" target=\"_blank\">自定义系列(custom series)</a>。</p>\n<p><strong>例如,下面的例子使用 custom series 扩展出了 x-range 图:</strong></p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=custom-profile&reset=1&edit=1\" width=\"800\" height=\"500\" ></iframe>\n\n\n<p><strong>更多的例子参见:<a href=\"https://echarts.apache.org/examples/zh/index.html#chart-type-custom\" target=\"_blank\">custom examples</a></strong></p>\n<p>下面来介绍开发者怎么使用 <a href=\"option.html#series-custom\" target=\"_blank\">自定义系列(custom series)</a>。</p>\n<h2 id=\"-renderitem-\">(一)renderItem 方法</h2>\n<p>开发者自定义的图形元素渲染逻辑,是通过书写 <code class=\"codespan\">renderItem</code> 函数实现的,例如:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // ...\n        },\n        data: data\n    }]\n}\n</code></pre>\n<p>在渲染阶段,对于 <a href=\"option.html#series-custom.data\" target=\"_blank\">series.data</a> 中的每个数据项(为方便描述,这里称为 <code class=\"codespan\">dataItem</code>),会调用此 <a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数。这个 <code class=\"codespan\">renderItem</code> 函数的职责,就是返回一个(或者一组)<code class=\"codespan\">图形元素定义</code>,<code class=\"codespan\">图形元素定义</code> 中包括图形元素的类型、位置、尺寸、样式等。echarts 会根据这些 <code class=\"codespan\">图形元素定义</code> 来渲染出图形元素。如下的示意:</p>\n<pre><code class=\"lang-js\">var option = {\n    ...,\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function (params, api) {\n            // 对于 data 中的每个 dataItem,都会调用这个 renderItem 函数。\n            // (但是注意,并不一定是按照 data 的顺序调用)\n\n            // 这里进行一些处理,例如,坐标转换。\n            // 这里使用 api.value(0) 取出当前 dataItem 中第一个维度的数值。\n            var categoryIndex = api.value(0);\n            // 这里使用 api.coord(...) 将数值在当前坐标系中转换成为屏幕上的点的像素值。\n            var startPoint = api.coord([api.value(1), categoryIndex]);\n            var endPoint = api.coord([api.value(2), categoryIndex]);\n            // 这里使用 api.size(...) 获得 Y 轴上数值范围为 1 的一段所对应的像素长度。\n            var height = api.size([0, 1])[1] * 0.6;\n\n            // shape 属性描述了这个矩形的像素位置和大小。\n            // 其中特殊得用到了 echarts.graphic.clipRectByRect,意思是,\n            // 如果矩形超出了当前坐标系的包围盒,则剪裁这个矩形。\n            // 如果矩形完全被剪掉,会返回 undefined.\n            var rectShape = echarts.graphic.clipRectByRect({\n                // 矩形的位置和大小。\n                x: startPoint[0],\n                y: startPoint[1] - height / 2,\n                width: endPoint[0] - startPoint[0],\n                height: height\n            }, {\n                // 当前坐标系的包围盒。\n                x: params.coordSys.x,\n                y: params.coordSys.y,\n                width: params.coordSys.width,\n                height: params.coordSys.height\n            });\n\n            // 这里返回为这个 dataItem 构建的图形元素定义。\n            return rectShape &amp;&amp; {\n                // 表示这个图形元素是矩形。还可以是 &#39;circle&#39;, &#39;sector&#39;, &#39;polygon&#39; 等等。\n                type: &#39;rect&#39;,\n                shape: rectShape,\n                // 用 api.style(...) 得到默认的样式设置。这个样式设置包含了\n                // option 中 itemStyle 的配置和视觉映射得到的颜色。\n                style: api.style()\n            };\n        },\n        data: [\n            [12, 44, 55, 60], // 这是第一个 dataItem\n            [53, 31, 21, 56], // 这是第二个 dataItem\n            [71, 33, 10, 20], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n}\n</code></pre>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数提供了两个参数:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">params</a>:包含了当前数据信息(如 <code class=\"codespan\">seriesIndex</code>、<code class=\"codespan\">dataIndex</code> 等等)和坐标系的信息(如坐标系包围盒的位置和尺寸)。</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">api</a>:是一些开发者可调用的方法集合(如 <code class=\"codespan\">api.value()</code>、<code class=\"codespan\">api.coord()</code>)。</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数须返回根据此 <code class=\"codespan\">dataItem</code> 绘制出的图形元素的定义信息,参见 <a href=\"option.html#series-custom.renderItem.return\" target=\"_blank\">renderItem.return</a>。</p>\n<p>一般来说,<a href=\"option.html#series-custom.renderItem\" target=\"_blank\">renderItem</a> 函数的主要逻辑,是将 <code class=\"codespan\">dataItem</code> 里的值映射到坐标系上的图形元素。这一般需要用到 <a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> 中的两个函数:</p>\n<ul>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.value\" target=\"_blank\">api.value(...)</a>,意思是取出 <code class=\"codespan\">dataItem</code> 中的数值。例如 <code class=\"codespan\">api.value(0)</code> 表示取出当前 <code class=\"codespan\">dataItem</code> 中第一个维度的数值。</li>\n<li><a href=\"option.html#series-custom.renderItem.arguments.api.coord\" target=\"_blank\">api.coord(...)</a>,意思是进行坐标转换计算。例如 <code class=\"codespan\">var point = api.coord([api.value(0), api.value(1)])</code> 表示 <code class=\"codespan\">dataItem</code> 中的数值转换成坐标系上的点。</li>\n</ul>\n<p>有时候还需要用到 <a href=\"option.html#series-custom.renderItem.arguments.api.size\" target=\"_blank\">api.size(...)</a> 函数,表示得到坐标系上一段数值范围对应的长度。</p>\n<p>返回值中样式的设置可以使用 <a href=\"option.html#series-custom.renderItem.arguments.api.style\" target=\"_blank\">api.style(...)</a> 函数,他能得到 <a href=\"option.html#series-custom.itemStyle\" target=\"_blank\">series.itemStyle</a> 中定义的样式信息,以及视觉映射的样式信息。也可以用这种方式覆盖这些样式信息:<code class=\"codespan\">api.style({fill: &#39;green&#39;, stroke: &#39;yellow&#39;})</code>。</p>\n<p>书写完 <code class=\"codespan\">renderItem</code> 方法后,自定义系列的 90% 工作就做完了。剩下的是一些精化工作。</p>\n<h2 id=\"-\">(二)使坐标轴的范围自适应数据范围</h2>\n<p>在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系(grid)</a>、<a href=\"option.html#polar\" target=\"_blank\">极坐标系(polar)</a> 中都有坐标轴。坐标轴的刻度范围需要自适应当前显示出的数据的范围,否则绘制出的图形会超出去。所以,例如,在 <a href=\"option.html#grid\" target=\"_blank\">直角坐标系(grid)</a> 中,使用自定义系列的开发者,需要设定,<code class=\"codespan\">data</code> 中的哪些维度会对应到 <code class=\"codespan\">x</code> 轴上,哪些维度会对应到 <code class=\"codespan\">y</code> 轴上。这件事通过 <a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a> 来设定。例如:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            // data 中『维度1』和『维度2』对应到 X 轴\n            x: [1, 2],\n            // data 中『维度0』对应到 Y 轴\n            y: 0\n        },\n        data: [\n            // 维度0  维度1  维度2  维度3\n            [   12,   44,   55,   60   ], // 这是第一个 dataItem\n            [   53,   31,   21,   56   ], // 这是第二个 dataItem\n            [   71,   33,   10,   20   ], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n};\n</code></pre>\n<h2 id=\"-tooltip\">(三)设定 tooltip</h2>\n<p>当然,使用 <a href=\"option.html#tooltip.formatter\" target=\"_blank\">tooltip.formatter</a> 可以任意定制 tooltip 中的内容。但是还有更简单的方法,通过<a href=\"option.html#series-custom.encode\" target=\"_blank\">encode</a> 和 <a href=\"option.html#series-custom.dimensions\" target=\"_blank\">dimensions</a> 来设定:</p>\n<pre><code class=\"lang-js\">option = {\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            x: [1, 2],\n            y: 0,\n            // 表示『维度2』和『维度3』要显示到 tooltip 中。\n            tooltip: [2, 3]\n        },\n        // 表示给『维度2』和『维度3』分别取名为『年龄』和『满意度』,显示到 tooltip 中。\n        dimensions: [null, null, &#39;年龄&#39;, &#39;满意度&#39;],\n        data: [\n            // 维度0  维度1  维度2  维度3\n            [   12,   44,   55,   60   ], // 这是第一个 dataItem\n            [   53,   31,   21,   56   ], // 这是第二个 dataItem\n            [   71,   33,   10,   20   ], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p><br>\n<br>\n<br></p>\n<hr>\n<p>上面,一个简单的 custome series 例子完成了。</p>\n<p>下面介绍几个其他细节要点。</p>\n<h2 id=\"-\">(四)超出坐标系范围的截取</h2>\n<p>与 <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a> 结合使用的时候,常常使用会设置 <a href=\"option.html#dataZoom.filterMode\" target=\"_blank\">dataZoom.filterMode</a> 为 &#39;weakFilter&#39;。这个设置的意思是:当 <code class=\"codespan\">dataItem</code> 部分超出坐标系边界的时候,<code class=\"codespan\">dataItem</code> 不会整体被过滤掉。例如:</p>\n<pre><code class=\"lang-js\">option = {\n    dataZoom: {\n        xAxisIndex: 0,\n        filterMode: &#39;weakFilter&#39;\n    },\n    series: [{\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            ...\n        },\n        encode: {\n            // data 中『维度1』和『维度2』对应到 X 轴\n            x: [1, 2],\n            y: 0\n        },\n        data: [\n            // 维度0  维度1  维度2  维度3\n            [   12,   44,   55,   60   ], // 这是第一个 dataItem\n            [   53,   31,   21,   56   ], // 这是第二个 dataItem\n            [   71,   33,   10,   20   ], // 这是第三个 dataItem\n            ...\n        ]\n    }]\n};\n</code></pre>\n<p>在这个例子中,『维度1』和『维度2』对应到 X 轴,<code class=\"codespan\">dataZoom</code> 组件控制 X 轴的缩放。假如在缩放的过程中,某个 dataItem 的『维度1』超出了 X 轴的范围,『维度2』还在 X 轴的范围中,那么只要设置 <code class=\"codespan\">dataZoom.filterMode = &#39;weakFilter&#39;</code>,这个 dataItem 就不会被过滤掉,从而还能够使用 <code class=\"codespan\">renderItem</code> 绘制图形(可以使用上面提到过的 <code class=\"codespan\">echarts.graphic.clipRectByRect</code> 把图形绘制成被坐标系剪裁过的样子)。参见上面提到过的例子:<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-profile\" target=\"_blank\">Profile</a></p>\n<h2 id=\"-dataindex\">(五)关于 dataIndex</h2>\n<p>开发者如果使用到的话应注意,<a href=\"option.html#series-custom.renderItem.arguments.params\" target=\"_blank\">renderItem.arguments.params</a> 中的 <code class=\"codespan\">dataIndex</code> 和 <code class=\"codespan\">dataIndexInside</code> 是有区别的:</p>\n<ul>\n<li><code class=\"codespan\">dataIndex</code> 指的 <code class=\"codespan\">dataItem</code> 在原始数据中的 index。</li>\n<li><code class=\"codespan\">dataIndexInside</code> 指的是 <code class=\"codespan\">dataItem</code> 在当前数据窗口(参见 <a href=\"option.html#dataZoom\" target=\"_blank\">dataZoom</a>)中的 index。</li>\n</ul>\n<p><a href=\"option.html#series-custom.renderItem.arguments.api\" target=\"_blank\">renderItem.arguments.api</a> 中使用的参数都是 <code class=\"codespan\">dataIndexInside</code> 而非 <code class=\"codespan\">dataIndex</code>,因为从 <code class=\"codespan\">dataIndex</code> 转换成 <code class=\"codespan\">dataIndexInside</code> 需要时间开销。</p>\n<h2 id=\"-\">(六)事件监听</h2>\n<pre><code class=\"lang-js\">chart.setOption({\n    // ...\n    series: {\n        type: &#39;custom&#39;,\n        renderItem: function () {\n            // ...\n            return {\n                type: &#39;group&#39;,\n                children: [{\n                    type: &#39;circle&#39;\n                    // ...\n                }, {\n                    type: &#39;circle&#39;,\n                    name: &#39;aaa&#39;,\n                    // 用户指定的信息,可以在 event handler 访问到。\n                    info: 12345,\n                    // ...\n                }]\n            };\n        }\n    }\n});\nchart.on(&#39;click&#39;, {element: &#39;aaa&#39;}, function (params) {\n    // 当 name 为 &#39;aaa&#39; 的图形元素被点击时,此回调被触发。\n    console.log(params.info);\n});\n</code></pre>\n<h2 id=\"-\">(七)自定义矢量图形</h2>\n<p>自定义系列能支持使用 <a href=\"http://www.w3.org/TR/SVG/paths.html#PathData\" target=\"_blank\">SVG PathData</a> 定义矢量路径。从而可以使用矢量图工具中做出的图形。参见:<a href=\"option.html#series-custom.renderItem.return_path\" target=\"_blank\">path</a>,以及例子:<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-calendar-icon\" target=\"_blank\">icons</a> 和 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=custom-gantt-flight\" target=\"_blank\">shapes</a>。</p>\n<p><br></p>\n<p><strong>更多的自定义系列的例子参见:<a href=\"https://echarts.apache.org/examples/zh/index.html#chart-type-custom\" target=\"_blank\">custom examples</a></strong></p>\n"},"富文本标签":{"type":["*"],"description":"<p>在许多地方(如图、轴的标签等)都可以使用富文本标签。例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=treemap-obama&edit=1&reset=1\" width=\"800\" height=\"550\" ></iframe>\n\n\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-rich-text&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<p><br></p>\n<p>其他一些例子:\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=map-labels&amp;edit=1&amp;reset=1\" target=\"_blank\">Map Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=pie-nest&amp;edit=1&amp;reset=1\" target=\"_blank\">Pie Labels</a>,\n<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=gauge-car&amp;edit=1&amp;reset=1\" target=\"_blank\">Gauge</a>.</p>\n<p><br></p>\n<p>原先 Apache ECharts (incubating)<sup>TM</sup> 中的文本标签,只能对整块统一进行样式设置,并且仅仅支持颜色和字体的设置,从而导致不易于制作表达能力更强的文字描述信息。</p>\n<p>echarts v3.7 以后,支持了富文本标签,能够:</p>\n<ul>\n<li>定制文本块整体的样式(如背景、边框、阴影等)、位置、旋转等。</li>\n<li>对文本块中个别片段定义样式(如颜色、字体、高宽、背景、阴影等)、对齐方式等。</li>\n<li>在文本中使用图片做小图标或者背景。</li>\n<li>特定组合以上的规则,可以做出简单表格、分割线等效果。</li>\n</ul>\n<p>开始下面的介绍之前,先说明一下下面会使用的两个名词的含义:</p>\n<ul>\n<li>文本块(Text Block):文本标签块整体。</li>\n<li>文本片段(Text fragment):文本标签块中的部分文本。</li>\n</ul>\n<p>如下图示例:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-block-fragment&edit=1&reset=1\" width=\"340\" height=\"240\" ></iframe>\n\n\n\n<h2 id=\"-\">文本样式相关的配置项</h2>\n<p>echarts 提供了丰富的文本标签配置项,包括:</p>\n<ul>\n<li>字体基本样式设置:<code class=\"codespan\">fontStyle</code>、<code class=\"codespan\">fontWeight</code>、<code class=\"codespan\">fontSize</code>、<code class=\"codespan\">fontFamily</code>。</li>\n<li>文字颜色:<code class=\"codespan\">color</code>。</li>\n<li>文字描边:<code class=\"codespan\">textBorderColor</code>、<code class=\"codespan\">textBorderWidth</code>。</li>\n<li>文字阴影:<code class=\"codespan\">textShadowColor</code>、<code class=\"codespan\">textShadowBlur</code>、<code class=\"codespan\">textShadowOffsetX</code>、<code class=\"codespan\">textShadowOffsetY</code>。</li>\n<li>文本块或文本片段大小:<code class=\"codespan\">lineHeight</code>、<code class=\"codespan\">width</code>、<code class=\"codespan\">height</code>、<code class=\"codespan\">padding</code>。</li>\n<li>文本块或文本片段的对齐:<code class=\"codespan\">align</code>、<code class=\"codespan\">verticalAlign</code>。</li>\n<li>文本块或文本片段的边框、背景(颜色或图片):<code class=\"codespan\">backgroundColor</code>、<code class=\"codespan\">borderColor</code>、<code class=\"codespan\">borderWidth</code>、<code class=\"codespan\">borderRadius</code>。</li>\n<li>文本块或文本片段的阴影:<code class=\"codespan\">shadowColor</code>、<code class=\"codespan\">shadowBlur</code>、<code class=\"codespan\">shadowOffsetX</code>、<code class=\"codespan\">shadowOffsetY</code>。</li>\n<li>文本块的位置和旋转:<code class=\"codespan\">position</code>、<code class=\"codespan\">distance</code>、<code class=\"codespan\">rotate</code>。</li>\n</ul>\n<p>可以在各处的 <code class=\"codespan\">rich</code> 属性中定义文本片段样式。例如 <a href=\"option.html#series-bar.label.rich\" target=\"_blank\">series-bar.label.rich</a></p>\n<p>例如:</p>\n<pre><code class=\"lang-js\">label: {\n    // 在文本中,可以对部分文本采用 rich 中定义样式。\n    // 这里需要在文本中使用标记符号:\n    // `{styleName|text content text content}` 标记样式名。\n    // 注意,换行仍是使用 &#39;\\n&#39;。\n    formatter: [\n        &#39;{a|这段文本采用样式a}&#39;,\n        &#39;{b|这段文本采用样式b}这段用默认样式{x|这段用样式x}&#39;\n    ].join(&#39;\\n&#39;),\n\n    // 这里是文本块的样式设置:\n    color: &#39;#333&#39;,\n    fontSize: 5,\n    fontFamily: &#39;Arial&#39;,\n    borderWidth: 3,\n    backgroundColor: &#39;#984455&#39;,\n    padding: [3, 10, 10, 5],\n    lineHeight: 20,\n\n    // rich 里是文本片段的样式设置:\n    rich: {\n        a: {\n            color: &#39;red&#39;,\n            lineHeight: 10\n        },\n        b: {\n            backgroundColor: {\n                image: &#39;xxx/xxx.jpg&#39;\n            },\n            height: 40\n        },\n        x: {\n            fontSize: 18,\n            fontFamily: &#39;Microsoft YaHei&#39;,\n            borderColor: &#39;#449933&#39;,\n            borderRadius: 4\n        },\n        ...\n    }\n}\n</code></pre>\n<blockquote>\n<p>注意:如果不定义 <code class=\"codespan\">rich</code>,不能指定文字块的 <code class=\"codespan\">width</code> 和 <code class=\"codespan\">height</code>。</p>\n</blockquote>\n<h2 id=\"-\">文本、文本框、文本片段的基本样式和装饰</h2>\n<p>每个文本可以设置基本的字体样式:<code class=\"codespan\">fontStyle</code>、<code class=\"codespan\">fontWeight</code>、<code class=\"codespan\">fontSize</code>、<code class=\"codespan\">fontFamily</code>。</p>\n<p>可以设置文字的颜色 <code class=\"codespan\">color</code> 和边框的颜色 <code class=\"codespan\">textBorderColor</code>、<code class=\"codespan\">textBorderWidth</code>。</p>\n<p>文本框可以设置边框和背景的样式:<code class=\"codespan\">borderColor</code>、<code class=\"codespan\">borderWidth</code>、<code class=\"codespan\">backgroundColor</code>、<code class=\"codespan\">padding</code>。</p>\n<p>文本片段也可以设置边框和背景的样式:<code class=\"codespan\">borderColor</code>、<code class=\"codespan\">borderWidth</code>、<code class=\"codespan\">backgroundColor</code>、<code class=\"codespan\">padding</code>。</p>\n<p>例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-options&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n\n<h2 id=\"-\">标签的位置</h2>\n<p>对于折线图、柱状图、散点图等,均可以使用 <code class=\"codespan\">label</code> 来设置标签。标签的相对于图形元素的位置,一般使用 <a href=\"option.html#series-scatter.label.position\" target=\"_blank\">label.position</a>、<a href=\"option.html#series-scatter.label.distance\" target=\"_blank\">label.distance</a> 来配置。</p>\n<p>例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/label-position&edit=1&reset=1\" width=\"800\" height=\"400\" ></iframe>\n\n\n<blockquote>\n<p>注意:<code class=\"codespan\">position</code> 在不同的图中可取值有所不同。<code class=\"codespan\">distance</code> 并不是在每个图中都支持。详情请参见 <a href=\"option.html\" target=\"_blank\">option 文档</a>。</p>\n</blockquote>\n<h2 id=\"-\">标签的旋转</h2>\n<p>某些图中,为了能有足够长的空间来显示标签,需要对标签进行旋转。例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=bar-label-rotation&edit=1&reset=1\" width=\"900\" height=\"500\" ></iframe>\n\n\n<p>这种场景下,可以结合 <a href=\"option.html#series-bar.label.align\" target=\"_blank\">align</a> 和 <a href=\"option.html#series-bar.label.verticalAlign\" target=\"_blank\">verticalAlign</a> 来调整标签位置。</p>\n<p>注意,逻辑是,先使用 <code class=\"codespan\">align</code> 和 <code class=\"codespan\">verticalAlign</code> 定位,再旋转。</p>\n<h2 id=\"-\">文本片段的排版和对齐</h2>\n<p>关于排版方式,每个文本片段,可以想象成 CSS 中的 <code class=\"codespan\">inline-block</code>,在文档流中按行放置。</p>\n<p>每个文本片段的内容盒尺寸(<code class=\"codespan\">content box size</code>),默认是根据文字大小决定的。但是,也可以设置 <code class=\"codespan\">width</code>、<code class=\"codespan\">height</code> 来强制指定,虽然一般不会这么做(参见下文)。文本片段的边框盒尺寸(<code class=\"codespan\">border box size</code>),由上述本身尺寸,加上文本片段的 <code class=\"codespan\">padding</code> 来得到。</p>\n<p>只有 <code class=\"codespan\">&#39;\\n&#39;</code> 是换行符,能导致换行。</p>\n<p>一行内,会有多个文本片段。每行的实际高度,由 <code class=\"codespan\">lineHeight</code> 最大的文本片段决定。文本片段的 <code class=\"codespan\">lineHeight</code> 可直接在 <code class=\"codespan\">rich</code> 中指定,也可以在 <code class=\"codespan\">rich</code> 的父层级中统一指定而采用到 <code class=\"codespan\">rich</code> 的所有项中,如果都不指定,则取文本片段的边框盒尺寸(<code class=\"codespan\">border box size</code>)。</p>\n<p>在一行的 <code class=\"codespan\">lineHeight</code> 被决定后,一行内,文本片段的竖直位置,由文本片段的 <code class=\"codespan\">verticalAlign</code> 来指定(这里和 CSS 中的规则稍有不同):</p>\n<ul>\n<li><code class=\"codespan\">&#39;bottom&#39;</code>:文本片段的盒的底边贴住行底。</li>\n<li><code class=\"codespan\">&#39;top&#39;</code>:文本片段的盒的顶边贴住行顶。</li>\n<li><code class=\"codespan\">&#39;middle&#39;</code>:居行中。</li>\n</ul>\n<p>文本块的宽度,可以直接由文本块的 <code class=\"codespan\">width</code> 指定,否则,由最长的行决定。宽度决定后,在一行中进行文本片段的放置。文本片段的 <code class=\"codespan\">align</code> 决定了文本片段在行中的水平位置:</p>\n<ul>\n<li>首先,从左向右连续紧靠放置 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;left&#39;</code> 的文本片段盒。</li>\n<li>然后,从右向左连续紧靠放置 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;right&#39;</code> 的文本片段盒。</li>\n<li>最后,剩余的没处理的文本片段盒,紧贴着,在中间剩余的区域中居中放置。</li>\n</ul>\n<p>关于文字在文本片段盒中的位置:</p>\n<ul>\n<li>如果 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;center&#39;</code>,则文字在文本片段盒中是居中的。</li>\n<li>如果 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;left&#39;</code>,则文字在文本片段盒中是居左的。</li>\n<li>如果 <code class=\"codespan\">align</code> 为 <code class=\"codespan\">&#39;right&#39;</code>,则文字在文本片段盒中是居右的。</li>\n</ul>\n<p>例如:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/text-fragment-align&edit=1&reset=1\" width=\"800\" height=\"220\" ></iframe>\n\n\n\n<h2 id=\"-\">特殊效果:图标、分割线、标题块、简单表格</h2>\n<p>看下面的例子:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/title-block&edit=1&reset=1\" width=\"600\" height=\"400\" ></iframe>\n\n\n<p>文本片段的 <code class=\"codespan\">backgroundColor</code> 可以指定为图片后,就可以在文本中使用图标了:</p>\n<pre><code class=\"lang-js\">rich: {\n    Sunny: {\n        // 这样设定 backgroundColor 就可以是图片了。\n        backgroundColor: {\n            image: &#39;./data/asset/img/weather/sunny_128.png&#39;\n        },\n        // 可以只指定图片的高度,从而图片的宽度根据图片的长宽比自动得到。\n        height: 30\n    }\n}\n</code></pre>\n<p>分割线实际是用 border 实现的:</p>\n<pre><code class=\"lang-js\">rich: {\n    hr: {\n        borderColor: &#39;#777&#39;,\n        // 这里把 width 设置为 &#39;100%&#39;,表示分割线的长度充满文本块。\n        // 注意,这里是文本块内容盒(content box)的 100%,而不包含 padding。\n        // 虽然这和 CSS 相关的定义有所不同,但是在这类场景中更加方便。\n        width: &#39;100%&#39;,\n        borderWidth: 0.5,\n        height: 0\n    }\n}\n</code></pre>\n<p>标题块是使用 <code class=\"codespan\">backgroundColor</code> 实现的:</p>\n<pre><code class=\"lang-js\">// 标题文字居左\nformatter: &#39;{titleBg|Left Title}&#39;,\nrich: {\n    titleBg: {\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n\n// 标题文字居中。\n// 这个实现有些 tricky,但是,能够不引入更复杂的排版规则而实现这个效果。\nformatter: &#39;{tc|Center Title}{titleBg|}&#39;,\nrich: {\n    titleBg: {\n        align: &#39;right&#39;,\n        backgroundColor: &#39;#000&#39;,\n        height: 30,\n        borderRadius: [5, 5, 0, 0],\n        padding: [0, 10, 0, 10],\n        width: &#39;100%&#39;,\n        color: &#39;#eee&#39;\n    }\n}\n</code></pre>\n<p>简单表格的设定,其实就是给不同行上纵向对应的文本片段设定同样的宽度就可以了。参见本文最开始的 <a href=\"https://echarts.apache.org/examples/zh/view.html?c=pie-rich-text&amp;edit=1&amp;reset=1\" target=\"_blank\">例子</a>。</p>\n"},"服务端渲染":{"type":["*"],"description":"<p>Apache ECharts (incubating)<sup>TM</sup> 可以在服务端进行渲染。例如 <a href=\"https://echarts.apache.org/examples/zh/index.html\" target=\"_blank\">官方示例</a> 里的一个个小截图,就是在服务端预生成出来的。</p>\n<p>服务端渲染可以使用流行的 headless 环境,例如 <a href=\"https://github.com/GoogleChrome/puppeteer\" target=\"_blank\">puppeteer</a>、<a href=\"https://chromium.googlesource.com/chromium/src/+/lkgr/headless/README.md\" target=\"_blank\">headless chrome</a>、<a href=\"https://github.com/Automattic/node-canvas\" target=\"_blank\">node-canvas</a>、<a href=\"https://github.com/jsdom/jsdom\" target=\"_blank\">jsdom</a>、<a href=\"http://phantomjs.org/\" target=\"_blank\">PhantomJS</a> 等。</p>\n<p>这是一些社区贡献的 echarts 服务端渲染方案:</p>\n<ul>\n<li><a href=\"https://github.com/hellosean1025/node-echarts\" target=\"_blank\">https://github.com/hellosean1025/node-echarts</a></li>\n<li><a href=\"https://github.com/chfw/echarts-scrappeteer\" target=\"_blank\">https://github.com/chfw/echarts-scrappeteer</a></li>\n<li><a href=\"https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js\" target=\"_blank\">https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js</a></li>\n<li><a href=\"https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73\" target=\"_blank\">https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73</a></li>\n</ul>\n"},"使用 Canvas 或者 SVG 渲染":{"type":["*"],"description":"<p>浏览器端图表库大多会选择 SVG 或者 Canvas 进行渲染。对于绘制图表来说,这两种技术往往是可替换的,效果相近。但是在一些场景中,他们的表现和能力又有一定差异。于是,对它们的选择取舍,就成为了一个一直存在的不易有标准答案的话题。</p>\n<p>Apache ECharts (incubating)<sup>TM</sup> 从初始一直使用 Canvas 绘制图表(除了对 IE8- 使用 VML)。而 <a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">ECharts v4.0</a> 发布了 SVG 渲染器,从而提供了一种新的选择。只须在初始化一个图表实例时,设置 <a href=\"api.html#echarts.init\" target=\"_blank\">renderer 参数</a> 为 <code class=\"codespan\">&#39;canvas&#39;</code> 或 <code class=\"codespan\">&#39;svg&#39;</code> 即可指定渲染器,比较方便。</p>\n<blockquote>\n<p>SVG 和 Canvas 这两种使用方式差异很大的技术,能够做到同时被透明支持,主要归功于 ECharts 底层库 <a href=\"https://github.com/ecomfe/zrender\" target=\"_blank\">ZRender</a> 的抽象和实现,形成可互换的 SVG 渲染器和 Canvas 渲染器。</p>\n</blockquote>\n<h2 id=\"-\">选择哪种渲染器</h2>\n<p>一般来说,Canvas 更适合绘制图形元素数量非常大(这一般是由数据量大导致)的图表(如热力图、地理坐标系或平行坐标系上的大规模线图或散点图等),也利于实现某些视觉 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=lines-bmap-effect\" target=\"_blank\">特效</a>。但是,在不少场景中,SVG 具有重要的优势:它的内存占用更低(这对移动端尤其重要)、渲染性能略高、并且用户使用浏览器内置的缩放功能时不会模糊。例如,我们在一些硬件环境中分别使用 Canvas 渲染器和 SVG 渲染器绘制中等数据量的折、柱、饼,统计初始动画阶段的帧率,得到了一个性能对比图:</p>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/canvas-vs-svg&reset=1\" width=\"90%\" height=\"400\" ></iframe>\n\n\n<p>上图显示出,在这些场景中,SVG 渲染器相比 Canvas 渲染器在移动端的总体表现更好。当然,这个实验并非是全面的评测,在另一些数据量较大或者有图表交互动画的场景中,目前的 SVG 渲染器的性能还比不过 Canvas 渲染器。但是同时有这两个选项,为开发者们根据自己的情况优化性能提供了更广阔的空间。</p>\n<p>选择哪种渲染器,我们可以根据软硬件环境、数据量、功能需求综合考虑。</p>\n<ul>\n<li>在软硬件环境较好,数据量不大的场景下(例如 PC 端做商务报表),两种渲染器都可以适用,并不需要太多纠结。</li>\n<li>在环境较差,出现性能问题需要优化的场景下,可以通过试验来确定使用哪种渲染器。比如有这些经验:<ul>\n<li>在须要创建很多 ECharts 实例且浏览器易崩溃的情况下(可能是因为 Canvas 数量多导致内存占用超出手机承受能力),可以使用 SVG 渲染器来进行改善。大略得说,如果图表运行在低端安卓机,或者我们在使用一些特定图表如 <a href=\"https://ecomfe.github.io/echarts-liquidfill/example/\" target=\"_blank\">水球图</a> 等,SVG 渲染器可能效果更好。</li>\n<li>数据量很大、较多交互时,可以选用 Canvas 渲染器。</li>\n</ul>\n</li>\n</ul>\n<p>我们强烈欢迎开发者们 <a href=\"https://github.com/apache/incubator-echarts/issues/new\" target=\"_blank\">反馈</a> 给我们使用的体验和场景,帮助我们更好的做优化。</p>\n<p>注:除了某些特殊的渲染可能依赖 Canvas:如<a href=\"option.html#series-lines.effect\" target=\"_blank\">炫光尾迹特效</a>、<a href=\"https://echarts.apache.org/examples/zh/editor.html?c=heatmap-bmap\" target=\"_blank\">带有混合效果的热力图</a>等,绝大部分功能 SVG 都是支持的。此外,目前的 SVG 版中,富文本、材质功能尚未实现。</p>\n<h2 id=\"-\">如何使用渲染器</h2>\n<p>ECharts 默认使用 Canvas 渲染。如果想使用 SVG 渲染,ECharts 代码中须包括有 SVG 渲染器模块。</p>\n<ul>\n<li>ECharts 的 <a href=\"https://www.jsdelivr.com/package/npm/echarts\" target=\"_blank\">预构建文件</a> 中,<a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.common.min.js\" target=\"_blank\">常用版</a> 和 <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js\" target=\"_blank\">完整版</a> 已经包含了 SVG 渲染器,可直接使用。而 <a href=\"https://cdn.jsdelivr.net/npm/echarts/dist/echarts.simple.min.js\" target=\"_blank\">精简版</a> 没有包括。</li>\n<li>如果 <a href=\"https://echarts.apache.org/zh/builder.html\" target=\"_blank\">在线自定义构建 ECharts</a>,则需要勾上页面下方的 “SVG 渲染”。</li>\n<li>如果 <a href=\"tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts\" target=\"_blank\">线下自定义构建 ECharts</a>,则须引入 SVG 渲染器模块,即:</li>\n</ul>\n<pre><code class=\"lang-js\">import &#39;zrender/lib/svg/svg&#39;;\n</code></pre>\n<p>然后,我们就可以在代码中,初始化图表实例时,<a href=\"api.html#echarts.init\" target=\"_blank\">传入参数</a> 选择渲染器类型:</p>\n<pre><code class=\"lang-js\">// 使用 Canvas 渲染器(默认)\nvar chart = echarts.init(containerDom, null, {renderer: &#39;canvas&#39;});\n// 等价于:\nvar chart = echarts.init(containerDom);\n\n// 使用 SVG 渲染器\nvar chart = echarts.init(containerDom, null, {renderer: &#39;svg&#39;});\n</code></pre>\n"},"在图表中支持无障碍访问":{"type":["*"],"description":"<p>W3C 制定了无障碍富互联网应用规范集(<a href=\"https://www.w3.org/WAI/intro/aria\" target=\"_blank\">WAI-ARIA</a>,the Accessible Rich Internet Applications Suite),致力于使得网页内容和网页应用能够被更多残障人士访问。Apache ECharts (incubating)<sup>TM</sup> 4.0 遵从这一规范,支持自动根据图表配置项智能生成描述,使得盲人可以在朗读设备的帮助下了解图表内容,让图表可以被更多人群访问。</p>\n<p>默认关闭,需要通过将 <a href=\"option.html#aria.show\" target=\"_blank\">aria.show</a> 设置为 <code class=\"codespan\">true</code> 开启。开启后,会根据图表、数据、标题等情况,自动智能生成关于图表的描述,用户也可以通过配置项修改描述。</p>\n<p>对于配置项:</p>\n<pre><code class=\"lang-js\">option = {\n    aria: {\n        show: true\n    },\n    title: {\n        text: &#39;某站点用户访问来源&#39;,\n        x: &#39;center&#39;\n    },\n    series: [\n        {\n            name: &#39;访问来源&#39;,\n            type: &#39;pie&#39;,\n            data: [\n                { value: 335, name: &#39;直接访问&#39; },\n                { value: 310, name: &#39;邮件营销&#39; },\n                { value: 234, name: &#39;联盟广告&#39; },\n                { value: 135, name: &#39;视频广告&#39; },\n                { value: 1548, name: &#39;搜索引擎&#39; }\n            ]\n        }\n    ]\n};\n</code></pre>\n<iframe data-src=\"https://echarts.apache.org/examples/zh/view.html?c=doc-example/aria-pie&edit=1&reset=1\" width=\"700\" height=\"300\" ></iframe>\n\n\n<p>生成的图表 DOM 上,会有一个 <code class=\"codespan\">aria-label</code> 属性,在朗读设备的帮助下,盲人能够了解图表的内容。其值为:</p>\n<pre><code>这是一个关于“某站点用户访问来源”的图表。图表类型是饼图,表示访问来源。其数据是——直接访问的数据是335,邮件营销的数据是310,联盟广告的数据是234,视频广告的数据是135,搜索引擎的数据是1548。\n</code></pre><h2 id=\"-\">整体修改描述</h2>\n<p>对于有些图表,默认生成的数据点的描述并不足以表现整体的信息。比如下图的散点图,默认生成的描述可以包含数据点的坐标值,但是知道几百几千个点的坐标并不能帮助我们有效地理解图表表达的信息。</p>\n<p><img width=\"600\" height=\"auto\" src=\"documents/asset/img/aria-example.png\"></p>\n<p>这时候,用户可以通过 <a href=\"option.html#aria.description\" target=\"_blank\">aria.description</a> 配置项指定图表的整体描述。</p>\n<h2 id=\"-\">定制模板描述</h2>\n<p>除了整体性修改描述之外,我们还提供了生成描述的模板,可以方便地进行细粒度的修改。</p>\n<p>生成描述的基本流程为,如果 <a href=\"option.html#aria.show\" target=\"_blank\">aria.show</a> 设置为 <code class=\"codespan\">true</code>,则生成无障碍访问描述,否则不生成。如果定义了 <a href=\"option.html#aria.description\" target=\"_blank\">aria.description</a>,则将其作为图表的完整描述,否则根据模板拼接生成描述。我们提供了默认的生成描述的算法,仅当生成的描述不太合适时,才需要修改这些模板,甚至使用 <code class=\"codespan\">aria.description</code> 完全覆盖。</p>\n<p>使用模板拼接时,先根据是否存在标题 <a href=\"#title.text\">title.text</a> 决定使用 <a href=\"option.html#aria.general.withTitle\" target=\"_blank\">aria.general.withTitle</a> 还是 <a href=\"option.html#aria.general.withoutTitle\" target=\"_blank\">aria.general.withoutTitle</a> 作为整体性描述。其中,<code class=\"codespan\">aria.general.withTitle</code> 配置项包括模板变量 <code class=\"codespan\">&#39;{title}&#39;</code>,将会被替换成图表标题。也就是说,如果 <code class=\"codespan\">aria.general.withTitle</code> 被设置为 <code class=\"codespan\">&#39;图表的标题是:{title}。&#39;</code>,则如果包含标题 <code class=\"codespan\">&#39;价格分布图&#39;</code>,这部分的描述为 <code class=\"codespan\">&#39;图表的标题是:价格分布图。&#39;</code>。</p>\n<p>拼接完标题之后,会依次拼接系列的描述(<a href=\"option.html#aria.series\" target=\"_blank\">aria.series</a>),和每个系列的数据的描述(<a href=\"option.html#aria.data\" target=\"_blank\">aria.data</a>)。同样,每个模板都有可能包括模板变量,用以替换实际的值。</p>\n<p>完整的描述生成流程请参见 <a href=\"option.html#aria\" target=\"_blank\">ARIA 文档</a>。</p>\n"},"使用 ECharts GL 实现基础的三维可视化":{"type":["*"],"description":"<p>ECharts GL (后面统一简称 GL)为 Apache ECharts (incubating)<sup>TM</sup> 补充了丰富的三维可视化组件,这篇文章我们会简单介绍如何基于 GL 实现一些常见的三维可视化作品。实际上如果你对 ECharts 有一定了解的话,也可以很快的上手 GL,GL 的配置项完全是按照 ECharts 的标准和上手难度来设计的。</p>\n<p>在看完文章之后,你可以前往 <a href=\"https://echarts.apache.org/examples/zh/index.html#chart-type-globe\" target=\"_blank\">官方示例</a> 和 <a href=\"https://gallery.echartsjs.com/explore.html#tags=echarts-gl\" target=\"_blank\">Gallery</a> 去了解更多使用 GL 制作的示例,对于文章中我们没法解释到的代码,也可以前往 <a href=\"option-gl.html\" target=\"_blank\">GL 配置项手册</a> 查看具体的配置项使用方法。</p>\n<h2 id=\"-echarts-gl\">如何下载和引入 ECharts GL</h2>\n<p>为了不再增加已经很大了的 ECharts 完整版的体积,我们将 GL 作为扩展包的形式提供,和诸如水球图这样的扩展类似,如果要使用 GL 里的各种组件,只需要在引入<code class=\"codespan\">echarts.min.js</code>的基础上再引入一个<code class=\"codespan\">echarts-gl.min.js</code>。你可以从 <a href=\"https://echarts.apache.org/zh/download.html\" target=\"_blank\">官网</a> 下载最新版的 GL,然后在页面中通过标签引入:</p>\n<pre><code class=\"lang-html\">&lt;script src=&quot;lib/echarts.min.js&quot;&gt;&lt;/script&gt;\n&lt;script src=&quot;lib/echarts-gl.min.js&quot;&gt;&lt;/script&gt;\n</code></pre>\n<p>如果你的项目使用 webpack 或者 rollup 来打包代码的话,也可以通过 npm 安装后引入</p>\n<pre><code class=\"lang-bash\">npm install echarts\nnpm install echarts-gl\n</code></pre>\n<pre><code class=\"lang-js\">// 通过 ES6 的 import 语法引入 ECharts 和 ECharts GL\nimport echarts from &#39;echarts&#39;;\nimport &#39;echarts-gl&#39;;\n</code></pre>\n<h2 id=\"-\">声明一个基础的三维笛卡尔坐标系</h2>\n<p>引入 ECharts 和 ECharts GL 后,我们先来声明一个基础的三维笛卡尔坐标系用于绘制三维的散点图,柱状图,曲面图等常见的统计图。</p>\n<p>在 ECharts 中我们有 <a href=\"option.html#grid\" target=\"_blank\">grid</a> 组件用于提供一个矩形的区域放置一个二维的笛卡尔坐标系,以及笛卡尔坐标系上上的 x 轴(<a href=\"option.html#xAxis\" target=\"_blank\">xAxis</a>)和 y 轴(<a href=\"option.html#yAxis\" target=\"_blank\">yAxis</a>)。对于三维的笛卡尔坐标系,我们在 GL 中提供了 <a href=\"option-gl.html#grid3D\" target=\"_blank\">grid3D</a> 组件用于划分一块三维的笛卡尔空间,以及放置在这个 <a href=\"option-gl.html#grid3D\" target=\"_blank\">grid3D</a> 上的 <a href=\"option-gl.html#xAxis3D\" target=\"_blank\">xAxis3D</a>, <a href=\"option-gl.html#yAxis3D\" target=\"_blank\">yAxis3D</a>, <a href=\"option-gl.html#zAxis3D\" target=\"_blank\">zAxis3D</a>。</p>\n<blockquote>\n<p>小提示:在 GL 中我们对除了 globe 之外所有的三维组件和系列都加了 3D 的后缀用以区分,例如三维的散点图就是 scatter3D,三维的地图就是 map3D 等等。</p>\n</blockquote>\n<p>下面这段代码就声明了一个最简单的三维笛卡尔坐标系</p>\n<pre><code class=\"lang-js\">var option = {\n    // 需要注意的是我们不能跟 grid 一样省略 grid3D\n    grid3D: {},\n    // 默认情况下, x, y, z 分别是从 0 到 1 的数值轴\n    xAxis3D: {},\n    yAxis3D: {},\n    zAxis3D: {}\n}\n</code></pre>\n<p>效果如下:</p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/grid3D-basic.png\"></p>\n<p>跟二维的笛卡尔坐标系一样,每个轴都会有多种类型,默认是数值轴,如果需要是类目轴的话,简单的设置为 <code class=\"codespan\">type: &#39;category&#39;</code>就行了。</p>\n<h2 id=\"-\">绘制三维的散点图</h2>\n<p>声明好笛卡尔坐标系后,我们先试试用一份程序生成的正态分布数据在这个三维的笛卡尔坐标系中画散点图。</p>\n<p>下面这段是生成正态分布数据的代码,你可以先不用关心这段代码是怎么工作的,只需要知道它生成了一份三维的正态分布数据放在<code class=\"codespan\">data</code>数组中。</p>\n<pre><code class=\"lang-js\">function makeGaussian(amplitude, x0, y0, sigmaX, sigmaY) {\n    return function (amplitude, x0, y0, sigmaX, sigmaY, x, y) {\n        var exponent = -(\n                ( Math.pow(x - x0, 2) / (2 * Math.pow(sigmaX, 2)))\n                + ( Math.pow(y - y0, 2) / (2 * Math.pow(sigmaY, 2)))\n            );\n        return amplitude * Math.pow(Math.E, exponent);\n    }.bind(null, amplitude, x0, y0, sigmaX, sigmaY);\n}\n// 创建一个高斯分布函数\nvar gaussian = makeGaussian(50, 0, 0, 20, 20);\n\nvar data = [];\nfor (var i = 0; i &lt; 1000; i++) {\n    // x, y 随机分布\n    var x = Math.random() * 100 - 50;\n    var y = Math.random() * 100 - 50;\n    var z = gaussian(x, y);\n    data.push([x, y, z]);\n}\n</code></pre>\n<p>生成的正态分布的数据大概长这样:</p>\n<pre><code class=\"lang-js\">[\n  [46.74395071259907, -33.88391024738553, 0.7754030099768191],\n  [-18.45302873809771, 16.88114775416834, 22.87772504105404],\n  [2.9908128281121336, -0.027699444453467947, 49.44400635911886],\n  ...\n]\n</code></pre>\n<p>每一项都包含了<code class=\"codespan\">x</code>, <code class=\"codespan\">y</code>, <code class=\"codespan\">z</code>三个值,这三个值会分别被映射到笛卡尔坐标系的 x 轴,y 轴和 z 轴上。</p>\n<p>然后我们可以使用 GL 提供的 <a href=\"option-gl.html#series-scatter3D\" target=\"_blank\">scatter3D</a> 系列类型把这些数据画成三维空间中正态分布的点。</p>\n<pre><code class=\"lang-js\">option = {\n    grid3D: {},\n    xAxis3D: {},\n    yAxis3D: {},\n    zAxis3D: { max: 100 },\n    series: [{\n        type: &#39;scatter3D&#39;,\n        data: data\n    }]\n}\n</code></pre>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/scatter3D-gaussian.png\"></p>\n<h2 id=\"-\">使用真实数据的三维散点图</h2>\n<p>接下来我们来看一个使用真实多维数据的三维散点图例子。</p>\n<p>可以先从 <a href=\"https://echarts.apache.org/examples/data/asset/data/life-expectancy-table.json\" target=\"_blank\">https://echarts.apache.org/examples/data/asset/data/life-expectancy-table.json</a> 获取这份数据。</p>\n<p>格式化一下可以看到这份数据是很传统转成 JSON 后的表格格式。第一行是每一列数据的属性名,可以从这个属性名看出来每一列数据的含义,分别是人均收入,人均寿命,人口数量,国家和年份。</p>\n<pre><code class=\"lang-js\">[\n    [&quot;Income&quot;, &quot;Life Expectancy&quot;, &quot;Population&quot;, &quot;Country&quot;, &quot;Year&quot;],\n    [815, 34.05, 351014, &quot;Australia&quot;, 1800],\n    [1314, 39, 645526, &quot;Canada&quot;, 1800],\n    [985, 32, 321675013, &quot;China&quot;, 1800],\n    [864, 32.2, 345043, &quot;Cuba&quot;, 1800],\n    [1244, 36.5731262, 977662, &quot;Finland&quot;, 1800],\n    ...\n]\n</code></pre>\n<p>在 ECharts 4 中我们可以使用 dataset 组件非常方便地引入这份数据。如果对 dataset 还不熟悉的话可以看<a href=\"tutorial.html#%E4%BD%BF%E7%94%A8%20dataset%20%E7%AE%A1%E7%90%86%E6%95%B0%E6%8D%AE\" target=\"_blank\">dataset使用教程</a></p>\n<pre><code class=\"lang-js\">$.get(&#39;data/asset/data/life-expectancy-table.json&#39;, function (data) {\n    myChart.setOption({\n        grid3D: {},\n        xAxis3D: {},\n        yAxis3D: {},\n        zAxis3D: {},\n        dataset: {\n            source: data\n        },\n        series: [\n            {\n                type: &#39;scatter3D&#39;,\n                symbolSize: 2.5\n            }\n        ]\n    })\n});\n</code></pre>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/scatter3D-life.png\"></p>\n<p>默认会把前三列,也就是收入(Income),人均寿命(Life Expectancy),人口(Population)分别放到 x、 y、 z 轴上。</p>\n<p>使用 encode 属性我们还可以将指定列的数据映射到指定的坐标轴上,从而省去很多繁琐的数据转换代码。例如我们将 x 轴换成是国家(Country),y 轴换成年份(Year),z 轴换成收入(Income),可以看到不同国家不同年份的人均收入分布。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    grid3D: {},\n    xAxis3D: {\n        // 因为 x 轴和 y 轴都是类目数据,所以需要设置 type: &#39;category&#39; 保证正确显示数据。\n        type: &#39;category&#39;\n    },\n    yAxis3D: {\n        type: &#39;category&#39;\n    },\n    zAxis3D: {},\n    dataset: {\n        source: data\n    },\n    series: [\n        {\n            type: &#39;scatter3D&#39;,\n            symbolSize: 2.5,\n            encode: {\n                // 维度的名字默认就是表头的属性名\n                x: &#39;Country&#39;,\n                y: &#39;Year&#39;,\n                z: &#39;Income&#39;,\n                tooltip: [0, 1, 2, 3, 4]\n            }\n        }\n    ]\n});\n</code></pre>\n<h2 id=\"-visualmap-\">利用 visualMap 组件对三维散点图进行视觉编码</h2>\n<p>刚才多维数据的例子中,我们还有几个维度(列)没能表达出来,利用 ECharts 内置的 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件我们可以继续将第四个维度编码成颜色。</p>\n<pre><code class=\"lang-js\">myChart.setOption({\n    grid3D: {\n        viewControl: {\n            // 使用正交投影。\n            projection: &#39;orthographic&#39;\n        }\n    },\n    xAxis3D: {\n        // 因为 x 轴和 y 轴都是类目数据,所以需要设置 type: &#39;category&#39; 保证正确显示数据。\n        type: &#39;category&#39;\n    },\n    yAxis3D: {\n        type: &#39;log&#39;\n    },\n    zAxis3D: {},\n    visualMap: {\n        calculable: true,\n        max: 100,\n        // 维度的名字默认就是表头的属性名\n        dimension: &#39;Life Expectancy&#39;,\n        inRange: {\n            color: [&#39;#313695&#39;, &#39;#4575b4&#39;, &#39;#74add1&#39;, &#39;#abd9e9&#39;, &#39;#e0f3f8&#39;, &#39;#ffffbf&#39;, &#39;#fee090&#39;, &#39;#fdae61&#39;, &#39;#f46d43&#39;, &#39;#d73027&#39;, &#39;#a50026&#39;]\n        }\n    },\n    dataset: {\n        source: data\n    },\n    series: [\n        {\n            type: &#39;scatter3D&#39;,\n            symbolSize: 5,\n            encode: {\n                // 维度的名字默认就是表头的属性名\n                x: &#39;Country&#39;,\n                y: &#39;Population&#39;,\n                z: &#39;Income&#39;,\n                tooltip: [0, 1, 2, 3, 4]\n            }\n        }\n    ]\n})\n</code></pre>\n<p>这段代码中我们又在刚才的例子基础上加入了 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件,将<code class=\"codespan\">Life Expectancy</code>这一列数据映射到了不同的颜色。</p>\n<p>除此之外我们还把原来默认的透视投影改成了正交投影。正交投影在某些场景中可以避免因为近大远小所造成的表达错误。</p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/scatter3D-color.png\"></p>\n<p>当然,除了 <a href=\"option.html#visualMap\" target=\"_blank\">visualMap</a> 组件,还可以利用其它的 ECharts 内置组件并且充分利用这些组件的交互效果,比如 <a href=\"option.html#legend\" target=\"_blank\">legend</a>。也可以像 <a href=\"https://echarts.apache.org/examples/zh/editor.html?c=scatter3d-scatter&amp;gl=1\" target=\"_blank\">三维散点图和散点矩阵结合使用</a> 这个例子一样实现二维和三维的系列混搭。</p>\n<p>在实现 GL 的时候我们尽可能地把 WebGL 和 Canvas 之间的差异屏蔽了到最小,从而让 GL 的使用可以更加方便自然。</p>\n<h2 id=\"-\">在笛卡尔坐标系上显示其它类型的三维图表</h2>\n<p>除了散点图,我们也可以通过 GL 在三维的笛卡尔坐标系上绘制其它类型的三维图表。比如刚才例子中将 <code class=\"codespan\">scatter3D</code> 类型改成 <code class=\"codespan\">bar3D</code> 就可以变成一个三维的柱状图。</p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/bar3D.png\"></p>\n<p>还有机器学习中会用到的三维曲面图 <a href=\"option-gl.html#series-surface\" target=\"_blank\">surface</a>,三维曲面图常用来表达平面上的数据走势,刚才的正态分布数据我们也可以像下面这样画成曲面图。</p>\n<pre><code class=\"lang-js\">var data = [];\n// 曲面图要求给入的数据是网格形式按顺序分布。\nfor (var y = -50; y &lt;= 50; y++) {\n    for (var x = -50; x &lt;= 50; x++) {\n        var z = gaussian(x, y);\n        data.push([x, y, z]);\n    }\n}\noption = {\n    grid3D: {},\n    xAxis3D: {},\n    yAxis3D: {},\n    zAxis3D: { max: 60 },\n    series: [{\n        type: &#39;surface&#39;,\n        data: data\n    }]\n}\n</code></pre>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/surface.png\"></p>\n<h2 id=\"-\">老板想要立体的柱状图效果</h2>\n<p>最后,我们经常会被问到如何用 ECharts 画只有二维数据的立体柱状图效果。一般来说我们是不推荐这么做的,因为这种不必要的立体柱状图很容易造成错误的表达,具体可以见我们 <a href=\"https://vis.baidu.com/chartusage/bar/\" target=\"_blank\">柱状图使用指南</a> 中的解释。</p>\n<p>但是如果有一些其他因素导致必须得画成立体的柱状图的话,用 GL 也可以实现。<a href=\"https://gallery.echartsjs.com/explore.html?u=bd-3056387051\" target=\"_blank\">丶灬豆奶</a> 和 <a href=\"https://gallery.echartsjs.com/explore.html?u=bd-809368804\" target=\"_blank\">阿洛儿啊</a> 在 Gallery 已经写了类似的例子,大家可以参考。</p>\n<p><a href=\"https://gallery.echartsjs.com/explore.html?u=bd-3056387051\" target=\"_blank\">3D堆积柱状图</a></p>\n<p><a href=\"https://gallery.echartsjs.com/editor.html?c=xryQDPYK0b\" target=\"_blank\">3D柱状图</a></p>\n<p><img width=\"\" height=\"auto\" src=\"documents/asset/img/gl/bar3D-2d-data.png\"></p>\n"},"在微信小程序中使用 ECharts":{"type":["*"],"description":"<p>我们接到了很多微信小程序开发者的反馈,表示他们强烈需要像 Apache ECharts (incubating)<sup>TM</sup> 这样的可视化工具。但是微信小程序是不支持 DOM 操作的,Canvas 接口也和浏览器不尽相同。</p>\n<p>因此,我们和微信小程序官方团队合作,提供了 ECharts 的微信小程序版本。开发者可以通过熟悉的 ECharts 配置方式,快速开发图表,满足各种可视化需求。</p>\n<h2 id=\"-\">体验示例小程序</h2>\n<p>在微信中扫描下面的二维码即可体验 ECharts Demo:</p>\n<p><img width=\"auto\" height=\"auto\" src=\"https://github.com/ecomfe/echarts-for-weixin/raw/master/img/weixin-app.jpg\"></p>\n<h2 id=\"-\">下载</h2>\n<p>为了兼容小程序 Canvas,我们提供了一个小程序的组件,用这种方式可以方便地使用 ECharts。</p>\n<p>首先,下载 GitHub 上的 <a href=\"https://github.com/ecomfe/echarts-for-weixin\" target=\"_blank\">ecomfe/echarts-for-weixin</a> 项目。</p>\n<p>其中,<code class=\"codespan\">ec-canvas</code> 是我们提供的组件,其他文件是如何使用该组件的示例。</p>\n<p><code class=\"codespan\">ec-canvas</code> 目录下有一个 <code class=\"codespan\">echarts.js</code>,默认我们会在每次 <code class=\"codespan\">echarts-for-weixin</code> 项目发版的时候替换成最新版的 ECharts。如有必要,可以自行从 ECharts 项目中下载<a href=\"https://github.com/apache/incubator-echarts/releases\" target=\"_blank\">最新发布版</a>,或者从<a href=\"https://echarts.apache.org/builder.html\" target=\"_blank\">官网自定义构建</a>以减小文件大小。</p>\n<h2 id=\"-\">引入组件</h2>\n<p>微信小程序的项目创建可以参见<a href=\"https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/\" target=\"_blank\">微信公众平台官方文档</a>。</p>\n<p>在创建项目之后,可以将下载的 <a href=\"https://github.com/ecomfe/echarts-for-weixin\" target=\"_blank\">ecomfe/echarts-for-weixin</a> 项目完全替换新建的项目,然后将修改代码;或者仅拷贝 <code class=\"codespan\">ec-canvas</code> 目录到新建的项目下,然后做相应的调整。</p>\n<p>如果采用完全替换的方式,需要将 <code class=\"codespan\">project.config.json</code> 中的 <code class=\"codespan\">appid</code> 替换成在公众平台申请的项目 id。<code class=\"codespan\">pages</code> 目录下的每个文件夹是一个页面,可以根据情况删除不需要的页面,并且在 <code class=\"codespan\">app.json</code> 中删除对应页面。</p>\n<p>如果仅拷贝 <code class=\"codespan\">ec-canvas</code> 目录,则可以参考 <code class=\"codespan\">pages/bar</code> 目录下的几个文件的写法。下面,我们具体地说明。</p>\n<h2 id=\"-\">创建图表</h2>\n<p>首先,在 <code class=\"codespan\">pages/bar</code> 目录下新建以下几个文件:<code class=\"codespan\">index.js</code>、 <code class=\"codespan\">index.json</code>、 <code class=\"codespan\">index.wxml</code>、 <code class=\"codespan\">index.wxss</code>。并且在 <code class=\"codespan\">app.json</code> 的 <code class=\"codespan\">pages</code> 中增加 <code class=\"codespan\">&#39;pages/bar/index&#39;</code>。</p>\n<p><code class=\"codespan\">index.json</code> 配置如下:</p>\n<pre><code class=\"lang-json\">{\n  &quot;usingComponents&quot;: {\n    &quot;ec-canvas&quot;: &quot;../../ec-canvas/ec-canvas&quot;\n  }\n}\n</code></pre>\n<p>这一配置的作用是,允许我们在 <code class=\"codespan\">pages/bar/index.wxml</code> 中使用 <code class=\"codespan\">&lt;ec-canvas&gt;</code> 组件。注意路径的相对位置要写对,如果目录结构和本例相同,就应该像上面这样配置。</p>\n<p><code class=\"codespan\">index.wxml</code> 中,我们创建了一个 <code class=\"codespan\">&lt;ec-canvas&gt;</code> 组件,内容如下:</p>\n<pre><code class=\"lang-xml\">&lt;view class=&quot;container&quot;&gt;\n  &lt;ec-canvas id=&quot;mychart-dom-bar&quot; canvas-id=&quot;mychart-bar&quot; ec=&quot;{{ ec }}&quot;&gt;&lt;/ec-canvas&gt;\n&lt;/view&gt;\n</code></pre>\n<p>其中 <code class=\"codespan\">ec</code> 是一个我们在 <code class=\"codespan\">index.js</code> 中定义的对象,它使得图表能够在页面加载后被初始化并设置。<code class=\"codespan\">index.js</code> 的结构如下:</p>\n<pre><code class=\"lang-js\">function initChart(canvas, width, height) {\n  const chart = echarts.init(canvas, null, {\n    width: width,\n    height: height\n  });\n  canvas.setChart(chart);\n\n  var option = {\n    ...\n  };\n  chart.setOption(option);\n  return chart;\n}\n\nPage({\n  data: {\n    ec: {\n      onInit: initChart\n    }\n  }\n});\n</code></pre>\n<p>这对于所有 ECharts 图表都是通用的,用户只需要修改上面 <code class=\"codespan\">option</code> 的内容,即可改变图表。<code class=\"codespan\">option</code> 的使用方法参见 <a href=\"option.html\" target=\"_blank\">ECharts 配置项文档</a>。对于不熟悉 ECharts 的用户,可以参见 <a href=\"tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts\" target=\"_blank\">5 分钟上手 ECharts</a> 教程。</p>\n<p>完整的例子请参见 <a href=\"https://github.com/ecomfe/echarts-for-weixin\" target=\"_blank\">ecomfe/echarts-for-weixin</a> 项目。</p>\n<h2 id=\"-\">暂不支持的功能</h2>\n<p>ECharts 中的绝大部分功能都支持小程序版本,因此这里仅说明不支持的功能,以及存在的问题。</p>\n<p>以下功能尚不支持,如果有相关需求请在 <a href=\"https://github.com/ecomfe/echarts-for-weixin/issues\" target=\"_blank\">issue</a> 中向我们反馈,对于反馈人数多的需求将优先支持:</p>\n<ul>\n<li>Tooltip</li>\n<li>图片</li>\n<li>多个 zlevel 分层</li>\n</ul>\n<p>此外,目前还有一些 bug 尚未修复,部分需要小程序团队配合上线支持,但不影响基本的使用。已知的 bug 包括:</p>\n<ul>\n<li>安卓平台:transform 的问题(会影响关系图边两端的标记位置、旭日图文字位置等)</li>\n<li>iOS 平台:半透明略有变深的问题</li>\n<li>iOS 平台:渐变色出现在定义区域之外的地方</li>\n</ul>\n<p>如有其它问题,也欢迎在 <a href=\"https://github.com/ecomfe/echarts-for-weixin/issues\" target=\"_blank\">issue</a> 中向我们反馈,谢谢!</p>\n"}}}}
\ No newline at end of file
diff --git a/zh/download-extension.html b/zh/download-extension.html
index bb5da59..e1141c9 100644
--- a/zh/download-extension.html
+++ b/zh/download-extension.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>扩展下载 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>扩展下载</h1><p>可在此免费下载各类 ECharts 扩展插件,获取更丰富的图表类型和增强功能</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="extension" class="page-content container"><div class="nav-container"><ul class="nav nav-tabs"><li class="active"><a href="#chart-type" data-toggle="tab">图表及组件</a></li><li><a href="#functional" data-toggle="tab">功能增强</a></li><li><a href="#framework" data-toggle="tab">框架协作</a></li><li><a href="#language" data-toggle="tab">其他语言</a></li></ul></div><div class="tab-content"><div id="chart-type" class="tab-pane active"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-gl" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/gl.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-gl" class="extension-name">ECharts GL</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">3D 图表、地理可视化、WebGL 加速渲染</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/word-cloud.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-name">字符云</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">字符云可以将文字根据不同的权重布局为大小、颜色各异的图,支持使用图片作为遮罩。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/liquidfill.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-name">水球图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/Ovilia" class="extension-author-name">羡辙</a></div><div class="extension-desc">水球图是一种适合于展现单个百分比数据的图表,支持多条水波和动画。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/bmap.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-name">百度地图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">百度地图扩展,可以在百度地图上展现点图,线图,热力图等。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/arcgis.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-name">ArcGIS 地图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/wandergis" class="extension-author-name">wandergis</a></div><div class="extension-desc">ArcGIS 地图和 ECharts 的结合,支持 ECharts 2 和 ECharts 3。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wandergis/leaflet-echarts3" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/leaflet.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wandergis/leaflet-echarts3" class="extension-name">Leaflet 地图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/wandergis" class="extension-author-name">wandergis</a></div><div class="extension-desc">Leaflet 地图和 ECharts 的结合,支持 ECharts 2 和 ECharts 3。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/leaflet-2.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-name">echarts-leaflet</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/gnijuohz" class="extension-author-name">gnijuohz</a></div><div class="extension-desc">ECharts extension for visualizing data on leaftlet.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/lzxue/echartsLayer" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/mapbox.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/lzxue/echartsLayer" class="extension-name">Mapbox 地图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/lzxue" class="extension-author-name">lzxue</a></div><div class="extension-desc">Mapbox 地图和 ECharts 的结合。</div></div></div></div></div></div><div id="functional" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/modularity.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-name">图的模块化</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">该插件可以对 ECharts Graph 图作社群检测,并将图中的顶点分成若干子集。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-stat" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/stat.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-stat" class="extension-name">统计工具</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/deqingli" class="extension-author-name">李德清</a></div><div class="extension-desc">统计扩展是一个专门用来进行数据分析的工具。</div></div></div></div></div></div><div id="framework" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wangshijun/angular-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wangshijun/angular-echarts" class="extension-name">angular-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/wangshijun" class="extension-author-name">wangshijun</a></div><div class="extension-desc">AngularJs bindings for Baidu ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/bornkiller/echarts-ng" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/bornkiller/echarts-ng" class="extension-name">echarts-ng</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/bornkiller" class="extension-author-name">bornkiller</a></div><div class="extension-desc">使用 Angular 封装 ECharts 为指令。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/ng-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/ng-echarts" class="extension-name">ng-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">AngularJs 版 ECharts,支持最新 ECharts3.x。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Justineo/vue-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Justineo/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/Justineo" class="extension-author-name">Justineo</a></div><div class="extension-desc">ECharts component for Vue.js.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/panteng/vue-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/panteng/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/panteng" class="extension-author-name">panteng</a></div><div class="extension-desc">A custom directive for using Echarts in Vue.js apps.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/PUGE/echarts-middleware" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/PUGE/echarts-middleware" class="extension-name">echarts-middleware</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/PUGE" class="extension-author-name">PUGE</a></div><div class="extension-desc">在 Vue 中优雅高效地使用 ECharts。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hustcc/echarts-for-react" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hustcc/echarts-for-react" class="extension-name">echarts-for-react</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/hustcc" class="extension-author-name">hustcc</a></div><div class="extension-desc">一个简单的 ECharts 的 react 封装。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/somonus/react-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/somonus/react-echarts" class="extension-name">react-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/somonus" class="extension-author-name">somonus</a></div><div class="extension-desc">ECharts + react.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/re-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/re-echarts" class="extension-name">re-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">ECharts + react.</div></div></div></div></div></div><div id="language" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/pyecharts/pyecharts/" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/pyecharts/pyecharts/" class="extension-name">pyecharts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/chenjiandongx" class="extension-author-name">chenjiandongx</a><a href="https://github.com/chfw" class="extension-author-name">chfw</a><a href="https://github.com/kinegratii" class="extension-author-name">kinegratii</a></div><div class="extension-desc">Python Echarts Plotting Library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yufeiminds/echarts-python" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yufeiminds/echarts-python" class="extension-name">echarts-python</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/yufeiminds" class="extension-author-name">yufeiminds</a></div><div class="extension-desc">Generate Echarts options with Python.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/napjon/krisk" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/napjon/krisk" class="extension-name">krisk</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/napjon" class="extension-author-name">napjon</a></div><div class="extension-desc">Krisk bring Echarts to Python, and helpful tools for statistical interactive visualization.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/taiyun/recharts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/taiyun/recharts" class="extension-name">recharts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/taiyun" class="extension-author-name">taiyun</a></div><div class="extension-desc">recharts 提供了 ECharts 的 R 语言接口。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yihui/recharts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yihui/recharts" class="extension-name">recharts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/yihui" class="extension-author-name">yihui</a></div><div class="extension-desc">An R Interface to ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-name">ECharts2Shiny</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/XD-DENG" class="extension-author-name">XD-DENG</a></div><div class="extension-desc">To insert interactive charts from ECharts into R Shiny applications.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-name">ECharts.jl</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/randyzwitch" class="extension-author-name">randyzwitch</a></div><div class="extension-desc">Julia package for the ECharts 3 visualization library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-name">purescript-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/slamdata" class="extension-author-name">slamdata</a></div><div class="extension-desc">Purescript bindings for Echarts library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-name">iOS-Echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/Pluto-Y/" class="extension-author-name">Pluto-Y</a></div><div class="extension-desc">This is a highly custom chart control for iOS and Mac apps, which build with ECharts 2.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/abel533/ECharts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/abel533/ECharts" class="extension-name">ECharts-Java</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/abel533" class="extension-author-name">abel533</a></div><div class="extension-desc">这是一个针对 ECharts2.x 版本的 Java 类库,实现了所有 ECharts 中的 JSON 结构对应的 Java 对象。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/idoku/EChartsSDK" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/idoku/EChartsSDK" class="extension-name">EChartsSDK</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/idoku" class="extension-author-name">idoku</a></div><div class="extension-desc">ECharts 的 .NET 类库,从 ECharts 的 Java 类库移植。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hisune/Echarts-PHP" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hisune/Echarts-PHP" class="extension-name">Echarts-PHP</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/hisune" class="extension-author-name">hisune</a></div><div class="extension-desc">A PHP library that works as a wrapper for Echarts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/entronad/flutter_echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/entronad/flutter_echarts" class="extension-name">flutter_echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/entronad" class="extension-author-name">entronad</a></div><div class="extension-desc">A Flutter widget to use Echarts in a reactive way.</div></div></div></div></div></div></div></div><div id="submit-extension"><div class="container"><h3>提交您的 ECharts 插件</h3><p>我们会尽快与您取得联系,之后您制作的插件将会在此页面提供给广大 ECharts 用户使用。</p><p>再次感谢您对 ECharts 的支持与贡献!</p><a href="mailto:dev@echarts.apache.org" class="btn btn-main btn-thirdary"><img src="https://echarts-www.cdn.bcebos.com/zh/images/btn-email.png?_v_=20200710_1"><span>发邮件提交</span></a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>扩展下载</h1><p>可在此免费下载各类 ECharts 扩展插件,获取更丰富的图表类型和增强功能</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div id="extension" class="page-content container"><div class="nav-container"><ul class="nav nav-tabs"><li class="active"><a href="#chart-type" data-toggle="tab">图表及组件</a></li><li><a href="#functional" data-toggle="tab">功能增强</a></li><li><a href="#framework" data-toggle="tab">框架协作</a></li><li><a href="#language" data-toggle="tab">其他语言</a></li></ul></div><div class="tab-content"><div id="chart-type" class="tab-pane active"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-gl" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/gl.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-gl" class="extension-name">ECharts GL</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">3D 图表、地理可视化、WebGL 加速渲染</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/word-cloud.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-wordcloud" class="extension-name">字符云</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">字符云可以将文字根据不同的权重布局为大小、颜色各异的图,支持使用图片作为遮罩。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/liquidfill.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-liquidfill" class="extension-name">水球图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/Ovilia" class="extension-author-name">羡辙</a></div><div class="extension-desc">水球图是一种适合于展现单个百分比数据的图表,支持多条水波和动画。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/bmap.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts/tree/master/extension/bmap" class="extension-name">百度地图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">百度地图扩展,可以在百度地图上展现点图,线图,热力图等。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/arcgis.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wandergis/arcgis-echarts3" class="extension-name">ArcGIS 地图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/wandergis" class="extension-author-name">wandergis</a></div><div class="extension-desc">ArcGIS 地图和 ECharts 的结合。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/leaflet-2.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/gnijuohz/echarts-leaflet" class="extension-name">echarts-leaflet</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/gnijuohz" class="extension-author-name">gnijuohz</a></div><div class="extension-desc">ECharts extension for visualizing data on leaftlet.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/lzxue/echartsLayer" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/mapbox.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/lzxue/echartsLayer" class="extension-name">Mapbox 地图</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/lzxue" class="extension-author-name">lzxue</a></div><div class="extension-desc">Mapbox 地图和 ECharts 的结合。</div></div></div></div></div></div><div id="functional" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/modularity.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-graph-modularity" class="extension-name">图的模块化</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/pissang" class="extension-author-name">沈毅</a></div><div class="extension-desc">该插件可以对 ECharts Graph 图作社群检测,并将图中的顶点分成若干子集。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/ecomfe/echarts-stat" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/stat.jpg?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/ecomfe/echarts-stat" class="extension-name">统计工具</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/deqingli" class="extension-author-name">李德清</a></div><div class="extension-desc">统计扩展是一个专门用来进行数据分析的工具。</div></div></div></div></div></div><div id="framework" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/wangshijun/angular-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/wangshijun/angular-echarts" class="extension-name">angular-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/wangshijun" class="extension-author-name">wangshijun</a></div><div class="extension-desc">AngularJs bindings for Baidu ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/bornkiller/echarts-ng" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/bornkiller/echarts-ng" class="extension-name">echarts-ng</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/bornkiller" class="extension-author-name">bornkiller</a></div><div class="extension-desc">使用 Angular 封装 ECharts 为指令。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/ng-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/ng-echarts" class="extension-name">ng-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">AngularJs 版 ECharts,支持最新 ECharts3.x。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Justineo/vue-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Justineo/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/Justineo" class="extension-author-name">Justineo</a></div><div class="extension-desc">ECharts component for Vue.js.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/panteng/vue-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/panteng/vue-echarts" class="extension-name">vue-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/panteng" class="extension-author-name">panteng</a></div><div class="extension-desc">A custom directive for using Echarts in Vue.js apps.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/PUGE/echarts-middleware" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/PUGE/echarts-middleware" class="extension-name">echarts-middleware</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/PUGE" class="extension-author-name">PUGE</a></div><div class="extension-desc">在 Vue 中优雅高效地使用 ECharts。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hustcc/echarts-for-react" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hustcc/echarts-for-react" class="extension-name">echarts-for-react</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/hustcc" class="extension-author-name">hustcc</a></div><div class="extension-desc">一个简单的 ECharts 的 react 封装。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/somonus/react-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/somonus/react-echarts" class="extension-name">react-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/somonus" class="extension-author-name">somonus</a></div><div class="extension-desc">ECharts + react.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/liekkas/re-echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/liekkas/re-echarts" class="extension-name">re-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/liekkas" class="extension-author-name">liekkas</a></div><div class="extension-desc">ECharts + react.</div></div></div></div></div></div><div id="language" class="tab-pane"><div class="row"><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/pyecharts/pyecharts/" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/pyecharts/pyecharts/" class="extension-name">pyecharts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/chenjiandongx" class="extension-author-name">chenjiandongx</a><a href="https://github.com/chfw" class="extension-author-name">chfw</a><a href="https://github.com/kinegratii" class="extension-author-name">kinegratii</a></div><div class="extension-desc">Python Echarts Plotting Library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yufeiminds/echarts-python" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yufeiminds/echarts-python" class="extension-name">echarts-python</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/yufeiminds" class="extension-author-name">yufeiminds</a></div><div class="extension-desc">Generate Echarts options with Python.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/napjon/krisk" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/napjon/krisk" class="extension-name">krisk</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/napjon" class="extension-author-name">napjon</a></div><div class="extension-desc">Krisk bring Echarts to Python, and helpful tools for statistical interactive visualization.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/taiyun/recharts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/taiyun/recharts" class="extension-name">recharts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/taiyun" class="extension-author-name">taiyun</a></div><div class="extension-desc">recharts 提供了 ECharts 的 R 语言接口。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/yihui/recharts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/yihui/recharts" class="extension-name">recharts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/yihui" class="extension-author-name">yihui</a></div><div class="extension-desc">An R Interface to ECharts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/XD-DENG/ECharts2Shiny" class="extension-name">ECharts2Shiny</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/XD-DENG" class="extension-author-name">XD-DENG</a></div><div class="extension-desc">To insert interactive charts from ECharts into R Shiny applications.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/randyzwitch/ECharts.jl" class="extension-name">ECharts.jl</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/randyzwitch" class="extension-author-name">randyzwitch</a></div><div class="extension-desc">Julia package for the ECharts 3 visualization library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/slamdata/purescript-echarts/" class="extension-name">purescript-echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/slamdata" class="extension-author-name">slamdata</a></div><div class="extension-desc">Purescript bindings for Echarts library.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/Pluto-Y/iOS-Echarts" class="extension-name">iOS-Echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/Pluto-Y/" class="extension-author-name">Pluto-Y</a></div><div class="extension-desc">This is a highly custom chart control for iOS and Mac apps, which build with ECharts 2.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/abel533/ECharts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/abel533/ECharts" class="extension-name">ECharts-Java</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/abel533" class="extension-author-name">abel533</a></div><div class="extension-desc">这是一个针对 ECharts2.x 版本的 Java 类库,实现了所有 ECharts 中的 JSON 结构对应的 Java 对象。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/idoku/EChartsSDK" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/idoku/EChartsSDK" class="extension-name">EChartsSDK</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/idoku" class="extension-author-name">idoku</a></div><div class="extension-desc">ECharts 的 .NET 类库,从 ECharts 的 Java 类库移植。</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/hisune/Echarts-PHP" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/hisune/Echarts-PHP" class="extension-name">Echarts-PHP</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/hisune" class="extension-author-name">hisune</a></div><div class="extension-desc">A PHP library that works as a wrapper for Echarts.</div></div></div></div><div class="col-md-3 col-sm-6 extension"><div class="extension-content"><a href="https://github.com/entronad/flutter_echarts" class="extension-head"><img src="https://echarts-www.cdn.bcebos.com/zh/images/extensions/default-extension.png?_v_=20200710_1" class="extension-img"/></a><div class="extension-info"><a href="https://github.com/entronad/flutter_echarts" class="extension-name">flutter_echarts</a><div class="extension-author"><span>贡献者:</span><a href="https://github.com/entronad" class="extension-author-name">entronad</a></div><div class="extension-desc">A Flutter widget to use Echarts in a reactive way.</div></div></div></div></div></div></div></div><div id="submit-extension"><div class="container"><h3>提交您的 ECharts 插件</h3><p>我们会尽快与您取得联系,之后您制作的插件将会在此页面提供给广大 ECharts 用户使用。</p><p>再次感谢您对 ECharts 的支持与贡献!</p><a href="mailto:dev@echarts.apache.org" class="btn btn-main btn-thirdary"><img src="https://echarts-www.cdn.bcebos.com/zh/images/btn-email.png?_v_=20200710_1"><span>发邮件提交</span></a></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/download-map.html b/zh/download-map.html
index f72b984..651f927 100644
--- a/zh/download-map.html
+++ b/zh/download-map.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>地图下载 - Apache ECharts (incubating)</title><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/vendors/prettify/prettify.css?_v_=20200710_1"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>地图下载</h1><p>(暂不提供地图下载)</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div style="text-align: left; min-height: 300px; margin-top: 30px;" class="page-content container"><p>ECharts 之前提供下载的矢量地图数据来自第三方,由于部分数据不符合国家《测绘法》规定,目前暂时停止下载服务。</p><p>建议大家使用以百度地图为底图的形式,参考<a href="https://echarts.apache.org/examples/zh/editor.html?c=map-polygon">例子</a>。</p></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>地图下载</h1><p>(暂不提供地图下载)</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div><div style="text-align: left; min-height: 300px; margin-top: 30px;" class="page-content container"><p>ECharts 之前提供下载的矢量地图数据来自第三方,由于部分数据不符合国家《测绘法》规定,目前暂时停止下载服务。</p><p>建议大家使用以百度地图为底图的形式,参考<a href="https://echarts.apache.org/examples/zh/editor.html?c=map-polygon">例子</a>。</p></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';
 $('pre').addClass('prettyprint');
 prettyPrint();</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
diff --git a/zh/download-theme.html b/zh/download-theme.html
index c0b55bf..1b4de5b 100644
--- a/zh/download-theme.html
+++ b/zh/download-theme.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -17,7 +17,7 @@
     ...
 });
 &lt;/script&gt;
-</pre></div></div></section><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';
+</pre></div></div></section><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/prettify.min.js"></script><script src="https://cdn.jsdelivr.net/npm/code-prettify@0.1.0/src/lang-css.js"></script><script>document.getElementById('nav-download').className = 'active';
 $('pre').addClass('prettyprint');
 prettyPrint();
 
diff --git a/zh/download.html b/zh/download.html
index eaaa357..ee8a3a6 100644
--- a/zh/download.html
+++ b/zh/download.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>下载 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>下载</h1></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">方法一:从下载的源代码或编译产物安装</h3><table id="download-table" class="table"><tr><th>版本</th><th>发布日期</th><th>从镜像网站下载源码</th><th>从 GitHub 下载编译产物</th></tr></table><div class="checksum"><p><strong>注意:</strong>如果从镜像网站下载,请检查 <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> 并且检验确认 <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> 与 <a href="https://www.apache.org">Apache 主站</a>的签名一致。链接在上面的 Source 旁。这个 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> 文件包含了用于签名发布版的公钥。如果可能的话,建议使用<a href="https://www.apache.org/dev/release-signing#web-of-trust">可信任的网络(web of trust)</a>确认 KEYS 的同一性。</p><h4>使用 GPG 验证 ECharts 发布版本</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.asc</li><li>下载 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a></li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>使用 SHA-512 验证</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.sha512</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) 基于 <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a> 发布</p></div><h3>方法二:从 npm 安装</h3><p><code>npm install echarts</code></p><h3>方法三:选择需要的模块,在线定制下载</h3><a href="builder.html" class="btn btn-main btn-thirdary more-btn">在线定制</a><p class="center">可自由选择所需图表和组件进行打包下载</p><h3>下载后……</h3><p><a href="./tutorial.html">5 分钟上手 ECharts</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/download.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>下载</h1></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">方法一:从下载的源代码或编译产物安装</h3><table id="download-table" class="table"><tr><th>版本</th><th>发布日期</th><th>从镜像网站下载源码</th><th>从 GitHub 下载编译产物</th></tr></table><div class="checksum"><p><strong>注意:</strong>如果从镜像网站下载,请检查 <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> 并且检验确认 <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> 与 <a href="https://www.apache.org">Apache 主站</a>的签名一致。链接在上面的 Source 旁。这个 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> 文件包含了用于签名发布版的公钥。如果可能的话,建议使用<a href="https://www.apache.org/dev/release-signing#web-of-trust">可信任的网络(web of trust)</a>确认 KEYS 的同一性。</p><h4>使用 GPG 验证 ECharts 发布版本</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.asc</li><li>下载 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a></li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>使用 SHA-512 验证</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.sha512</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) 基于 <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a> 发布</p></div><h3>方法二:从 npm 安装</h3><p><code>npm install echarts</code></p><h3>方法三:选择需要的模块,在线定制下载</h3><a href="builder.html" class="btn btn-main btn-thirdary more-btn">在线定制</a><p class="center">可自由选择所需图表和组件进行打包下载</p><h3>下载后……</h3><p><a href="./tutorial.html">5 分钟上手 ECharts</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/download.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
 
 //- $('.download-echarts').click(function (e) {
 //-     var el = document.createElement('div');
diff --git a/zh/download3.html b/zh/download3.html
index ce5f97f..5d281d6 100644
--- a/zh/download3.html
+++ b/zh/download3.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>下载 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>下载</h1></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">方法一:从下载的源代码或编译产物安装</h3><table id="download-table" class="table"><tr><th>版本</th><th>发布日期</th><th>从镜像网站下载源码</th><th>从 GitHub 下载编译产物</th></tr></table><div class="checksum"><p><strong>注意:</strong>如果从镜像网站下载,请检查 <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> 并且检验确认 <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> 与 <a href="https://www.apache.org">Apache 主站</a>的签名一致。链接在上面的 Source 旁。这个 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> 文件包含了用于签名发布版的公钥。如果可能的话,建议使用<a href="https://www.apache.org/dev/release-signing#web-of-trust">可信任的网络(web of trust)</a>确认 KEYS 的同一性。</p><h4>使用 GPG 验证 ECharts 发布版本</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.asc</li><li>下载 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a></li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>使用 SHA-512 验证</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.sha512</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) 基于 <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a> 发布</p></div><h3>方法二:从 npm 安装</h3><p><code>npm install echarts</code></p><h3>方法三:选择需要的模块,在线定制下载</h3><a href="builder3.html" class="btn btn-main btn-thirdary more-btn">在线定制</a><p class="center">可自由选择所需图表和组件进行打包下载</p><h3>下载后……</h3><p><a href="./tutorial.html">5 分钟上手 ECharts</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/download.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><h1>下载</h1></div><div id="download-main" class="page-content container"><div class="d-section-version d-section"><h3 class="first">方法一:从下载的源代码或编译产物安装</h3><table id="download-table" class="table"><tr><th>版本</th><th>发布日期</th><th>从镜像网站下载源码</th><th>从 GitHub 下载编译产物</th></tr></table><div class="checksum"><p><strong>注意:</strong>如果从镜像网站下载,请检查 <a href="https://www.apache.org/dev/release-signing#sha-checksum">SHA-512</a> 并且检验确认 <a href="https://www.apache.org/dev/release-signing#openpgp">OpenPGP</a> 与 <a href="https://www.apache.org">Apache 主站</a>的签名一致。链接在上面的 Source 旁。这个 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">KEYS</a> 文件包含了用于签名发布版的公钥。如果可能的话,建议使用<a href="https://www.apache.org/dev/release-signing#web-of-trust">可信任的网络(web of trust)</a>确认 KEYS 的同一性。</p><h4>使用 GPG 验证 ECharts 发布版本</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.asc</li><li>下载 <a href="https://www.apache.org/dist/incubator/echarts/KEYS">ECharts KEYS</a></li><li>gpg –import KEYS</li><li>gpg –verify apache-echarts-X.Y.Z-incubating-src.zip.asc</li></ol><h4>使用 SHA-512 验证</h4><ol><li>从镜像网站下载 apache-echarts-X.Y.Z-incubating-src.zip</li><li>从 <a href="https://www.apache.org/dist/incubator/echarts/">Apache</a> 下载 checksum apache-echarts-X.Y.Z-incubating-src.zip.sha512</li><li>shasum -a 512 apache-echarts-X.Y.Z-incubating-src.zip</li></ol><h4>License</h4><p>Apache ECharts (incubating) 基于 <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache License 2.0</a> 发布</p></div><h3>方法二:从 npm 安装</h3><p><code>npm install echarts</code></p><h3>方法三:选择需要的模块,在线定制下载</h3><a href="builder3.html" class="btn btn-main btn-thirdary more-btn">在线定制</a><p class="center">可自由选择所需图表和组件进行打包下载</p><h3>下载后……</h3><p><a href="./tutorial.html">5 分钟上手 ECharts</a></p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/download.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-download').className = 'active';
 
 //- $('.download-echarts').click(function (e) {
 //-     var el = document.createElement('div');
diff --git a/zh/examples.html b/zh/examples.html
index 7a17df9..5164530 100644
--- a/zh/examples.html
+++ b/zh/examples.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -8,11 +8,11 @@
 }
 </script><title>Examples - Apache ECharts (incubating)</title><script>var chartId = location.hash.slice(1);
 window.location ='./examples/index.html';</script><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/perfect-scrollbar@0.6.8/dist/css/perfect-scrollbar.min.css"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="left-chart-nav"><ul></ul></div><div id="explore-container"><div class="chart-list-panel"></div></div><div style="display:none">点击查看详情</div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-lazyload@1.9.7/jquery.lazyload.min.js"></script><script type="text/javascript">var GALLERY_PATH = 'https://www.echartsjs.com/gallery/';
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="left-chart-nav"><ul></ul></div><div id="explore-container"><div class="chart-list-panel"></div></div><div style="display:none">点击查看详情</div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-lazyload@1.9.7/jquery.lazyload.min.js"></script><script type="text/javascript">var GALLERY_PATH = 'https://www.echartsjs.com/gallery/';
 var GALLERY_EDITOR_PATH = GALLERY_PATH + 'editor.html?c=';
 var GALLERY_VIEW_PATH = GALLERY_PATH + 'view.html?c=';
 var GALLERY_THUMB_PATH = GALLERY_PATH + 'data/thumb/';
-</script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/config.js?_v_=1598903776431"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/chart-list.js?_v_=1598903776431"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/examples-nav.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/config.js?_v_=1603774175523"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/chart-list.js?_v_=1603774175523"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/examples-nav.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-examples').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/faq.html b/zh/faq.html
index 91cd7fc..5f56263 100644
--- a/zh/faq.html
+++ b/zh/faq.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,7 +9,7 @@
 </script><title>FAQ - Apache ECharts (incubating)</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-www.cdn.bcebos.com/zh/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
 <!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>FAQ</h1><p>常见问题的解答</p><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="faq-page" class="page-content single-page"><div class="page-nav"><h4>常见问题</h4><ul></ul></div><div class="page-detail"><h2 id="ask-questions">通用问题</h2><h3>有技术问题怎么办?</h3><p>1)建议您在提问前,大致阅读一下<a href="https://echarts.apache.org/zh/option.html">配置项手册</a>左侧导航,了解 ECharts 有哪些配置项,并且在相关的组件下查找是否有实现您需要功能的配置项;</p><p>2)查看本页常见问题的解答;</p><p>3)建议在 <a href="https://gallery.echartsjs.com/editor.html">ECharts Gallery</a> 上添加图表,复现你的问题,如果无法使用代码描述需求,可以尝试提供设计稿或画个草图;</p><p>4)推荐在 <a href="https://stackoverflow.com">stackoverflow.com</a>、<a href="https://www.oschina.net/question/tag/echarts">开源中国</a> 或 <a href="https://segmentfault.com/t/echarts">segmentfault.com</a> 等问答平台上提问,附上图表链接。</p><h3>ECharts 可以免费商用吗?</h3><p>可以,ECharts 基于 <a href="./license.html">Apache License 2.0</a> 开源。</p><h2 id="axis">坐标轴</h2><h3>坐标轴标签显示空间不够怎么办?</h3><p>可以用 <a href="https://echarts.apache.org/zh/option.html#xAxis.interval">interval</a> 控制每隔多少显示标签,设为 <code>0</code> 则显示所有标签。</p><p>或者,可以设置 <a href="https://echarts.apache.org/zh/option.html#yAxis.axisLabel.rotate">axisLabel.rotate</a>,将标签旋转一定角度。</p><h3>把坐标轴设置在右侧好像没有效果?</h3><p>需要将 <a href="https://echarts.apache.org/zh/option.html#yAxis.axisLine.onZero">onZero</a> 设为 <code>false</code> 才行。</p><h3>如何强制显示坐标轴第一个/最后一个标签?</h3><p>ECharts 3.5.2 版本起,支持 <a href="https://echarts.apache.org/zh/option.html#xAxis.axisLabel.showMinLabel">axisLabel.showMinLabel</a> 以及 <a href="https://echarts.apache.org/zh/option.html#xAxis.axisLabel.showMaxLabel">axisLabel.showMaxLabel</a>,分别用来控制第一个/最后一个标签是否强制显示,设为 <code>true</code> 则强制显示。</p><p>如果不方便更新版本,可以参考<a href="https://gallery.echartsjs.com/editor.html?c=xry06afSje">这个例子</a>实现同样的效果。</p><h2 id="legend">图例 legend</h2><h3>图例区域太大导致遮挡住图表怎么办?</h3><p>可以设置 <a href="https://echarts.apache.org/zh/option.html#grid">grid</a> 控制图表区域位置。例如将 <code>grid.top</code> 设置得大一些,可以将绘图区域下移。</p><p>在未来的版本中,我们计划会将布局做得更智能,自动处理这些遮挡问题。</p><h2 id="line-chart">折线图</h2><h3>坐标轴刻度好像和数据不匹配?</h3><p>请检查一下是否设置了 <code>stack</code>,如果不是想做堆积折线图的话,应该将其去掉。</p><h2 id="bar-chart">柱状图</h2><h3>为什么数据值很小的时候,y 轴的刻度会消失?</h3><p>ECharts 3.5.2 版本修复了该问题。</p><h2 id="map-chart">地图</h2><h3>图表上的省份名称重叠,如何修改名称的位置?</h3><p>可以修改地图文件(JS 或 JSON)中对应省份的 <code>cp</code> 坐标,或者通过 <code>echarts.getMap('china')</code> 修改已加载的地图数据。</p><p>更详细的做法请参考:<a href="https://github.com/apache/incubator-echarts/issues/4379#issuecomment-257765948">GitHub</a></p><h3>其他国家的地图在哪里下载?</h3><p>可以在<a href="https://github.com/echarts-maps/echarts-countries-js">这里</a>下载到其他国家的地图信息。</p><h3>如何获取地图的缩放事件?</h3><p>首先,需要将系列的 <a href="https://echarts.apache.org/zh/option.html#series-map.roam">roam</a> 设置为 <code>true</code>,然后可以监听 <code>'georoam'</code> 事件。例:</p><pre><code>myChart.on('georoam', function (params) {
    console.log(params);
-});</code></pre><p>参见这个<a href="https://gallery.echartsjs.com/editor.html?c=xHyqn_rQ6g">完整的例子</a>。</p><h3>如何制作自定义地图?</h3><p>ECharts 地图在地图坐标的基础上进行过<a href="https://github.com/apache/incubator-echarts/blob/8eeb7e5abe207d0536c62ce1f4ddecc6adfdf85e/src/util/mapData/rawData/encode.js">额外的编码</a>。可以使用 <a href="https://github.com/giscafer/mapshaper-plus">mapshaper-plus</a> 工具,上传自定义的 geojson 文件,生成 ECharts 可以使用的地图文件。</p><h2 id="baidu-map">百度地图</h2><h3>如何结合百度地图使用 ECharts?</h3><ol><li>引入 <code>echarts.js</code>、<code>bmap.js</code> 以及 <code>https://api.map.baidu.com/api?v=2.0&ak=这里填在百度开发平台注册得到的 access key</code>;</li><li>在 <code>option</code> 中设置 <code>bmap</code>,参考<a href="https://echarts.apache.org/examples/zh/editor.html?c=effectScatter-bmap">这个例子</a>;</li><li>如需获得百度地图实例,可以通过 <code>chart.getModel().getComponent('bmap').getBMap()</code>,然后根据<a href="https://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html">百度地图 API</a>做进一步设置。</li></ol><p><a href="https://gallery.echartsjs.com/explore.html#components=bmap~sort=rank~timeframe=all~author=all">Gallery</a> 上有更多百度地图的例子,可作为参考。</p><h2 id="gauge-chart">仪表盘</h2><h3>怎么设置仪表盘颜色?</h3><p>可以使用 <a href="https://echarts.apache.org/zh/option.html#series-gauge.axisLine.lineStyle.color">axisLine.lineStyle.color</a> 设置。</p><h2 id="event">事件处理</h2><h3>如何获取图表点击等事件?</h3><p>参考<a href="https://echarts.apache.org/zh/tutorial.html#ECharts%20%E4%B8%AD%E7%9A%84%E4%BA%8B%E4%BB%B6%E5%92%8C%E8%A1%8C%E4%B8%BA">官网教程</a>。ECharts 支持的事件类型请参考<a href="https://echarts.apache.org/zh/api.html#events">相关 API</a>。</p><h2 id="others">其他</h2><h3>图表为什么不显示?</h3><p>你可以检查以下情况:</p><ul><li><code>echarts.js</code> 是否正常被加载;</li><li><code>echarts</code> 变量是否存在;</li><li>调用 <code>echarts.init</code> 的时候,DOM 容器是否有宽高。</li></ul><h3>ECharts 有哪些学习资料?</h3><p>官网是最好的学习平台。此外,在 <a href="https://gallery.echartsjs.com">ECharts Gallery</a> 上学习别人的作品也是一个不错的选择。</p><p>ECharts 相关项目及资源请参见 <a href="https://github.com/ecomfe/awesome-echarts">awesome-echarts</a>。</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+});</code></pre><p>参见这个<a href="https://gallery.echartsjs.com/editor.html?c=xHyqn_rQ6g">完整的例子</a>。</p><h3>如何制作自定义地图?</h3><p>ECharts 地图在地图坐标的基础上进行过<a href="https://github.com/apache/incubator-echarts/blob/8eeb7e5abe207d0536c62ce1f4ddecc6adfdf85e/src/util/mapData/rawData/encode.js">额外的编码</a>。可以使用 <a href="https://github.com/giscafer/mapshaper-plus">mapshaper-plus</a> 工具,上传自定义的 geojson 文件,生成 ECharts 可以使用的地图文件。</p><h2 id="baidu-map">百度地图</h2><h3>如何结合百度地图使用 ECharts?</h3><ol><li>引入 <code>echarts.js</code>、<code>bmap.js</code> 以及 <code>https://api.map.baidu.com/api?v=2.0&ak=这里填在百度开发平台注册得到的 access key</code>;</li><li>在 <code>option</code> 中设置 <code>bmap</code>,参考<a href="https://echarts.apache.org/examples/zh/editor.html?c=effectScatter-bmap">这个例子</a>;</li><li>如需获得百度地图实例,可以通过 <code>chart.getModel().getComponent('bmap').getBMap()</code>,然后根据<a href="https://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html">百度地图 API</a>做进一步设置。</li></ol><p><a href="https://gallery.echartsjs.com/explore.html#components=bmap~sort=rank~timeframe=all~author=all">Gallery</a> 上有更多百度地图的例子,可作为参考。</p><h2 id="gauge-chart">仪表盘</h2><h3>怎么设置仪表盘颜色?</h3><p>可以使用 <a href="https://echarts.apache.org/zh/option.html#series-gauge.axisLine.lineStyle.color">axisLine.lineStyle.color</a> 设置。</p><h2 id="event">事件处理</h2><h3>如何获取图表点击等事件?</h3><p>参考<a href="https://echarts.apache.org/zh/tutorial.html#ECharts%20%E4%B8%AD%E7%9A%84%E4%BA%8B%E4%BB%B6%E5%92%8C%E8%A1%8C%E4%B8%BA">官网教程</a>。ECharts 支持的事件类型请参考<a href="https://echarts.apache.org/zh/api.html#events">相关 API</a>。</p><h2 id="others">其他</h2><h3>图表为什么不显示?</h3><p>你可以检查以下情况:</p><ul><li><code>echarts.js</code> 是否正常被加载;</li><li><code>echarts</code> 变量是否存在;</li><li>调用 <code>echarts.init</code> 的时候,DOM 容器是否有宽高。</li></ul><h3>ECharts 有哪些学习资料?</h3><p>官网是最好的学习平台。此外,在 <a href="https://gallery.echartsjs.com">ECharts Gallery</a> 上学习别人的作品也是一个不错的选择。</p><p>ECharts 相关项目及资源请参见 <a href="https://github.com/ecomfe/awesome-echarts">awesome-echarts</a>。</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/feature.html b/zh/feature.html
index b9003be..10af9cf 100644
--- a/zh/feature.html
+++ b/zh/feature.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>特性 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>特性</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content single-page"><div class="page-nav"><h4>特性</h4><ul></ul></div><div class="page-detail"><p class="page-detail-desc">ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖矢量图形库 <a href="https://github.com/ecomfe/zrender" target="_blank">ZRender</a>,提供直观,交互丰富,可高度个性化定制的数据可视化图表。</p><h2 id="chart-types">丰富的可视化类型</h2><p>ECharts 提供了常规的<a href="option.html#series-line" target="_blank">折线图</a>、<a href="option.html#series-bar" target="_blank">柱状图</a>、<a href="option.html#series-scatter" target="_blank">散点图</a>、<a href="option.html#series-pie" target="_blank">饼图</a>、<a href="option.html#series-candlestick" target="_blank">K线图</a>,用于统计的<a href="option.html#series-boxplot" target="_blank">盒形图</a>,用于地理数据可视化的<a href="option.html#series-map" target="_blank">地图</a>、<a href="option.html#series-heatmap" target="_blank">热力图</a>、<a href="option.html#series-lines" target="_blank">线图</a>,用于关系数据可视化的<a href="option.html#series-graph" target="_blank">关系图</a>、<a href="option.html#series-treemap" target="_blank">treemap</a>、<a href="option.html#series-sunburst">旭日图</a>,多维数据可视化的<a href="option.html#series-parallel" target="_blank">平行坐标</a>,还有用于 BI 的<a href="option.html#series-funnel" target="_blank">漏斗图</a>,<a href="option.html#series-gauge" target="_blank">仪表盘</a>,并且支持图与图之间的混搭。</p><p>除了已经内置的包含了丰富功能的图表,ECharts 还提供了<a href="option.html#series-custom">自定义系列</a>,只需要传入一个<em>renderItem</em>函数,就可以从数据映射到任何你想要的图形,更棒的是这些都还能和已有的交互组件结合使用而不需要操心其它事情。</p><p>你可以在下载界面下载包含所有图表的构建文件,如果只是需要其中一两个图表,又嫌包含所有图表的构建文件太大,也可以在在线构建中选择需要的图表类型后自定义构建。</p><h2 id="dataset">多种数据格式无需转换直接使用</h2><p>ECharts 内置的 dataset 属性(4.0+)支持直接传入包括二维表,key-value 等多种格式的数据源,通过简单的设置 encode 属性就可以完成从数据到图形的映射,这种方式更符合可视化的直觉,省去了大部分场景下数据转换的步骤,而且多个组件能够共享一份数据而不用克隆。</p><p>为了配合大数据量的展现,ECharts 还支持输入 TypedArray 格式的数据,TypedArray 在大数据量的存储中可以占用更少的内存,对 GC 友好等特性也可以大幅度提升可视化应用的性能。</p><h2 id="big-data">千万数据的前端展现</h2><p>通过增量渲染技术(4.0+),配合各种细致的优化,ECharts 能够展现千万级的数据量,并且在这个数据量级依然能够进行流畅的缩放平移等交互。</p><p>几千万的地理坐标数据就算使用二进制存储也要占上百 MB 的空间。因此 ECharts 同时提供了对流加载(4.0+)的支持,你可以使用 WebSocket 或者对数据分块后加载,加载多少渲染多少!不需要漫长地等待所有数据加载完再进行绘制。</p><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/scatterGL.jpg?_v_=20200710_1" width="60%"><br /><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/scatterGL2.jpg?_v_=20200710_1" width="30%"><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/scatterGL3.jpg?_v_=20200710_1" width="30%"><h2 id="mobile">移动端优化</h2><p>ECharts 针对移动端交互做了细致的优化,例如移动端小屏上适于用手指在坐标系中进行缩放、平移。 PC 端也可以用鼠标在图中进行缩放(用鼠标滚轮)、平移等。</p><p>细粒度的模块化和打包机制可以让 ECharts 在移动端也拥有很小的体积,可选的 SVG 渲染模块让移动端的内存占用不再捉襟见肘。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=area-simple&amp;reset=1&amp;edit=1&amp;renderer=svg" width="60%" height="400"></iframe><h2 id="mult-platform">多渲染方案,跨平台使用!</h2><p>ECharts 支持以 Canvas、SVG(4.0+)、VML 的形式渲染图表。VML 可以兼容低版本 IE,SVG 使得移动端不再为内存担忧,Canvas 可以轻松应对大数据量和特效的展现。不同的渲染方式提供了更多选择,使得 ECharts 在各种场景下都有更好的表现。</p><p>除了 PC 和移动端的浏览器,ECharts 还能在 node 上配合 node-canvas 进行高效的服务端渲染(SSR)。从 4.0 开始我们还和微信小程序的团队合作,提供了 ECharts 对小程序的适配!</p><p>社区热心的贡献者也为我们提供了丰富的其它语言扩展,比如 Python 的<a href="https://github.com/pyecharts/pyecharts" target="_blank">pyecharts</a>,R 语言的 <a href="https://github.com/cosname/recharts" target="_blank">recharts</a>, Julia 的 <a href="https://github.com/randyzwitch/ECharts.jl">ECharts.jl</a> 等等。</p><p>我们希望平台和语言都不会成为大家使用 ECharts 实现可视化的限制!</p><h2 id="interaction">深度的交互式数据探索</h2><p>交互是从数据中发掘信息的重要手段。“总览为先,缩放过滤按需查看细节”是数据可视化交互的基本需求。</p><p>ECharts 一直在<em>交互</em>的路上前进,我们提供了 <a href="option.html#legend" target="_blank">图例</a>、<a href="option.html#visualMap" target="_blank">视觉映射</a>、<a href="option.html#dataZoom" target="_blank">数据区域缩放</a>、<a href="option.html#tooltip" target="_blank">tooltip</a>、<a href="option.html#brush">数据刷选</a>等开箱即用的交互组件,可以对数据进行多维度数据筛取、视图缩放、展示细节等交互操作。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=scatter-matrix&amp;reset=1&amp;edit=1" width="60%" height="540"></iframe><h2 id="visual-mapping">多维数据的支持以及丰富的视觉编码手段</h2><p>ECharts 3 开始加强了对多维数据的支持。除了加入了平行坐标等常见的多维数据可视化工具外,对于传统的散点图等,传入的数据也可以是多个维度的。配合视觉映射组件 <a href="option.html#visualMap" target="_blank">visualMap</a> 提供的丰富的视觉编码,能够将不同维度的数据映射到颜色、大小、透明度、明暗度等不同的视觉通道。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=scatter-nutrients-matrix&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="dynamic-data">动态数据</h2><p>ECharts 由数据驱动,数据的改变驱动图表展现的改变。因此动态数据的实现也变得异常简单,只需要获取数据,填入数据,ECharts 会找到两组数据之间的差异然后通过合适的动画去表现数据的变化。配合 <a href="option.html#timeline" target="_blank">timeline</a> 组件能够在更高的时间维度上去表现数据的信息。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=scatter-life-expectancy-timeline&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="fancy-effects">绚丽的特效</h2><p>ECharts 针对线数据,点数据等地理数据的可视化提供了吸引眼球的特效。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=lines-bmap-effect&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="gl">通过 GL 实现更多更强大绚丽的三维可视化</h2><p>想要在 VR,大屏场景里实现三维的可视化效果?我们提供了基于 WebGL 的 ECharts GL,你可以跟使用 ECharts 普通组件一样轻松的使用 ECharts GL 绘制出三维的地球,建筑群,人口分布的柱状图,在这基础之上我们还提供了不同层级的画面配置项,几行配置就能得到艺术化的画面!</p><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/flowGL-line.jpg?_v_=20200710_1" width="40%"><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/buildings-ny.jpg?_v_=20200710_1" width="40%"><br /><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/capetown-taxi.jpg?_v_=20200710_1" width="40%"><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/population.jpg?_v_=20200710_1" width="40%"><h2 id="aria">无障碍访问(4.0+)</h2><p>当我们说到“可视化”的时候,我们往往很自然地将它与“看得⻅”联系在一起,但其 实这是片面的。W3C制定了无障碍富互联网应用规范集(WAI-ARIA,the Accessible Rich Internet Applications Suite),致力于使得网⻚内容和网⻚应 用能够被更多残障人士访问。</p><p>ECharts 4.0 遵从这一规范,支持自动根据图表配置项智能生成描述,使得盲人可 以在朗读设备的帮助下了解图表内容,让图表可以被更多人群访问!</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>特性</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content single-page"><div class="page-nav"><h4>特性</h4><ul></ul></div><div class="page-detail"><p class="page-detail-desc">ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖矢量图形库 <a href="https://github.com/ecomfe/zrender" target="_blank">ZRender</a>,提供直观,交互丰富,可高度个性化定制的数据可视化图表。</p><h2 id="chart-types">丰富的可视化类型</h2><p>ECharts 提供了常规的<a href="option.html#series-line" target="_blank">折线图</a>、<a href="option.html#series-bar" target="_blank">柱状图</a>、<a href="option.html#series-scatter" target="_blank">散点图</a>、<a href="option.html#series-pie" target="_blank">饼图</a>、<a href="option.html#series-candlestick" target="_blank">K线图</a>,用于统计的<a href="option.html#series-boxplot" target="_blank">盒形图</a>,用于地理数据可视化的<a href="option.html#series-map" target="_blank">地图</a>、<a href="option.html#series-heatmap" target="_blank">热力图</a>、<a href="option.html#series-lines" target="_blank">线图</a>,用于关系数据可视化的<a href="option.html#series-graph" target="_blank">关系图</a>、<a href="option.html#series-treemap" target="_blank">treemap</a>、<a href="option.html#series-sunburst">旭日图</a>,多维数据可视化的<a href="option.html#series-parallel" target="_blank">平行坐标</a>,还有用于 BI 的<a href="option.html#series-funnel" target="_blank">漏斗图</a>,<a href="option.html#series-gauge" target="_blank">仪表盘</a>,并且支持图与图之间的混搭。</p><p>除了已经内置的包含了丰富功能的图表,ECharts 还提供了<a href="option.html#series-custom">自定义系列</a>,只需要传入一个<em>renderItem</em>函数,就可以从数据映射到任何你想要的图形,更棒的是这些都还能和已有的交互组件结合使用而不需要操心其它事情。</p><p>你可以在下载界面下载包含所有图表的构建文件,如果只是需要其中一两个图表,又嫌包含所有图表的构建文件太大,也可以在在线构建中选择需要的图表类型后自定义构建。</p><h2 id="dataset">多种数据格式无需转换直接使用</h2><p>ECharts 内置的 dataset 属性(4.0+)支持直接传入包括二维表,key-value 等多种格式的数据源,通过简单的设置 encode 属性就可以完成从数据到图形的映射,这种方式更符合可视化的直觉,省去了大部分场景下数据转换的步骤,而且多个组件能够共享一份数据而不用克隆。</p><p>为了配合大数据量的展现,ECharts 还支持输入 TypedArray 格式的数据,TypedArray 在大数据量的存储中可以占用更少的内存,对 GC 友好等特性也可以大幅度提升可视化应用的性能。</p><h2 id="big-data">千万数据的前端展现</h2><p>通过增量渲染技术(4.0+),配合各种细致的优化,ECharts 能够展现千万级的数据量,并且在这个数据量级依然能够进行流畅的缩放平移等交互。</p><p>几千万的地理坐标数据就算使用二进制存储也要占上百 MB 的空间。因此 ECharts 同时提供了对流加载(4.0+)的支持,你可以使用 WebSocket 或者对数据分块后加载,加载多少渲染多少!不需要漫长地等待所有数据加载完再进行绘制。</p><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/scatterGL.jpg?_v_=20200710_1" width="60%"><br /><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/scatterGL2.jpg?_v_=20200710_1" width="30%"><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/scatterGL3.jpg?_v_=20200710_1" width="30%"><h2 id="mobile">移动端优化</h2><p>ECharts 针对移动端交互做了细致的优化,例如移动端小屏上适于用手指在坐标系中进行缩放、平移。 PC 端也可以用鼠标在图中进行缩放(用鼠标滚轮)、平移等。</p><p>细粒度的模块化和打包机制可以让 ECharts 在移动端也拥有很小的体积,可选的 SVG 渲染模块让移动端的内存占用不再捉襟见肘。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=area-simple&amp;reset=1&amp;edit=1&amp;renderer=svg" width="60%" height="400"></iframe><h2 id="mult-platform">多渲染方案,跨平台使用!</h2><p>ECharts 支持以 Canvas、SVG(4.0+)、VML 的形式渲染图表。VML 可以兼容低版本 IE,SVG 使得移动端不再为内存担忧,Canvas 可以轻松应对大数据量和特效的展现。不同的渲染方式提供了更多选择,使得 ECharts 在各种场景下都有更好的表现。</p><p>除了 PC 和移动端的浏览器,ECharts 还能在 node 上配合 node-canvas 进行高效的服务端渲染(SSR)。从 4.0 开始我们还和微信小程序的团队合作,提供了 ECharts 对小程序的适配!</p><p>社区热心的贡献者也为我们提供了丰富的其它语言扩展,比如 Python 的<a href="https://github.com/pyecharts/pyecharts" target="_blank">pyecharts</a>,R 语言的 <a href="https://github.com/cosname/recharts" target="_blank">recharts</a>, Julia 的 <a href="https://github.com/randyzwitch/ECharts.jl">ECharts.jl</a> 等等。</p><p>我们希望平台和语言都不会成为大家使用 ECharts 实现可视化的限制!</p><h2 id="interaction">深度的交互式数据探索</h2><p>交互是从数据中发掘信息的重要手段。“总览为先,缩放过滤按需查看细节”是数据可视化交互的基本需求。</p><p>ECharts 一直在<em>交互</em>的路上前进,我们提供了 <a href="option.html#legend" target="_blank">图例</a>、<a href="option.html#visualMap" target="_blank">视觉映射</a>、<a href="option.html#dataZoom" target="_blank">数据区域缩放</a>、<a href="option.html#tooltip" target="_blank">tooltip</a>、<a href="option.html#brush">数据刷选</a>等开箱即用的交互组件,可以对数据进行多维度数据筛取、视图缩放、展示细节等交互操作。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=scatter-matrix&amp;reset=1&amp;edit=1" width="60%" height="540"></iframe><h2 id="visual-mapping">多维数据的支持以及丰富的视觉编码手段</h2><p>ECharts 3 开始加强了对多维数据的支持。除了加入了平行坐标等常见的多维数据可视化工具外,对于传统的散点图等,传入的数据也可以是多个维度的。配合视觉映射组件 <a href="option.html#visualMap" target="_blank">visualMap</a> 提供的丰富的视觉编码,能够将不同维度的数据映射到颜色、大小、透明度、明暗度等不同的视觉通道。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=scatter-nutrients-matrix&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="dynamic-data">动态数据</h2><p>ECharts 由数据驱动,数据的改变驱动图表展现的改变。因此动态数据的实现也变得异常简单,只需要获取数据,填入数据,ECharts 会找到两组数据之间的差异然后通过合适的动画去表现数据的变化。配合 <a href="option.html#timeline" target="_blank">timeline</a> 组件能够在更高的时间维度上去表现数据的信息。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=scatter-life-expectancy-timeline&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="fancy-effects">绚丽的特效</h2><p>ECharts 针对线数据,点数据等地理数据的可视化提供了吸引眼球的特效。</p><iframe data-src="https://echarts.apache.org/examples/zh/view.html?c=lines-bmap-effect&amp;reset=1&amp;edit=1" width="60%" height="400"></iframe><h2 id="gl">通过 GL 实现更多更强大绚丽的三维可视化</h2><p>想要在 VR,大屏场景里实现三维的可视化效果?我们提供了基于 WebGL 的 ECharts GL,你可以跟使用 ECharts 普通组件一样轻松的使用 ECharts GL 绘制出三维的地球,建筑群,人口分布的柱状图,在这基础之上我们还提供了不同层级的画面配置项,几行配置就能得到艺术化的画面!</p><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/flowGL-line.jpg?_v_=20200710_1" width="40%"><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/buildings-ny.jpg?_v_=20200710_1" width="40%"><br /><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/capetown-taxi.jpg?_v_=20200710_1" width="40%"><img src="https://echarts-www.cdn.bcebos.com/zh/images/features/population.jpg?_v_=20200710_1" width="40%"><h2 id="aria">无障碍访问(4.0+)</h2><p>当我们说到“可视化”的时候,我们往往很自然地将它与“看得⻅”联系在一起,但其 实这是片面的。W3C制定了无障碍富互联网应用规范集(WAI-ARIA,the Accessible Rich Internet Applications Suite),致力于使得网⻚内容和网⻚应 用能够被更多残障人士访问。</p><p>ECharts 4.0 遵从这一规范,支持自动根据图表配置项智能生成描述,使得盲人可 以在朗读设备的帮助下了解图表内容,让图表可以被更多人群访问!</p><footer class="inner-footer"><div class="container"><div class="row"><div class="col-md-8"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-4"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a></div></div></div></footer></div></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/images/extensions/arcgis.jpg b/zh/images/extensions/arcgis.jpg
index 10a81c1..4f26a1e 100644
--- a/zh/images/extensions/arcgis.jpg
+++ b/zh/images/extensions/arcgis.jpg
Binary files differ
diff --git a/zh/images/extensions/bmap.jpg b/zh/images/extensions/bmap.jpg
index 7ac617b..1d6ffaa 100644
--- a/zh/images/extensions/bmap.jpg
+++ b/zh/images/extensions/bmap.jpg
Binary files differ
diff --git a/zh/images/extensions/gl.png b/zh/images/extensions/gl.png
old mode 100755
new mode 100644
index 9a99272..009b0a3
--- a/zh/images/extensions/gl.png
+++ b/zh/images/extensions/gl.png
Binary files differ
diff --git a/zh/images/extensions/leaflet-2.jpg b/zh/images/extensions/leaflet-2.jpg
index bc34204..32f0650 100644
--- a/zh/images/extensions/leaflet-2.jpg
+++ b/zh/images/extensions/leaflet-2.jpg
Binary files differ
diff --git a/zh/images/extensions/leaflet.jpg b/zh/images/extensions/leaflet.jpg
deleted file mode 100644
index d65b33e..0000000
--- a/zh/images/extensions/leaflet.jpg
+++ /dev/null
Binary files differ
diff --git a/zh/images/extensions/liquidfill.jpg b/zh/images/extensions/liquidfill.jpg
index 8a53c45..7c7c71e 100644
--- a/zh/images/extensions/liquidfill.jpg
+++ b/zh/images/extensions/liquidfill.jpg
Binary files differ
diff --git a/zh/images/extensions/mapbox.jpg b/zh/images/extensions/mapbox.jpg
index 77bebce..25b4171 100644
--- a/zh/images/extensions/mapbox.jpg
+++ b/zh/images/extensions/mapbox.jpg
Binary files differ
diff --git a/zh/images/extensions/modularity.jpg b/zh/images/extensions/modularity.jpg
index a3918d9..f418f45 100644
--- a/zh/images/extensions/modularity.jpg
+++ b/zh/images/extensions/modularity.jpg
Binary files differ
diff --git a/zh/images/extensions/stat.jpg b/zh/images/extensions/stat.jpg
index f3a7fd6..fabf561 100644
--- a/zh/images/extensions/stat.jpg
+++ b/zh/images/extensions/stat.jpg
Binary files differ
diff --git a/zh/images/extensions/word-cloud.jpg b/zh/images/extensions/word-cloud.jpg
index 3d5c490..ef0c594 100644
--- a/zh/images/extensions/word-cloud.jpg
+++ b/zh/images/extensions/word-cloud.jpg
Binary files differ
diff --git a/zh/index.html b/zh/index.html
index 6fd2466..240837b 100644
--- a/zh/index.html
+++ b/zh/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -15,9 +15,9 @@
     window.supportTouch = 'ontouchstart' in window && !ie && !edge;
 })()
 
-</script><section id="feature-section"><div class="container"><div class="row features"><p>Apache ECharts (incubating)<sup>TM</sup> 是一个正在 <a target="_blank" href="https://www.apache.org/">Apache Software Foundation</a> (ASF) 孵化中的项目。</p></div><div class="row features"><div class="col-sm-4"><div class="feature-icon-panel"><svg width="36px" height="33px" viewbox="0 0 36 33" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><defs></defs><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-320.000000, -826.000000)" stroke="#333743" stroke-width="2"><g id="Group-7" transform="translate(321.000000, 827.387847)"><path id="Oval-1-Copy-2" d="M17,29.5876845 C17,29.5876845 0.5,15.970603 0.5,10.4351463 C0.5,4.89968971 5.02192403,0.41231548 10.6,0.41231548 C13.0289902,0.41231548 17,3.27642672 17,3.27642672 C17,3.27642672 20.9710098,0.41231548 23.4,0.41231548 C28.978076,0.41231548 33.5,4.89968971 33.5,10.4351463 C33.5,15.970603 17,29.5876845 17,29.5876845 Z"></path><path id="Path-4" d="M8.97721839,4.43098465 C8.97721839,4.43098465 4.65711371,4.98291942 5.76387751,8.9986647"></path></g></g></g></svg></div><h3>开源免费</h3><p>遵循 Apache-2.0 开源协议,免费商用</p></div><div class="col-sm-4"><div class="feature-icon-panel"><svg width="37px" height="36px" viewbox="0 0 37 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><defs><rect id="path-1" x="0.402989808" y="0.675409258" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-2" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-1"></use></mask><rect id="path-3" x="0.402989808" y="19.9416819" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-4" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-3"></use></mask><rect id="path-5" x="20.0265472" y="0.675409258" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-6" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-5"></use></mask><rect id="path-7" x="20.0265472" y="19.9416819" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-8" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-7"></use></mask></defs><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-701.000000, -824.000000)"><g id="Group-12" transform="translate(702.000000, 824.000000)"><use id="Rectangle-2" stroke="#333743" mask="url(#mask-2)" stroke-width="4" xlink:href="#path-1"></use><path id="Line" d="M16.6179041,10.4063517 L0.445091444,10.4063517" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy-3" d="M16.6179041,5.4063517 L0.445091444,5.4063517" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy" d="M6,1.07200204 L6,16.2280375" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy-2" d="M11,1.07200204 L11,16.2280375" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><use id="Rectangle-2-Copy-2" stroke="#333743" mask="url(#mask-4)" stroke-width="4" xlink:href="#path-3"></use><use id="Rectangle-2-Copy" stroke="#333743" mask="url(#mask-6)" stroke-width="4" xlink:href="#path-5"></use><use id="Rectangle-2-Copy-3" stroke="#333743" mask="url(#mask-8)" stroke-width="4" xlink:href="#path-7"></use></g></g></g></svg></div><h3>功能丰富</h3><p>涵盖各行业图表,满足各种需求</p></div><div class="col-sm-4"><div class="feature-icon-panel"><svg width="36px" height="31px" viewbox="0 0 36 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-1084.000000, -827.000000)" fill="#333743"><g id="Group-38" transform="translate(1057.000000, 797.000000)"><path id="Shape" d="M63,56.361686 C63,51.671658 60.3077922,47.6639411 56.5050056,46.0305295 C58.3479474,44.7003672 59.5616758,42.4363346 59.5616758,39.8656065 C59.5616758,36.354116 57.2992585,33.4181102 54.2632182,32.6530946 C54.2357116,32.6462026 54.2082051,32.6496486 54.1841368,32.6599867 C54.1497535,32.6565406 54.1153703,32.6496486 54.0809871,32.6496486 C53.4311438,32.6496486 52.9050802,33.2182413 52.9050802,33.9177826 C52.9050802,34.5518495 53.3348707,35.068752 53.8953176,35.1652404 C53.995029,35.2100386 54.1256853,35.2410528 54.1325619,35.2444988 C55.8895456,35.8889038 57.1582872,37.6842783 57.1582872,39.8001322 C57.1582872,42.1606533 55.5835347,44.1214365 53.5067869,44.5315124 C53.5033486,44.5315124 53.4999103,44.5384045 53.4999103,44.5384045 C52.8088071,44.5866487 52.2586752,45.2000396 52.2586752,45.9581631 C52.2586752,46.7266247 52.8225604,47.3503537 53.5274169,47.3813678 C53.5308552,47.3848138 53.5377318,47.3917059 53.5411702,47.3917059 C57.718734,47.850026 60.6791312,51.688888 60.6791312,56.361686 C60.6791312,57.0543353 61.1983181,57.6160359 61.8412847,57.6160359 C62.4670598,57.6160359 62.9724934,57.0819034 62.9965617,56.4133762 C62.9965617,56.4064842 63,56.4030382 63,56.3961462 L63,56.3892541 L63,56.361686 L63,56.361686 Z M27,55.9123667 C27,51.2223386 29.6922078,47.2146218 33.4949944,45.5812101 C31.6520526,44.2510479 30.4383242,41.9870152 30.4383242,39.4162872 C30.4383242,35.9047967 32.7007415,32.9687909 35.7367818,32.2037753 C35.7642884,32.1968832 35.7917949,32.2003293 35.8158632,32.2106673 C35.8502465,32.2072213 35.8846297,32.2003293 35.9190129,32.2003293 C36.5688562,32.2003293 37.0949198,32.7689219 37.0949198,33.4684632 C37.0949198,34.1025302 36.6651293,34.6194326 36.1046824,34.7159211 C36.004971,34.7607193 35.8743147,34.7917334 35.8674381,34.7951795 C34.1104544,35.4395845 32.8417128,37.2349589 32.8417128,39.3508129 C32.8417128,41.7113339 34.4164653,43.6721172 36.4932131,44.0821931 C36.4966514,44.0821931 36.5000897,44.0890851 36.5000897,44.0890851 C37.1911929,44.1373293 37.7413248,44.7507202 37.7413248,45.5088438 C37.7413248,46.2773054 37.1774396,46.9010343 36.4725831,46.9320485 C36.4691448,46.9354945 36.4622682,46.9423865 36.4588298,46.9423865 C32.281266,47.4007067 29.3208688,51.2395687 29.3208688,55.9123667 C29.3208688,56.6050159 28.8016819,57.1667165 28.1587153,57.1667165 C27.5329402,57.1667165 27.0275066,56.632584 27.0034383,55.9640569 C27.0034383,55.9571649 27,55.9537189 27,55.9468268 L27,55.9399348 L27,55.9123667 L27,55.9123667 Z M49.0919787,46.2372904 C51.2925061,44.645231 52.7434789,41.9401083 52.7434789,38.8662618 C52.7434789,33.9694728 49.0644721,29.9996622 44.5258841,29.9996622 C39.9872962,29.9996622 36.3082893,33.9694728 36.3082893,38.8662618 C36.3082893,41.9401083 37.7592621,44.645231 39.9597896,46.2372904 C35.4074484,48.1980736 32.1926153,52.9914822 32.1926153,58.6015965 C32.1926153,58.91863 32.2098069,59.2287715 32.2304368,59.5389129 L32.2338752,59.5389129 C32.2338752,60.2212241 32.7461855,60.7760327 33.3788371,60.7760327 C34.0114888,60.7760327 34.5237991,60.2246701 34.5237991,59.5389129 C34.5237991,59.5010067 34.5169224,59.4631006 34.5134841,59.4251944 C34.4928542,59.1529591 34.4722242,58.8807238 34.4722242,58.6015965 C34.4722242,52.6089744 38.9729906,47.7535376 44.5224458,47.7535376 C50.0753394,47.7535376 54.5761057,52.6089744 54.5761057,58.6015965 C54.5761057,58.8910619 54.5554758,59.1736352 54.5348458,59.4562085 C54.5348458,59.4699926 54.5314075,59.4837767 54.5314075,59.4975607 L54.5314075,59.5354669 L54.5348458,59.5354669 C54.5554758,60.200548 55.0574711,60.7346805 55.6763695,60.7346805 C56.2952678,60.7346805 56.7972632,60.200548 56.8178931,59.5354669 L56.8213314,59.5354669 C56.8419614,59.2253255 56.859153,58.915184 56.859153,58.6015965 C56.8557147,52.9914822 53.6374432,48.1980736 49.0919787,46.2372904 L49.0919787,46.2372904 Z M44.5224458,45.2379457 C41.2629145,45.2379457 38.6188432,42.3846443 38.6188432,38.8662618 C38.6188432,35.3478793 41.2629145,32.4945779 44.5224458,32.4945779 C47.7819771,32.4945779 50.4260484,35.3478793 50.4260484,38.8662618 C50.4260484,42.3846443 47.7819771,45.2379457 44.5224458,45.2379457 L44.5224458,45.2379457 Z"></path></g></g></g></svg></div><h3>社区活跃</h3><p><a class="github-button" href="https://github.com/apache/incubator-echarts" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star apache/incubator-echarts on GitHub">GitHub Stars</a></p></div></div><div id="feature-4" class="row feature-detail"><div class="col-sm-4 col"><h2>全新 4.0</h2><h3 style="color:#000;font-weight:bold;margin-bottom:20px;">八项新科技</h3><p>千万级数据可视化渲染能力</p><p>SVG + Canvas 双引擎动力更佳</p><p>数据样式分离及扁平配置让开发更便捷</p><p>首创无障碍访问支持</p><p>微信小程序、PPT,哪里都能用</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><video id="video-feature-4" loop="true" muted="true" data-src="https://echarts.cdn.apache.org/zh/video/feature-4.mp4" poster="https://echarts-www.cdn.bcebos.com/zh/video/feature-4.jpg?_v_=20200710_1" class="lazy feature-video"></video><a id="video-feature-4-play" href="javascript:;" onclick="playVideo(&quot;video-feature-4&quot;)" class="feature-play-btn video-play-btn video-btn"><svg width="19px" height="25px" viewBox="0 0 19 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-23.000000, -18.000000)" fill="#AA344C"><path d="M41.365908,29.4271388 L41.3664843,29.4265626 L26.3794329,19.1497136 L26.3747509,19.1541315 C26.0642269,18.8592621 25.6429678,18.677793 25.1786824,18.677793 C24.2236284,18.677793 23.4494433,19.4443188 23.4494433,20.3905371 C23.4494433,20.910214 23.4270417,21.9276946 23.4494433,21.9056292 L23.4494433,30.6673861 L23.4494433,39.8901629 C23.4494433,39.8977982 23.4494433,40.4825908 23.4494433,40.9444991 C23.4494433,41.8901412 24.2236284,42.656691 25.1786824,42.656691 C25.6447205,42.656691 26.0677564,42.4740454 26.3782564,42.1764869 L26.3794329,42.1770872 L41.3664843,31.9005503 L41.3659081,31.8996379 C41.6917266,31.5882735 41.894997,31.1514078 41.894997,30.6670739 C41.894997,30.6658974 41.894997,30.6650091 41.894997,30.6635444 C41.894997,30.6623679 41.894997,30.6609273 41.894997,30.6600389 C41.894997,30.175657 41.6917265,29.7384792 41.365908,29.4271388 Z"></path></g></g></svg></a><a id="video-feature-4-pause" href="javascript:;" onclick="pauseVideo(&quot;video-feature-4&quot;)" class="feature-play-btn video-pause-btn video-btn"><svg width="17px" height="22px" viewBox="0 0 17 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-22.000000, -19.000000)" fill="#AA344C"><g transform="translate(22.667242, 19.000000)"><path d="M2,0 C3.1045695,-2.02906125e-16 4,0.8954305 4,2 L4,20 C4,21.1045695 3.1045695,22 2,22 C0.8954305,22 1.3527075e-16,21.1045695 0,20 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 Z M14,0 C15.1045695,-2.02906125e-16 16,0.8954305 16,2 L16,20 C16,21.1045695 15.1045695,22 14,22 C12.8954305,22 12,21.1045695 12,20 L12,2 C12,0.8954305 12.8954305,2.02906125e-16 14,0 Z"></path></g></g></g></svg></a></div></div><div id="feature-dimension" class="row feature-detail"><div class="col-sm-4 col mobile"><h2>多维度数据分析</h2><h3>数据自由刷选</h3><p>自由选择数据,发掘数据背后的更多秘密</p><h3>多图表联动查看</h3><p>对多个图表数据联动查看,进行多维有效分析</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><div id="col-desktop"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/feature-1.png?_v_=20200710_1" class="lazy"><video id="video-feature-1" loop="true" muted="true" data-src="https://echarts.cdn.apache.org/zh/video/feature-1.mp4" poster="https://echarts-www.cdn.bcebos.com/zh/video/feature-2.jpg?_v_=20200710_1" class="lazy feature-video"></video><a id="video-feature-1-play" href="javascript:;" onclick="playVideo(&quot;video-feature-1&quot;)" class="feature-play-btn video-play-btn video-btn"><svg width="19px" height="25px" viewBox="0 0 19 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-23.000000, -18.000000)" fill="#AA344C"><path d="M41.365908,29.4271388 L41.3664843,29.4265626 L26.3794329,19.1497136 L26.3747509,19.1541315 C26.0642269,18.8592621 25.6429678,18.677793 25.1786824,18.677793 C24.2236284,18.677793 23.4494433,19.4443188 23.4494433,20.3905371 C23.4494433,20.910214 23.4270417,21.9276946 23.4494433,21.9056292 L23.4494433,30.6673861 L23.4494433,39.8901629 C23.4494433,39.8977982 23.4494433,40.4825908 23.4494433,40.9444991 C23.4494433,41.8901412 24.2236284,42.656691 25.1786824,42.656691 C25.6447205,42.656691 26.0677564,42.4740454 26.3782564,42.1764869 L26.3794329,42.1770872 L41.3664843,31.9005503 L41.3659081,31.8996379 C41.6917266,31.5882735 41.894997,31.1514078 41.894997,30.6670739 C41.894997,30.6658974 41.894997,30.6650091 41.894997,30.6635444 C41.894997,30.6623679 41.894997,30.6609273 41.894997,30.6600389 C41.894997,30.175657 41.6917265,29.7384792 41.365908,29.4271388 Z"></path></g></g></svg></a><a id="video-feature-1-pause" href="javascript:;" onclick="pauseVideo(&quot;video-feature-1&quot;)" class="feature-play-btn video-pause-btn video-btn"><svg width="17px" height="22px" viewBox="0 0 17 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-22.000000, -19.000000)" fill="#AA344C"><g transform="translate(22.667242, 19.000000)"><path d="M2,0 C3.1045695,-2.02906125e-16 4,0.8954305 4,2 L4,20 C4,21.1045695 3.1045695,22 2,22 C0.8954305,22 1.3527075e-16,21.1045695 0,20 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 Z M14,0 C15.1045695,-2.02906125e-16 16,0.8954305 16,2 L16,20 C16,21.1045695 15.1045695,22 14,22 C12.8954305,22 12,21.1045695 12,20 L12,2 C12,0.8954305 12.8954305,2.02906125e-16 14,0 Z"></path></g></g></g></svg></a></div></div><div id="col-analysis" class="col-sm-4 col pc"><h2>多维度数据分析</h2><h3>数据自由刷选</h3><p>自由选择数据,发掘数据背后的更多秘密</p><h3>多图表联动查看</h3><p>对多个图表数据联动查看,进行多维有效分析</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div></div><div class="row feature-detail"><div id="col-data" class="col-sm-4 col"><h2>多设备随意展示</h2><h3>电脑/手机/平板/大屏  …</h3><p>兼容多种设备,可随时随地任性展示</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><div id="col-desktop"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/index-feature.jpg?_v_=20200710_1" class="lazy"></div></div></div></div></section><section id="publication"><div class="container"><div class="col-sm-8 col"><h2>ECharts: A Declarative Framework for Rapid Construction of Web-based Visualization</h2><p class="note"><i class="note-icon"><img classs="lazy" data-src="https://echarts-www.cdn.bcebos.com/zh/images/note.svg?_v_=20200710_1" /></i> Please cite the following paper whenever you use ECharts in your R&D projects, products, research papers, technical reports, news reports, books, presentations, teaching, patents, and other related intelligence activities.</p><p class="link">Visual Informatics, 2018<a href="http://www.cad.zju.edu.cn/home/vagblog/VAG_Work/echarts.pdf">[PDF]</a></p></div><div class="col-sm-4 col"><div class="img-container"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/pipeline.jpg?_v_=20200710_1" alt="" class="lazy"></div></div></div></section><section id="about-section" class="normal"><div class="container"><h3>关注我们</h3><p>可以通过以下渠道关注 ECharts,及时获得更多最新动态</p><div class="btn-panel"><a id="btn-github" href="https://github.com/apache/incubator-echarts"><div class="btn-content"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1" class="lazy"><span>GitHub</span></div><div class="btn-shadow"></div></a><a id="btn-weibo" href="https://weibo.com/echarts"><div class="btn-content zh"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1" class="lazy"><span>微博</span></div><div class="btn-shadow"></div></a><a id="btn-twitter" href="https://twitter.com/echartsjs"><div class="btn-content"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1" class="lazy"><span>Twitter</span></div><div class="btn-shadow"></div></a></div></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script>window.lazyLoadOptions = {
+</script><section id="feature-section"><div class="container"><div class="row features"><p>Apache ECharts (incubating)<sup>TM</sup> 是一个正在 <a target="_blank" href="https://www.apache.org/">Apache Software Foundation</a> (ASF) 孵化中的项目。</p></div><div class="row features"><div class="col-sm-4"><div class="feature-icon-panel"><svg width="36px" height="33px" viewbox="0 0 36 33" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><defs></defs><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-320.000000, -826.000000)" stroke="#333743" stroke-width="2"><g id="Group-7" transform="translate(321.000000, 827.387847)"><path id="Oval-1-Copy-2" d="M17,29.5876845 C17,29.5876845 0.5,15.970603 0.5,10.4351463 C0.5,4.89968971 5.02192403,0.41231548 10.6,0.41231548 C13.0289902,0.41231548 17,3.27642672 17,3.27642672 C17,3.27642672 20.9710098,0.41231548 23.4,0.41231548 C28.978076,0.41231548 33.5,4.89968971 33.5,10.4351463 C33.5,15.970603 17,29.5876845 17,29.5876845 Z"></path><path id="Path-4" d="M8.97721839,4.43098465 C8.97721839,4.43098465 4.65711371,4.98291942 5.76387751,8.9986647"></path></g></g></g></svg></div><h3>开源免费</h3><p>遵循 Apache-2.0 开源协议,免费商用</p></div><div class="col-sm-4"><div class="feature-icon-panel"><svg width="37px" height="36px" viewbox="0 0 37 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><defs><rect id="path-1" x="0.402989808" y="0.675409258" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-2" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-1"></use></mask><rect id="path-3" x="0.402989808" y="19.9416819" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-4" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-3"></use></mask><rect id="path-5" x="20.0265472" y="0.675409258" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-6" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-5"></use></mask><rect id="path-7" x="20.0265472" y="19.9416819" width="15.7021285" height="15.4476654" rx="3.4507722"></rect><mask id="mask-8" maskcontentunits="userSpaceOnUse" maskunits="objectBoundingBox" x="0" y="0" width="15.7021285" height="15.4476654" fill="white"><use xlink:href="#path-7"></use></mask></defs><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-701.000000, -824.000000)"><g id="Group-12" transform="translate(702.000000, 824.000000)"><use id="Rectangle-2" stroke="#333743" mask="url(#mask-2)" stroke-width="4" xlink:href="#path-1"></use><path id="Line" d="M16.6179041,10.4063517 L0.445091444,10.4063517" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy-3" d="M16.6179041,5.4063517 L0.445091444,5.4063517" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy" d="M6,1.07200204 L6,16.2280375" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><path id="Line-Copy-2" d="M11,1.07200204 L11,16.2280375" stroke="#FFFFFF" stroke-width="2" stroke-linecap="square"></path><use id="Rectangle-2-Copy-2" stroke="#333743" mask="url(#mask-4)" stroke-width="4" xlink:href="#path-3"></use><use id="Rectangle-2-Copy" stroke="#333743" mask="url(#mask-6)" stroke-width="4" xlink:href="#path-5"></use><use id="Rectangle-2-Copy-3" stroke="#333743" mask="url(#mask-8)" stroke-width="4" xlink:href="#path-7"></use></g></g></g></svg></div><h3>功能丰富</h3><p>涵盖各行业图表,满足各种需求</p></div><div class="col-sm-4"><div class="feature-icon-panel"><svg width="36px" height="31px" viewbox="0 0 36 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="feature-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-标注" transform="translate(-1084.000000, -827.000000)" fill="#333743"><g id="Group-38" transform="translate(1057.000000, 797.000000)"><path id="Shape" d="M63,56.361686 C63,51.671658 60.3077922,47.6639411 56.5050056,46.0305295 C58.3479474,44.7003672 59.5616758,42.4363346 59.5616758,39.8656065 C59.5616758,36.354116 57.2992585,33.4181102 54.2632182,32.6530946 C54.2357116,32.6462026 54.2082051,32.6496486 54.1841368,32.6599867 C54.1497535,32.6565406 54.1153703,32.6496486 54.0809871,32.6496486 C53.4311438,32.6496486 52.9050802,33.2182413 52.9050802,33.9177826 C52.9050802,34.5518495 53.3348707,35.068752 53.8953176,35.1652404 C53.995029,35.2100386 54.1256853,35.2410528 54.1325619,35.2444988 C55.8895456,35.8889038 57.1582872,37.6842783 57.1582872,39.8001322 C57.1582872,42.1606533 55.5835347,44.1214365 53.5067869,44.5315124 C53.5033486,44.5315124 53.4999103,44.5384045 53.4999103,44.5384045 C52.8088071,44.5866487 52.2586752,45.2000396 52.2586752,45.9581631 C52.2586752,46.7266247 52.8225604,47.3503537 53.5274169,47.3813678 C53.5308552,47.3848138 53.5377318,47.3917059 53.5411702,47.3917059 C57.718734,47.850026 60.6791312,51.688888 60.6791312,56.361686 C60.6791312,57.0543353 61.1983181,57.6160359 61.8412847,57.6160359 C62.4670598,57.6160359 62.9724934,57.0819034 62.9965617,56.4133762 C62.9965617,56.4064842 63,56.4030382 63,56.3961462 L63,56.3892541 L63,56.361686 L63,56.361686 Z M27,55.9123667 C27,51.2223386 29.6922078,47.2146218 33.4949944,45.5812101 C31.6520526,44.2510479 30.4383242,41.9870152 30.4383242,39.4162872 C30.4383242,35.9047967 32.7007415,32.9687909 35.7367818,32.2037753 C35.7642884,32.1968832 35.7917949,32.2003293 35.8158632,32.2106673 C35.8502465,32.2072213 35.8846297,32.2003293 35.9190129,32.2003293 C36.5688562,32.2003293 37.0949198,32.7689219 37.0949198,33.4684632 C37.0949198,34.1025302 36.6651293,34.6194326 36.1046824,34.7159211 C36.004971,34.7607193 35.8743147,34.7917334 35.8674381,34.7951795 C34.1104544,35.4395845 32.8417128,37.2349589 32.8417128,39.3508129 C32.8417128,41.7113339 34.4164653,43.6721172 36.4932131,44.0821931 C36.4966514,44.0821931 36.5000897,44.0890851 36.5000897,44.0890851 C37.1911929,44.1373293 37.7413248,44.7507202 37.7413248,45.5088438 C37.7413248,46.2773054 37.1774396,46.9010343 36.4725831,46.9320485 C36.4691448,46.9354945 36.4622682,46.9423865 36.4588298,46.9423865 C32.281266,47.4007067 29.3208688,51.2395687 29.3208688,55.9123667 C29.3208688,56.6050159 28.8016819,57.1667165 28.1587153,57.1667165 C27.5329402,57.1667165 27.0275066,56.632584 27.0034383,55.9640569 C27.0034383,55.9571649 27,55.9537189 27,55.9468268 L27,55.9399348 L27,55.9123667 L27,55.9123667 Z M49.0919787,46.2372904 C51.2925061,44.645231 52.7434789,41.9401083 52.7434789,38.8662618 C52.7434789,33.9694728 49.0644721,29.9996622 44.5258841,29.9996622 C39.9872962,29.9996622 36.3082893,33.9694728 36.3082893,38.8662618 C36.3082893,41.9401083 37.7592621,44.645231 39.9597896,46.2372904 C35.4074484,48.1980736 32.1926153,52.9914822 32.1926153,58.6015965 C32.1926153,58.91863 32.2098069,59.2287715 32.2304368,59.5389129 L32.2338752,59.5389129 C32.2338752,60.2212241 32.7461855,60.7760327 33.3788371,60.7760327 C34.0114888,60.7760327 34.5237991,60.2246701 34.5237991,59.5389129 C34.5237991,59.5010067 34.5169224,59.4631006 34.5134841,59.4251944 C34.4928542,59.1529591 34.4722242,58.8807238 34.4722242,58.6015965 C34.4722242,52.6089744 38.9729906,47.7535376 44.5224458,47.7535376 C50.0753394,47.7535376 54.5761057,52.6089744 54.5761057,58.6015965 C54.5761057,58.8910619 54.5554758,59.1736352 54.5348458,59.4562085 C54.5348458,59.4699926 54.5314075,59.4837767 54.5314075,59.4975607 L54.5314075,59.5354669 L54.5348458,59.5354669 C54.5554758,60.200548 55.0574711,60.7346805 55.6763695,60.7346805 C56.2952678,60.7346805 56.7972632,60.200548 56.8178931,59.5354669 L56.8213314,59.5354669 C56.8419614,59.2253255 56.859153,58.915184 56.859153,58.6015965 C56.8557147,52.9914822 53.6374432,48.1980736 49.0919787,46.2372904 L49.0919787,46.2372904 Z M44.5224458,45.2379457 C41.2629145,45.2379457 38.6188432,42.3846443 38.6188432,38.8662618 C38.6188432,35.3478793 41.2629145,32.4945779 44.5224458,32.4945779 C47.7819771,32.4945779 50.4260484,35.3478793 50.4260484,38.8662618 C50.4260484,42.3846443 47.7819771,45.2379457 44.5224458,45.2379457 L44.5224458,45.2379457 Z"></path></g></g></g></svg></div><h3>社区活跃</h3><p><a class="github-button" href="https://github.com/apache/incubator-echarts" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star apache/incubator-echarts on GitHub">GitHub Stars</a></p></div></div><div id="feature-4" class="row feature-detail"><div class="col-sm-4 col"><h2>全新 4.0</h2><h3 style="color:#000;font-weight:bold;margin-bottom:20px;">八项新科技</h3><p>千万级数据可视化渲染能力</p><p>SVG + Canvas 双引擎动力更佳</p><p>数据样式分离及扁平配置让开发更便捷</p><p>首创无障碍访问支持</p><p>微信小程序、PPT,哪里都能用</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><video id="video-feature-4" loop="true" muted="true" data-src="https://echarts.cdn.apache.org/zh/video/feature-4.mp4" poster="https://echarts-www.cdn.bcebos.com/zh/video/feature-4.jpg?_v_=20200710_1" class="lazy feature-video"></video><a id="video-feature-4-play" href="javascript:;" onclick="playVideo(&quot;video-feature-4&quot;)" class="feature-play-btn video-play-btn video-btn"><svg width="19px" height="25px" viewBox="0 0 19 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-23.000000, -18.000000)" fill="#AA344C"><path d="M41.365908,29.4271388 L41.3664843,29.4265626 L26.3794329,19.1497136 L26.3747509,19.1541315 C26.0642269,18.8592621 25.6429678,18.677793 25.1786824,18.677793 C24.2236284,18.677793 23.4494433,19.4443188 23.4494433,20.3905371 C23.4494433,20.910214 23.4270417,21.9276946 23.4494433,21.9056292 L23.4494433,30.6673861 L23.4494433,39.8901629 C23.4494433,39.8977982 23.4494433,40.4825908 23.4494433,40.9444991 C23.4494433,41.8901412 24.2236284,42.656691 25.1786824,42.656691 C25.6447205,42.656691 26.0677564,42.4740454 26.3782564,42.1764869 L26.3794329,42.1770872 L41.3664843,31.9005503 L41.3659081,31.8996379 C41.6917266,31.5882735 41.894997,31.1514078 41.894997,30.6670739 C41.894997,30.6658974 41.894997,30.6650091 41.894997,30.6635444 C41.894997,30.6623679 41.894997,30.6609273 41.894997,30.6600389 C41.894997,30.175657 41.6917265,29.7384792 41.365908,29.4271388 Z"></path></g></g></svg></a><a id="video-feature-4-pause" href="javascript:;" onclick="pauseVideo(&quot;video-feature-4&quot;)" class="feature-play-btn video-pause-btn video-btn"><svg width="17px" height="22px" viewBox="0 0 17 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-22.000000, -19.000000)" fill="#AA344C"><g transform="translate(22.667242, 19.000000)"><path d="M2,0 C3.1045695,-2.02906125e-16 4,0.8954305 4,2 L4,20 C4,21.1045695 3.1045695,22 2,22 C0.8954305,22 1.3527075e-16,21.1045695 0,20 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 Z M14,0 C15.1045695,-2.02906125e-16 16,0.8954305 16,2 L16,20 C16,21.1045695 15.1045695,22 14,22 C12.8954305,22 12,21.1045695 12,20 L12,2 C12,0.8954305 12.8954305,2.02906125e-16 14,0 Z"></path></g></g></g></svg></a></div></div><div id="feature-dimension" class="row feature-detail"><div class="col-sm-4 col mobile"><h2>多维度数据分析</h2><h3>数据自由刷选</h3><p>自由选择数据,发掘数据背后的更多秘密</p><h3>多图表联动查看</h3><p>对多个图表数据联动查看,进行多维有效分析</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><div id="col-desktop"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/feature-1.png?_v_=20200710_1" class="lazy"><video id="video-feature-1" loop="true" muted="true" data-src="https://echarts.cdn.apache.org/zh/video/feature-1.mp4" poster="https://echarts-www.cdn.bcebos.com/zh/video/feature-2.jpg?_v_=20200710_1" class="lazy feature-video"></video><a id="video-feature-1-play" href="javascript:;" onclick="playVideo(&quot;video-feature-1&quot;)" class="feature-play-btn video-play-btn video-btn"><svg width="19px" height="25px" viewBox="0 0 19 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-23.000000, -18.000000)" fill="#AA344C"><path d="M41.365908,29.4271388 L41.3664843,29.4265626 L26.3794329,19.1497136 L26.3747509,19.1541315 C26.0642269,18.8592621 25.6429678,18.677793 25.1786824,18.677793 C24.2236284,18.677793 23.4494433,19.4443188 23.4494433,20.3905371 C23.4494433,20.910214 23.4270417,21.9276946 23.4494433,21.9056292 L23.4494433,30.6673861 L23.4494433,39.8901629 C23.4494433,39.8977982 23.4494433,40.4825908 23.4494433,40.9444991 C23.4494433,41.8901412 24.2236284,42.656691 25.1786824,42.656691 C25.6447205,42.656691 26.0677564,42.4740454 26.3782564,42.1764869 L26.3794329,42.1770872 L41.3664843,31.9005503 L41.3659081,31.8996379 C41.6917266,31.5882735 41.894997,31.1514078 41.894997,30.6670739 C41.894997,30.6658974 41.894997,30.6650091 41.894997,30.6635444 C41.894997,30.6623679 41.894997,30.6609273 41.894997,30.6600389 C41.894997,30.175657 41.6917265,29.7384792 41.365908,29.4271388 Z"></path></g></g></svg></a><a id="video-feature-1-pause" href="javascript:;" onclick="pauseVideo(&quot;video-feature-1&quot;)" class="feature-play-btn video-pause-btn video-btn"><svg width="17px" height="22px" viewBox="0 0 17 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-22.000000, -19.000000)" fill="#AA344C"><g transform="translate(22.667242, 19.000000)"><path d="M2,0 C3.1045695,-2.02906125e-16 4,0.8954305 4,2 L4,20 C4,21.1045695 3.1045695,22 2,22 C0.8954305,22 1.3527075e-16,21.1045695 0,20 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 Z M14,0 C15.1045695,-2.02906125e-16 16,0.8954305 16,2 L16,20 C16,21.1045695 15.1045695,22 14,22 C12.8954305,22 12,21.1045695 12,20 L12,2 C12,0.8954305 12.8954305,2.02906125e-16 14,0 Z"></path></g></g></g></svg></a></div></div><div id="col-analysis" class="col-sm-4 col pc"><h2>多维度数据分析</h2><h3>数据自由刷选</h3><p>自由选择数据,发掘数据背后的更多秘密</p><h3>多图表联动查看</h3><p>对多个图表数据联动查看,进行多维有效分析</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div></div><div class="row feature-detail"><div id="col-data" class="col-sm-4 col"><h2>多设备随意展示</h2><h3>电脑/手机/平板/大屏  …</h3><p>兼容多种设备,可随时随地任性展示</p><div class="feature-btn"><a href="feature.html">了解更多<svg width="10px" height="13px" viewbox="0 0 10 13" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="more-icon"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="01-首页-设计稿" transform="translate(-1082.000000, -1417.000000)" fill="#3AADE3"><g id="Group-44" transform="translate(1006.000000, 1161.000000)"><g id="Group-16"><g id="Group-35" transform="translate(4.000000, 255.947089)"><polygon id="Shape" transform="translate(77.000000, 7.000000) scale(-1, 1) translate(-77.000000, -7.000000) " points="82 1.80411203 80.8773864 1 72 6.99980583 80.8773864 13 82 12.1957262 74.3133589 6.99980583"></polygon></g></g></g></g></g></svg></a></div></div><div class="col-sm-8 col"><div id="col-desktop"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/index-feature.jpg?_v_=20200710_1" class="lazy"></div></div></div></div></section><section id="publication"><div class="container"><div class="col-sm-8 col"><h2>ECharts: A Declarative Framework for Rapid Construction of Web-based Visualization</h2><p class="note"><i class="note-icon"><img classs="lazy" data-src="https://echarts-www.cdn.bcebos.com/zh/images/note.svg?_v_=20200710_1" /></i> Please cite the following paper whenever you use ECharts in your R&D projects, products, research papers, technical reports, news reports, books, presentations, teaching, patents, and other related intelligence activities.</p><p class="link">Visual Informatics, 2018<a href="http://www.cad.zju.edu.cn/home/vagblog/VAG_Work/echarts.pdf">[PDF]</a></p></div><div class="col-sm-4 col"><div class="img-container"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/pipeline.jpg?_v_=20200710_1" alt="" class="lazy"></div></div></div></section><section id="about-section" class="normal"><div class="container"><h3>关注我们</h3><p>可以通过以下渠道关注 ECharts,及时获得更多最新动态</p><div class="btn-panel"><a id="btn-github" href="https://github.com/apache/incubator-echarts"><div class="btn-content"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1" class="lazy"><span>GitHub</span></div><div class="btn-shadow"></div></a><a id="btn-weibo" href="https://weibo.com/echarts"><div class="btn-content zh"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1" class="lazy"><span>微博</span></div><div class="btn-shadow"></div></a><a id="btn-twitter" href="https://twitter.com/echartsjs"><div class="btn-content"><img data-src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1" class="lazy"><span>Twitter</span></div><div class="btn-shadow"></div></a></div></div></section></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script>window.lazyLoadOptions = {
     elements_selector: ".lazy"
-};</script><script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@12.0.0/dist/lazyload.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/index.js?_v_=1598903776431"></script><script async defer src="https://buttons.github.io/buttons.js"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+};</script><script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@12.0.0/dist/lazyload.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/index.js?_v_=1603774175523"></script><script async defer src="https://buttons.github.io/buttons.js"></script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/js/doc-bundle.js b/zh/js/doc-bundle.js
index 6b8199a..2db769c 100644
--- a/zh/js/doc-bundle.js
+++ b/zh/js/doc-bundle.js
@@ -5,4 +5,4 @@
 * Copyright (c) 2014–2018, Julian Kühnel
 * Released under the MIT license https://git.io/vwTVl
 *****************************************************/
-e.exports=function(){"use strict";var e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},t=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},n=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},a=function(){function e(n){var r=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:5e3;t(this,e),this.ctx=n,this.iframes=r,this.exclude=a,this.iframesTimeout=i}return n(e,[{key:"getContexts",value:function(){var e=[];return(void 0!==this.ctx&&this.ctx?NodeList.prototype.isPrototypeOf(this.ctx)?Array.prototype.slice.call(this.ctx):Array.isArray(this.ctx)?this.ctx:"string"==typeof this.ctx?Array.prototype.slice.call(document.querySelectorAll(this.ctx)):[this.ctx]:[]).forEach((function(t){var n=e.filter((function(e){return e.contains(t)})).length>0;-1!==e.indexOf(t)||n||e.push(t)})),e}},{key:"getIframeContents",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},r=void 0;try{var a=e.contentWindow;if(r=a.document,!a||!r)throw new Error("iframe inaccessible")}catch(e){n()}r&&t(r)}},{key:"isIframeBlank",value:function(e){var t="about:blank",n=e.getAttribute("src").trim();return e.contentWindow.location.href===t&&n!==t&&n}},{key:"observeIframeLoad",value:function(e,t,n){var r=this,a=!1,i=null,o=function o(){if(!a){a=!0,clearTimeout(i);try{r.isIframeBlank(e)||(e.removeEventListener("load",o),r.getIframeContents(e,t,n))}catch(e){n()}}};e.addEventListener("load",o),i=setTimeout(o,this.iframesTimeout)}},{key:"onIframeReady",value:function(e,t,n){try{"complete"===e.contentWindow.document.readyState?this.isIframeBlank(e)?this.observeIframeLoad(e,t,n):this.getIframeContents(e,t,n):this.observeIframeLoad(e,t,n)}catch(e){n()}}},{key:"waitForIframes",value:function(e,t){var n=this,r=0;this.forEachIframe(e,(function(){return!0}),(function(e){r++,n.waitForIframes(e.querySelector("html"),(function(){--r||t()}))}),(function(e){e||t()}))}},{key:"forEachIframe",value:function(t,n,r){var a=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},o=t.querySelectorAll("iframe"),s=o.length,l=0;o=Array.prototype.slice.call(o);var c=function(){--s<=0&&i(l)};s||c(),o.forEach((function(t){e.matches(t,a.exclude)?c():a.onIframeReady(t,(function(e){n(t)&&(l++,r(e)),c()}),c)}))}},{key:"createIterator",value:function(e,t,n){return document.createNodeIterator(e,t,n,!1)}},{key:"createInstanceOnIframe",value:function(t){return new e(t.querySelector("html"),this.iframes)}},{key:"compareNodeIframe",value:function(e,t,n){if(e.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_PRECEDING){if(null===t)return!0;if(t.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_FOLLOWING)return!0}return!1}},{key:"getIteratorNode",value:function(e){var t=e.previousNode();return{prevNode:t,node:(null===t||e.nextNode())&&e.nextNode()}}},{key:"checkIframeFilter",value:function(e,t,n,r){var a=!1,i=!1;return r.forEach((function(e,t){e.val===n&&(a=t,i=e.handled)})),this.compareNodeIframe(e,t,n)?(!1!==a||i?!1===a||i||(r[a].handled=!0):r.push({val:n,handled:!0}),!0):(!1===a&&r.push({val:n,handled:!1}),!1)}},{key:"handleOpenIframes",value:function(e,t,n,r){var a=this;e.forEach((function(e){e.handled||a.getIframeContents(e.val,(function(e){a.createInstanceOnIframe(e).forEachNode(t,n,r)}))}))}},{key:"iterateThroughNodes",value:function(e,t,n,r,a){for(var i,o=this,s=this.createIterator(t,e,r),l=[],c=[],u=void 0,h=void 0;i=void 0,i=o.getIteratorNode(s),h=i.prevNode,u=i.node;)this.iframes&&this.forEachIframe(t,(function(e){return o.checkIframeFilter(u,h,e,l)}),(function(t){o.createInstanceOnIframe(t).forEachNode(e,(function(e){return c.push(e)}),r)})),c.push(u);c.forEach((function(e){n(e)})),this.iframes&&this.handleOpenIframes(l,e,n,r),a()}},{key:"forEachNode",value:function(e,t,n){var r=this,a=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},i=this.getContexts(),o=i.length;o||a(),i.forEach((function(i){var s=function(){r.iterateThroughNodes(e,i,t,n,(function(){--o<=0&&a()}))};r.iframes?r.waitForIframes(i,s):s()}))}}],[{key:"matches",value:function(e,t){var n="string"==typeof t?[t]:t,r=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector;if(r){var a=!1;return n.every((function(t){return!r.call(e,t)||(a=!0,!1)})),a}return!1}}]),e}(),i=function(){function i(e){t(this,i),this.ctx=e,this.ie=!1;var n=window.navigator.userAgent;(n.indexOf("MSIE")>-1||n.indexOf("Trident")>-1)&&(this.ie=!0)}return n(i,[{key:"log",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"debug",r=this.opt.log;this.opt.debug&&"object"===(void 0===r?"undefined":e(r))&&"function"==typeof r[n]&&r[n]("mark.js: "+t)}},{key:"escapeStr",value:function(e){return e.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g,"\\$&")}},{key:"createRegExp",value:function(e){return"disabled"!==this.opt.wildcards&&(e=this.setupWildcardsRegExp(e)),e=this.escapeStr(e),Object.keys(this.opt.synonyms).length&&(e=this.createSynonymsRegExp(e)),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),this.opt.diacritics&&(e=this.createDiacriticsRegExp(e)),e=this.createMergedBlanksRegExp(e),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.createJoinersRegExp(e)),"disabled"!==this.opt.wildcards&&(e=this.createWildcardsRegExp(e)),e=this.createAccuracyRegExp(e)}},{key:"createSynonymsRegExp",value:function(e){var t=this.opt.synonyms,n=this.opt.caseSensitive?"":"i",r=this.opt.ignoreJoiners||this.opt.ignorePunctuation.length?"\0":"";for(var a in t)if(t.hasOwnProperty(a)){var i=t[a],o="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(a):this.escapeStr(a),s="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(i):this.escapeStr(i);""!==o&&""!==s&&(e=e.replace(new RegExp("("+this.escapeStr(o)+"|"+this.escapeStr(s)+")","gm"+n),r+"("+this.processSynomyms(o)+"|"+this.processSynomyms(s)+")"+r))}return e}},{key:"processSynomyms",value:function(e){return(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),e}},{key:"setupWildcardsRegExp",value:function(e){return(e=e.replace(/(?:\\)*\?/g,(function(e){return"\\"===e.charAt(0)?"?":""}))).replace(/(?:\\)*\*/g,(function(e){return"\\"===e.charAt(0)?"*":""}))}},{key:"createWildcardsRegExp",value:function(e){var t="withSpaces"===this.opt.wildcards;return e.replace(/\u0001/g,t?"[\\S\\s]?":"\\S?").replace(/\u0002/g,t?"[\\S\\s]*?":"\\S*")}},{key:"setupIgnoreJoinersRegExp",value:function(e){return e.replace(/[^(|)\\]/g,(function(e,t,n){var r=n.charAt(t+1);return/[(|)\\]/.test(r)||""===r?e:e+"\0"}))}},{key:"createJoinersRegExp",value:function(e){var t=[],n=this.opt.ignorePunctuation;return Array.isArray(n)&&n.length&&t.push(this.escapeStr(n.join(""))),this.opt.ignoreJoiners&&t.push("\\u00ad\\u200b\\u200c\\u200d"),t.length?e.split(/\u0000+/).join("["+t.join("")+"]*"):e}},{key:"createDiacriticsRegExp",value:function(e){var t=this.opt.caseSensitive?"":"i",n=this.opt.caseSensitive?["aàáảãạăằắẳẵặâầấẩẫậäåāą","AÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćč","CÇĆČ","dđď","DĐĎ","eèéẻẽẹêềếểễệëěēę","EÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïī","IÌÍỈĨỊÎÏĪ","lł","LŁ","nñňń","NÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøō","OÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rř","RŘ","sšśșş","SŠŚȘŞ","tťțţ","TŤȚŢ","uùúủũụưừứửữựûüůū","UÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿ","YÝỲỶỸỴŸ","zžżź","ZŽŻŹ"]:["aàáảãạăằắẳẵặâầấẩẫậäåāąAÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćčCÇĆČ","dđďDĐĎ","eèéẻẽẹêềếểễệëěēęEÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïīIÌÍỈĨỊÎÏĪ","lłLŁ","nñňńNÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøōOÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rřRŘ","sšśșşSŠŚȘŞ","tťțţTŤȚŢ","uùúủũụưừứửữựûüůūUÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿYÝỲỶỸỴŸ","zžżźZŽŻŹ"],r=[];return e.split("").forEach((function(a){n.every((function(n){if(-1!==n.indexOf(a)){if(r.indexOf(n)>-1)return!1;e=e.replace(new RegExp("["+n+"]","gm"+t),"["+n+"]"),r.push(n)}return!0}))})),e}},{key:"createMergedBlanksRegExp",value:function(e){return e.replace(/[\s]+/gim,"[\\s]+")}},{key:"createAccuracyRegExp",value:function(e){var t=this,n=this.opt.accuracy,r="string"==typeof n?n:n.value,a="string"==typeof n?[]:n.limiters,i="";switch(a.forEach((function(e){i+="|"+t.escapeStr(e)})),r){case"partially":default:return"()("+e+")";case"complementary":return"()([^"+(i="\\s"+(i||this.escapeStr("!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~¡¿")))+"]*"+e+"[^"+i+"]*)";case"exactly":return"(^|\\s"+i+")("+e+")(?=$|\\s"+i+")"}}},{key:"getSeparatedKeywords",value:function(e){var t=this,n=[];return e.forEach((function(e){t.opt.separateWordSearch?e.split(" ").forEach((function(e){e.trim()&&-1===n.indexOf(e)&&n.push(e)})):e.trim()&&-1===n.indexOf(e)&&n.push(e)})),{keywords:n.sort((function(e,t){return t.length-e.length})),length:n.length}}},{key:"isNumeric",value:function(e){return Number(parseFloat(e))==e}},{key:"checkRanges",value:function(e){var t=this;if(!Array.isArray(e)||"[object Object]"!==Object.prototype.toString.call(e[0]))return this.log("markRanges() will only accept an array of objects"),this.opt.noMatch(e),[];var n=[],r=0;return e.sort((function(e,t){return e.start-t.start})).forEach((function(e){var a=t.callNoMatchOnInvalidRanges(e,r),i=a.start,o=a.end;a.valid&&(e.start=i,e.length=o-i,n.push(e),r=o)})),n}},{key:"callNoMatchOnInvalidRanges",value:function(e,t){var n=void 0,r=void 0,a=!1;return e&&void 0!==e.start?(r=(n=parseInt(e.start,10))+parseInt(e.length,10),this.isNumeric(e.start)&&this.isNumeric(e.length)&&r-t>0&&r-n>0?a=!0:(this.log("Ignoring invalid or overlapping range: "+JSON.stringify(e)),this.opt.noMatch(e))):(this.log("Ignoring invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:n,end:r,valid:a}}},{key:"checkWhitespaceRanges",value:function(e,t,n){var r=void 0,a=!0,i=n.length,o=t-i,s=parseInt(e.start,10)-o;return(r=(s=s>i?i:s)+parseInt(e.length,10))>i&&(r=i,this.log("End range automatically set to the max value of "+i)),s<0||r-s<0||s>i||r>i?(a=!1,this.log("Invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)):""===n.substring(s,r).replace(/\s+/g,"")&&(a=!1,this.log("Skipping whitespace only range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:s,end:r,valid:a}}},{key:"getTextNodes",value:function(e){var t=this,n="",r=[];this.iterator.forEachNode(NodeFilter.SHOW_TEXT,(function(e){r.push({start:n.length,end:(n+=e.textContent).length,node:e})}),(function(e){return t.matchesExclude(e.parentNode)?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),(function(){e({value:n,nodes:r})}))}},{key:"matchesExclude",value:function(e){return a.matches(e,this.opt.exclude.concat(["script","style","title","head","html"]))}},{key:"wrapRangeInTextNode",value:function(e,t,n){var r=this.opt.element?this.opt.element:"mark",a=e.splitText(t),i=a.splitText(n-t),o=document.createElement(r);return o.setAttribute("data-markjs","true"),this.opt.className&&o.setAttribute("class",this.opt.className),o.textContent=a.textContent,a.parentNode.replaceChild(o,a),i}},{key:"wrapRangeInMappedTextNode",value:function(e,t,n,r,a){var i=this;e.nodes.every((function(o,s){var l=e.nodes[s+1];if(void 0===l||l.start>t){if(!r(o.node))return!1;var c=t-o.start,u=(n>o.end?o.end:n)-o.start,h=e.value.substr(0,o.start),p=e.value.substr(u+o.start);if(o.node=i.wrapRangeInTextNode(o.node,c,u),e.value=h+p,e.nodes.forEach((function(t,n){n>=s&&(e.nodes[n].start>0&&n!==s&&(e.nodes[n].start-=u),e.nodes[n].end-=u)})),n-=u,a(o.node.previousSibling,o.start),!(n>o.end))return!1;t=o.end}return!0}))}},{key:"wrapMatches",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){t.nodes.forEach((function(t){t=t.node;for(var a=void 0;null!==(a=e.exec(t.textContent))&&""!==a[o];)if(n(a[o],t)){var s=a.index;if(0!==o)for(var l=1;l<o;l++)s+=a[l].length;t=i.wrapRangeInTextNode(t,s,s+a[o].length),r(t.previousSibling),e.lastIndex=0}})),a()}))}},{key:"wrapMatchesAcrossElements",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){for(var s=void 0;null!==(s=e.exec(t.value))&&""!==s[o];){var l=s.index;if(0!==o)for(var c=1;c<o;c++)l+=s[c].length;var u=l+s[o].length;i.wrapRangeInMappedTextNode(t,l,u,(function(e){return n(s[o],e)}),(function(t,n){e.lastIndex=n,r(t)}))}a()}))}},{key:"wrapRangeFromIndex",value:function(e,t,n,r){var a=this;this.getTextNodes((function(i){var o=i.value.length;e.forEach((function(e,r){var s=a.checkWhitespaceRanges(e,o,i.value),l=s.start,c=s.end;s.valid&&a.wrapRangeInMappedTextNode(i,l,c,(function(n){return t(n,e,i.value.substring(l,c),r)}),(function(t){n(t,e)}))})),r()}))}},{key:"unwrapMatches",value:function(e){for(var t=e.parentNode,n=document.createDocumentFragment();e.firstChild;)n.appendChild(e.removeChild(e.firstChild));t.replaceChild(n,e),this.ie?this.normalizeTextNode(t):t.normalize()}},{key:"normalizeTextNode",value:function(e){if(e){if(3===e.nodeType)for(;e.nextSibling&&3===e.nextSibling.nodeType;)e.nodeValue+=e.nextSibling.nodeValue,e.parentNode.removeChild(e.nextSibling);else this.normalizeTextNode(e.firstChild);this.normalizeTextNode(e.nextSibling)}}},{key:"markRegExp",value:function(e,t){var n=this;this.opt=t,this.log('Searching with expression "'+e+'"');var r=0,a="wrapMatches";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),this[a](e,this.opt.ignoreGroups,(function(e,t){return n.opt.filter(t,e,r)}),(function(e){r++,n.opt.each(e)}),(function(){0===r&&n.opt.noMatch(e),n.opt.done(r)}))}},{key:"mark",value:function(e,t){var n=this;this.opt=t;var r=0,a="wrapMatches",i=this.getSeparatedKeywords("string"==typeof e?[e]:e),o=i.keywords,s=i.length,l=this.opt.caseSensitive?"":"i";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),0===s?this.opt.done(r):function e(t){var i=new RegExp(n.createRegExp(t),"gm"+l),c=0;n.log('Searching with expression "'+i+'"'),n[a](i,1,(function(e,a){return n.opt.filter(a,t,r,c)}),(function(e){c++,r++,n.opt.each(e)}),(function(){0===c&&n.opt.noMatch(t),o[s-1]===t?n.opt.done(r):e(o[o.indexOf(t)+1])}))}(o[0])}},{key:"markRanges",value:function(e,t){var n=this;this.opt=t;var r=0,a=this.checkRanges(e);a&&a.length?(this.log("Starting to mark with the following ranges: "+JSON.stringify(a)),this.wrapRangeFromIndex(a,(function(e,t,r,a){return n.opt.filter(e,t,r,a)}),(function(e,t){r++,n.opt.each(e,t)}),(function(){n.opt.done(r)}))):this.opt.done(r)}},{key:"unmark",value:function(e){var t=this;this.opt=e;var n=this.opt.element?this.opt.element:"*";n+="[data-markjs]",this.opt.className&&(n+="."+this.opt.className),this.log('Removal selector "'+n+'"'),this.iterator.forEachNode(NodeFilter.SHOW_ELEMENT,(function(e){t.unwrapMatches(e)}),(function(e){var r=a.matches(e,n),i=t.matchesExclude(e);return!r||i?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),this.opt.done)}},{key:"opt",set:function(e){this._opt=r({},{element:"",className:"",exclude:[],iframes:!1,iframesTimeout:5e3,separateWordSearch:!0,diacritics:!0,synonyms:{},accuracy:"partially",acrossElements:!1,caseSensitive:!1,ignoreJoiners:!1,ignoreGroups:0,ignorePunctuation:[],wildcards:"disabled",each:function(){},noMatch:function(){},filter:function(){return!0},done:function(){},debug:!1,log:window.console},e)},get:function(){return this._opt}},{key:"iterator",get:function(){return new a(this.ctx,this.opt.iframes,this.opt.exclude,this.opt.iframesTimeout)}}]),i}();return function(e){var t=this,n=new i(e);return this.mark=function(e,r){return n.mark(e,r),t},this.markRegExp=function(e,r){return n.markRegExp(e,r),t},this.markRanges=function(e,r){return n.markRanges(e,r),t},this.unmark=function(e){return n.unmark(e),t},this}}()},function(e,t,n){(function(t){var n=/^\s+|\s+$/g,r=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,i=/^0o[0-7]+$/i,o=parseInt,s="object"==typeof t&&t&&t.Object===Object&&t,l="object"==typeof self&&self&&self.Object===Object&&self,c=s||l||Function("return this")(),u=Object.prototype.toString,h=Math.max,p=Math.min,f=function(){return c.Date.now()};function d(e){var t=typeof e;return!!e&&("object"==t||"function"==t)}function m(e){if("number"==typeof e)return e;if(function(e){return"symbol"==typeof e||function(e){return!!e&&"object"==typeof e}(e)&&"[object Symbol]"==u.call(e)}(e))return NaN;if(d(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=d(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=e.replace(n,"");var s=a.test(e);return s||i.test(e)?o(e.slice(2),s?2:8):r.test(e)?NaN:+e}e.exports=function(e,t,n){var r,a,i,o,s,l,c=0,u=!1,v=!1,g=!0;if("function"!=typeof e)throw new TypeError("Expected a function");function _(t){var n=r,i=a;return r=a=void 0,c=t,o=e.apply(i,n)}function y(e){return c=e,s=setTimeout(x,t),u?_(e):o}function b(e){var n=e-l;return void 0===l||n>=t||n<0||v&&e-c>=i}function x(){var e=f();if(b(e))return E(e);s=setTimeout(x,function(e){var n=t-(e-l);return v?p(n,i-(e-c)):n}(e))}function E(e){return s=void 0,g&&r?_(e):(r=a=void 0,o)}function w(){var e=f(),n=b(e);if(r=arguments,a=this,l=e,n){if(void 0===s)return y(l);if(v)return s=setTimeout(x,t),_(l)}return void 0===s&&(s=setTimeout(x,t)),o}return t=m(t)||0,d(n)&&(u=!!n.leading,i=(v="maxWait"in n)?h(m(n.maxWait)||0,t):i,g="trailing"in n?!!n.trailing:g),w.cancel=function(){void 0!==s&&clearTimeout(s),c=0,r=l=a=s=void 0},w.flush=function(){return void 0===s?o:E(f())},w}}).call(this,n(22))},function(e,t,n){"use strict";var r=n(2);n.n(r).a},function(e,t,n){"use strict";var r=n(3);n.n(r).a},function(e,t,n){"use strict";var r=n(4);n.n(r).a},function(e,t,n){"use strict";var r=n(5);n.n(r).a},function(e,t,n){"use strict";var r=n(6);n.n(r).a},function(e,t,n){"use strict";var r=n(7);n.n(r).a},function(e,t,n){"use strict";var r=n(8);n.n(r).a},function(e,t,n){"use strict";var r=n(9);n.n(r).a},function(e,t,n){"use strict";var r=n(10);n.n(r).a},function(e,t,n){"use strict";var r=n(11);n.n(r).a},function(e,t,n){},function(e,t,n){},function(e,t,n){"use strict";var r=n(12);n.n(r).a},function(e,t,n){"use strict";var r=n(13);n.n(r).a},function(e,t,n){"use strict";var r=n(14);n.n(r).a},function(e,t,n){"use strict";var r=n(15);n.n(r).a},function(e,t,n){"use strict";var r=n(16);n.n(r).a},function(e,t,n){"use strict";var r=n(17);n.n(r).a},function(e,t,n){"use strict";var r=n(18);n.n(r).a},function(e,t,n){},function(e,t,n){"use strict";n.r(t),n.d(t,"init",(function(){return fr}));var r=n(0),a=n.n(r),i=["style","currency","currencyDisplay","useGrouping","minimumIntegerDigits","minimumFractionDigits","maximumFractionDigits","minimumSignificantDigits","maximumSignificantDigits","localeMatcher","formatMatcher","unit"];function o(e,t){"undefined"!=typeof console&&(console.warn("[vue-i18n] "+e),t&&console.warn(t.stack))}var s=Array.isArray;function l(e){return null!==e&&"object"==typeof e}function c(e){return"string"==typeof e}var u=Object.prototype.toString;function h(e){return"[object Object]"===u.call(e)}function p(e){return null==e}function f(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];var n=null,r=null;return 1===e.length?l(e[0])||Array.isArray(e[0])?r=e[0]:"string"==typeof e[0]&&(n=e[0]):2===e.length&&("string"==typeof e[0]&&(n=e[0]),(l(e[1])||Array.isArray(e[1]))&&(r=e[1])),{locale:n,params:r}}function d(e){return JSON.parse(JSON.stringify(e))}function m(e,t){return!!~e.indexOf(t)}var v=Object.prototype.hasOwnProperty;function g(e,t){return v.call(e,t)}function _(e){for(var t=arguments,n=Object(e),r=1;r<arguments.length;r++){var a=t[r];if(null!=a){var i=void 0;for(i in a)g(a,i)&&(l(a[i])?n[i]=_(n[i],a[i]):n[i]=a[i])}}return n}function y(e,t){if(e===t)return!0;var n=l(e),r=l(t);if(!n||!r)return!n&&!r&&String(e)===String(t);try{var a=Array.isArray(e),i=Array.isArray(t);if(a&&i)return e.length===t.length&&e.every((function(e,n){return y(e,t[n])}));if(a||i)return!1;var o=Object.keys(e),s=Object.keys(t);return o.length===s.length&&o.every((function(n){return y(e[n],t[n])}))}catch(e){return!1}}var b={beforeCreate:function(){var e=this.$options;if(e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n)if(e.i18n instanceof J){if(e.__i18n)try{var t={};e.__i18n.forEach((function(e){t=_(t,JSON.parse(e))})),Object.keys(t).forEach((function(n){e.i18n.mergeLocaleMessage(n,t[n])}))}catch(e){0}this._i18n=e.i18n,this._i18nWatcher=this._i18n.watchI18nData()}else if(h(e.i18n)){var n=this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this.$root.$i18n:null;if(n&&(e.i18n.root=this.$root,e.i18n.formatter=n.formatter,e.i18n.fallbackLocale=n.fallbackLocale,e.i18n.formatFallbackMessages=n.formatFallbackMessages,e.i18n.silentTranslationWarn=n.silentTranslationWarn,e.i18n.silentFallbackWarn=n.silentFallbackWarn,e.i18n.pluralizationRules=n.pluralizationRules,e.i18n.preserveDirectiveContent=n.preserveDirectiveContent),e.__i18n)try{var r={};e.__i18n.forEach((function(e){r=_(r,JSON.parse(e))})),e.i18n.messages=r}catch(e){0}var a=e.i18n.sharedMessages;a&&h(a)&&(e.i18n.messages=_(e.i18n.messages,a)),this._i18n=new J(e.i18n),this._i18nWatcher=this._i18n.watchI18nData(),(void 0===e.i18n.sync||e.i18n.sync)&&(this._localeWatcher=this.$i18n.watchLocale()),n&&n.onComponentInstanceCreated(this._i18n)}else 0;else this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this._i18n=this.$root.$i18n:e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J&&(this._i18n=e.parent.$i18n)},beforeMount:function(){var e=this.$options;e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n?(e.i18n instanceof J||h(e.i18n))&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0):(this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J||e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J)&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0)},beforeDestroy:function(){if(this._i18n){var e=this;this.$nextTick((function(){e._subscribing&&(e._i18n.unsubscribeDataChanging(e),delete e._subscribing),e._i18nWatcher&&(e._i18nWatcher(),e._i18n.destroyVM(),delete e._i18nWatcher),e._localeWatcher&&(e._localeWatcher(),delete e._localeWatcher)}))}}},x={name:"i18n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},path:{type:String,required:!0},locale:{type:String},places:{type:[Array,Object]}},render:function(e,t){var n=t.data,r=t.parent,a=t.props,i=t.slots,o=r.$i18n;if(o){var s=a.path,l=a.locale,c=a.places,u=i(),h=o.i(s,l,function(e){var t;for(t in e)if("default"!==t)return!1;return Boolean(t)}(u)||c?function(e,t){var n=t?function(e){0;return Array.isArray(e)?e.reduce(w,{}):Object.assign({},e)}(t):{};if(!e)return n;var r=(e=e.filter((function(e){return e.tag||""!==e.text.trim()}))).every(C);0;return e.reduce(r?E:w,n)}(u.default,c):u),p=a.tag&&!0!==a.tag||!1===a.tag?a.tag:"span";return p?e(p,n,h):h}}};function E(e,t){return t.data&&t.data.attrs&&t.data.attrs.place&&(e[t.data.attrs.place]=t),e}function w(e,t,n){return e[n]=t,e}function C(e){return Boolean(e.data&&e.data.attrs&&e.data.attrs.place)}var S,k={name:"i18n-n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},value:{type:Number,required:!0},format:{type:[String,Object]},locale:{type:String}},render:function(e,t){var n=t.props,r=t.parent,a=t.data,o=r.$i18n;if(!o)return null;var s=null,u=null;c(n.format)?s=n.format:l(n.format)&&(n.format.key&&(s=n.format.key),u=Object.keys(n.format).reduce((function(e,t){var r;return m(i,t)?Object.assign({},e,((r={})[t]=n.format[t],r)):e}),null));var h=n.locale||o.locale,p=o._ntp(n.value,h,s,u),f=p.map((function(e,t){var n,r=a.scopedSlots&&a.scopedSlots[e.type];return r?r(((n={})[e.type]=e.value,n.index=t,n.parts=p,n)):e.value})),d=n.tag&&!0!==n.tag||!1===n.tag?n.tag:"span";return d?e(d,{attrs:a.attrs,class:a.class,staticClass:a.staticClass},f):f}};function O(e,t,n){T(e,n)&&I(e,t,n)}function M(e,t,n,r){if(T(e,n)){var a=n.context.$i18n;(function(e,t){var n=t.context;return e._locale===n.$i18n.locale})(e,n)&&y(t.value,t.oldValue)&&y(e._localeMessage,a.getLocaleMessage(a.locale))||I(e,t,n)}}function N(e,t,n,r){if(n.context){var a=n.context.$i18n||{};t.modifiers.preserve||a.preserveDirectiveContent||(e.textContent=""),e._vt=void 0,delete e._vt,e._locale=void 0,delete e._locale,e._localeMessage=void 0,delete e._localeMessage}else o("Vue instance does not exists in VNode context")}function T(e,t){var n=t.context;return n?!!n.$i18n||(o("VueI18n instance does not exists in Vue instance"),!1):(o("Vue instance does not exists in VNode context"),!1)}function I(e,t,n){var r,a,i=function(e){var t,n,r,a;c(e)?t=e:h(e)&&(t=e.path,n=e.locale,r=e.args,a=e.choice);return{path:t,locale:n,args:r,choice:a}}(t.value),s=i.path,l=i.locale,u=i.args,p=i.choice;if(s||l||u)if(s){var f=n.context;e._vt=e.textContent=null!=p?(r=f.$i18n).tc.apply(r,[s,p].concat(R(l,u))):(a=f.$i18n).t.apply(a,[s].concat(R(l,u))),e._locale=f.$i18n.locale,e._localeMessage=f.$i18n.getLocaleMessage(f.$i18n.locale)}else o("`path` is required in v-t directive");else o("value type not supported")}function R(e,t){var n=[];return e&&n.push(e),t&&(Array.isArray(t)||h(t))&&n.push(t),n}function A(e){A.installed=!0;(S=e).version&&Number(S.version.split(".")[0]);(function(e){e.prototype.hasOwnProperty("$i18n")||Object.defineProperty(e.prototype,"$i18n",{get:function(){return this._i18n}}),e.prototype.$t=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.$i18n;return r._t.apply(r,[e,r.locale,r._getMessages(),this].concat(t))},e.prototype.$tc=function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];var a=this.$i18n;return a._tc.apply(a,[e,a.locale,a._getMessages(),this,t].concat(n))},e.prototype.$te=function(e,t){var n=this.$i18n;return n._te(e,n.locale,n._getMessages(),t)},e.prototype.$d=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).d.apply(t,[e].concat(n))},e.prototype.$n=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).n.apply(t,[e].concat(n))}})(S),S.mixin(b),S.directive("t",{bind:O,update:M,unbind:N}),S.component(x.name,x),S.component(k.name,k),S.config.optionMergeStrategies.i18n=function(e,t){return void 0===t?e:t}}var L=function(){this._caches=Object.create(null)};L.prototype.interpolate=function(e,t){if(!t)return[e];var n=this._caches[e];return n||(n=function(e){var t=[],n=0,r="";for(;n<e.length;){var a=e[n++];if("{"===a){r&&t.push({type:"text",value:r}),r="";var i="";for(a=e[n++];void 0!==a&&"}"!==a;)i+=a,a=e[n++];var o="}"===a,s=D.test(i)?"list":o&&$.test(i)?"named":"unknown";t.push({value:i,type:s})}else"%"===a?"{"!==e[n]&&(r+=a):r+=a}return r&&t.push({type:"text",value:r}),t}(e),this._caches[e]=n),function(e,t){var n=[],r=0,a=Array.isArray(t)?"list":l(t)?"named":"unknown";if("unknown"===a)return n;for(;r<e.length;){var i=e[r];switch(i.type){case"text":n.push(i.value);break;case"list":n.push(t[parseInt(i.value,10)]);break;case"named":"named"===a&&n.push(t[i.value]);break;case"unknown":0}r++}return n}(n,t)};var D=/^(?:\d)+/,$=/^(?:\w)+/;var P=[];P[0]={ws:[0],ident:[3,0],"[":[4],eof:[7]},P[1]={ws:[1],".":[2],"[":[4],eof:[7]},P[2]={ws:[2],ident:[3,0],0:[3,0],number:[3,0]},P[3]={ident:[3,0],0:[3,0],number:[3,0],ws:[1,1],".":[2,1],"[":[4,1],eof:[7,1]},P[4]={"'":[5,0],'"':[6,0],"[":[4,2],"]":[1,3],eof:8,else:[4,0]},P[5]={"'":[4,0],eof:8,else:[5,0]},P[6]={'"':[4,0],eof:8,else:[6,0]};var V=/^\s?(?:true|false|-?[\d.]+|'[^']*'|"[^"]*")\s?$/;function j(e){if(null==e)return"eof";switch(e.charCodeAt(0)){case 91:case 93:case 46:case 34:case 39:return e;case 95:case 36:case 45:return"ident";case 9:case 10:case 13:case 160:case 65279:case 8232:case 8233:return"ws"}return"ident"}function F(e){var t,n,r,a=e.trim();return("0"!==e.charAt(0)||!isNaN(e))&&(r=a,V.test(r)?(n=(t=a).charCodeAt(0))!==t.charCodeAt(t.length-1)||34!==n&&39!==n?t:t.slice(1,-1):"*"+a)}var z=function(){this._cache=Object.create(null)};z.prototype.parsePath=function(e){var t=this._cache[e];return t||(t=function(e){var t,n,r,a,i,o,s,l=[],c=-1,u=0,h=0,p=[];function f(){var t=e[c+1];if(5===u&&"'"===t||6===u&&'"'===t)return c++,r="\\"+t,p[0](),!0}for(p[1]=function(){void 0!==n&&(l.push(n),n=void 0)},p[0]=function(){void 0===n?n=r:n+=r},p[2]=function(){p[0](),h++},p[3]=function(){if(h>0)h--,u=4,p[0]();else{if(h=0,void 0===n)return!1;if(!1===(n=F(n)))return!1;p[1]()}};null!==u;)if(c++,"\\"!==(t=e[c])||!f()){if(a=j(t),8===(i=(s=P[u])[a]||s.else||8))return;if(u=i[0],(o=p[i[1]])&&(r=void 0===(r=i[2])?t:r,!1===o()))return;if(7===u)return l}}(e))&&(this._cache[e]=t),t||[]},z.prototype.getPathValue=function(e,t){if(!l(e))return null;var n=this.parsePath(t);if(0===n.length)return null;for(var r=n.length,a=e,i=0;i<r;){var o=a[n[i]];if(void 0===o)return null;a=o,i++}return a};var B,W=/<\/?[\w\s="/.':;#-\/]+>/,U=/(?:@(?:\.[a-z]+)?:(?:[\w\-_|.]+|\([\w\-_|.]+\)))/g,H=/^@(?:\.([a-z]+))?:/,q=/[()]/g,G={upper:function(e){return e.toLocaleUpperCase()},lower:function(e){return e.toLocaleLowerCase()},capitalize:function(e){return""+e.charAt(0).toLocaleUpperCase()+e.substr(1)}},K=new L,J=function(e){var t=this;void 0===e&&(e={}),!S&&"undefined"!=typeof window&&window.Vue&&A(window.Vue);var n=e.locale||"en-US",r=!1!==e.fallbackLocale&&(e.fallbackLocale||"en-US"),a=e.messages||{},i=e.dateTimeFormats||{},o=e.numberFormats||{};this._vm=null,this._formatter=e.formatter||K,this._modifiers=e.modifiers||{},this._missing=e.missing||null,this._root=e.root||null,this._sync=void 0===e.sync||!!e.sync,this._fallbackRoot=void 0===e.fallbackRoot||!!e.fallbackRoot,this._formatFallbackMessages=void 0!==e.formatFallbackMessages&&!!e.formatFallbackMessages,this._silentTranslationWarn=void 0!==e.silentTranslationWarn&&e.silentTranslationWarn,this._silentFallbackWarn=void 0!==e.silentFallbackWarn&&!!e.silentFallbackWarn,this._dateTimeFormatters={},this._numberFormatters={},this._path=new z,this._dataListeners=[],this._componentInstanceCreatedListener=e.componentInstanceCreatedListener||null,this._preserveDirectiveContent=void 0!==e.preserveDirectiveContent&&!!e.preserveDirectiveContent,this.pluralizationRules=e.pluralizationRules||{},this._warnHtmlInMessage=e.warnHtmlInMessage||"off",this._postTranslation=e.postTranslation||null,this.getChoiceIndex=function(e,n){var r=Object.getPrototypeOf(t);if(r&&r.getChoiceIndex)return r.getChoiceIndex.call(t,e,n);var a,i;return t.locale in t.pluralizationRules?t.pluralizationRules[t.locale].apply(t,[e,n]):(a=e,i=n,a=Math.abs(a),2===i?a?a>1?1:0:1:a?Math.min(a,2):0)},this._exist=function(e,n){return!(!e||!n)&&(!p(t._path.getPathValue(e,n))||!!e[n])},"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||Object.keys(a).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,a[e])})),this._initVM({locale:n,fallbackLocale:r,messages:a,dateTimeFormats:i,numberFormats:o})},Q={vm:{configurable:!0},messages:{configurable:!0},dateTimeFormats:{configurable:!0},numberFormats:{configurable:!0},availableLocales:{configurable:!0},locale:{configurable:!0},fallbackLocale:{configurable:!0},formatFallbackMessages:{configurable:!0},missing:{configurable:!0},formatter:{configurable:!0},silentTranslationWarn:{configurable:!0},silentFallbackWarn:{configurable:!0},preserveDirectiveContent:{configurable:!0},warnHtmlInMessage:{configurable:!0},postTranslation:{configurable:!0}};J.prototype._checkLocaleMessage=function(e,t,n){var r=function(e,t,n,a){if(h(n))Object.keys(n).forEach((function(i){var o=n[i];h(o)?(a.push(i),a.push("."),r(e,t,o,a),a.pop(),a.pop()):(a.push(i),r(e,t,o,a),a.pop())}));else if(Array.isArray(n))n.forEach((function(n,i){h(n)?(a.push("["+i+"]"),a.push("."),r(e,t,n,a),a.pop(),a.pop()):(a.push("["+i+"]"),r(e,t,n,a),a.pop())}));else if(c(n)){if(W.test(n)){var i="Detected HTML in message '"+n+"' of keypath '"+a.join("")+"' at '"+t+"'. Consider component interpolation with '<i18n>' to avoid XSS. See https://bit.ly/2ZqJzkp";"warn"===e?o(i):"error"===e&&function(e,t){"undefined"!=typeof console&&(console.error("[vue-i18n] "+e),t&&console.error(t.stack))}(i)}}};r(t,e,n,[])},J.prototype._initVM=function(e){var t=S.config.silent;S.config.silent=!0,this._vm=new S({data:e}),S.config.silent=t},J.prototype.destroyVM=function(){this._vm.$destroy()},J.prototype.subscribeDataChanging=function(e){this._dataListeners.push(e)},J.prototype.unsubscribeDataChanging=function(e){!function(e,t){if(e.length){var n=e.indexOf(t);if(n>-1)e.splice(n,1)}}(this._dataListeners,e)},J.prototype.watchI18nData=function(){var e=this;return this._vm.$watch("$data",(function(){for(var t=e._dataListeners.length;t--;)S.nextTick((function(){e._dataListeners[t]&&e._dataListeners[t].$forceUpdate()}))}),{deep:!0})},J.prototype.watchLocale=function(){if(!this._sync||!this._root)return null;var e=this._vm;return this._root.$i18n.vm.$watch("locale",(function(t){e.$set(e,"locale",t),e.$forceUpdate()}),{immediate:!0})},J.prototype.onComponentInstanceCreated=function(e){this._componentInstanceCreatedListener&&this._componentInstanceCreatedListener(e,this)},Q.vm.get=function(){return this._vm},Q.messages.get=function(){return d(this._getMessages())},Q.dateTimeFormats.get=function(){return d(this._getDateTimeFormats())},Q.numberFormats.get=function(){return d(this._getNumberFormats())},Q.availableLocales.get=function(){return Object.keys(this.messages).sort()},Q.locale.get=function(){return this._vm.locale},Q.locale.set=function(e){this._vm.$set(this._vm,"locale",e)},Q.fallbackLocale.get=function(){return this._vm.fallbackLocale},Q.fallbackLocale.set=function(e){this._localeChainCache={},this._vm.$set(this._vm,"fallbackLocale",e)},Q.formatFallbackMessages.get=function(){return this._formatFallbackMessages},Q.formatFallbackMessages.set=function(e){this._formatFallbackMessages=e},Q.missing.get=function(){return this._missing},Q.missing.set=function(e){this._missing=e},Q.formatter.get=function(){return this._formatter},Q.formatter.set=function(e){this._formatter=e},Q.silentTranslationWarn.get=function(){return this._silentTranslationWarn},Q.silentTranslationWarn.set=function(e){this._silentTranslationWarn=e},Q.silentFallbackWarn.get=function(){return this._silentFallbackWarn},Q.silentFallbackWarn.set=function(e){this._silentFallbackWarn=e},Q.preserveDirectiveContent.get=function(){return this._preserveDirectiveContent},Q.preserveDirectiveContent.set=function(e){this._preserveDirectiveContent=e},Q.warnHtmlInMessage.get=function(){return this._warnHtmlInMessage},Q.warnHtmlInMessage.set=function(e){var t=this,n=this._warnHtmlInMessage;if(this._warnHtmlInMessage=e,n!==e&&("warn"===e||"error"===e)){var r=this._getMessages();Object.keys(r).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,r[e])}))}},Q.postTranslation.get=function(){return this._postTranslation},Q.postTranslation.set=function(e){this._postTranslation=e},J.prototype._getMessages=function(){return this._vm.messages},J.prototype._getDateTimeFormats=function(){return this._vm.dateTimeFormats},J.prototype._getNumberFormats=function(){return this._vm.numberFormats},J.prototype._warnDefault=function(e,t,n,r,a,i){if(!p(n))return n;if(this._missing){var o=this._missing.apply(null,[e,t,r,a]);if(c(o))return o}else 0;if(this._formatFallbackMessages){var s=f.apply(void 0,a);return this._render(t,i,s.params,t)}return t},J.prototype._isFallbackRoot=function(e){return!e&&!p(this._root)&&this._fallbackRoot},J.prototype._isSilentFallbackWarn=function(e){return this._silentFallbackWarn instanceof RegExp?this._silentFallbackWarn.test(e):this._silentFallbackWarn},J.prototype._isSilentFallback=function(e,t){return this._isSilentFallbackWarn(t)&&(this._isFallbackRoot()||e!==this.fallbackLocale)},J.prototype._isSilentTranslationWarn=function(e){return this._silentTranslationWarn instanceof RegExp?this._silentTranslationWarn.test(e):this._silentTranslationWarn},J.prototype._interpolate=function(e,t,n,r,a,i,o){if(!t)return null;var s,l=this._path.getPathValue(t,n);if(Array.isArray(l)||h(l))return l;if(p(l)){if(!h(t))return null;if(!c(s=t[n]))return null}else{if(!c(l))return null;s=l}return(s.indexOf("@:")>=0||s.indexOf("@.")>=0)&&(s=this._link(e,t,s,r,"raw",i,o)),this._render(s,a,i,n)},J.prototype._link=function(e,t,n,r,a,i,o){var s=n,l=s.match(U);for(var c in l)if(l.hasOwnProperty(c)){var u=l[c],h=u.match(H),p=h[0],f=h[1],d=u.replace(p,"").replace(q,"");if(m(o,d))return s;o.push(d);var v=this._interpolate(e,t,d,r,"raw"===a?"string":a,"raw"===a?void 0:i,o);if(this._isFallbackRoot(v)){if(!this._root)throw Error("unexpected error");var g=this._root.$i18n;v=g._translate(g._getMessages(),g.locale,g.fallbackLocale,d,r,a,i)}v=this._warnDefault(e,d,v,r,Array.isArray(i)?i:[i],a),this._modifiers.hasOwnProperty(f)?v=this._modifiers[f](v):G.hasOwnProperty(f)&&(v=G[f](v)),o.pop(),s=v?s.replace(u,v):s}return s},J.prototype._render=function(e,t,n,r){var a=this._formatter.interpolate(e,n,r);return a||(a=K.interpolate(e,n,r)),"string"!==t||c(a)?a:a.join("")},J.prototype._appendItemToChain=function(e,t,n){var r=!1;return m(e,t)||(r=!0,t&&(r="!"!==t[t.length-1],t=t.replace(/!/g,""),e.push(t),n&&n[t]&&(r=n[t]))),r},J.prototype._appendLocaleToChain=function(e,t,n){var r,a=t.split("-");do{var i=a.join("-");r=this._appendItemToChain(e,i,n),a.splice(-1,1)}while(a.length&&!0===r);return r},J.prototype._appendBlockToChain=function(e,t,n){for(var r=!0,a=0;a<t.length&&"boolean"==typeof r;a++){var i=t[a];c(i)&&(r=this._appendLocaleToChain(e,i,n))}return r},J.prototype._getLocaleChain=function(e,t){if(""===e)return[];this._localeChainCache||(this._localeChainCache={});var n=this._localeChainCache[e];if(!n){t||(t=this.fallbackLocale),n=[];for(var r,a=[e];s(a);)a=this._appendBlockToChain(n,a,t);(a=c(r=s(t)?t:l(t)?t.default?t.default:null:t)?[r]:r)&&this._appendBlockToChain(n,a,null),this._localeChainCache[e]=n}return n},J.prototype._translate=function(e,t,n,r,a,i,o){for(var s,l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(!p(s=this._interpolate(u,e[u],r,a,i,o,[r])))return s}return null},J.prototype._t=function(e,t,n,r){for(var a,i=[],o=arguments.length-4;o-- >0;)i[o]=arguments[o+4];if(!e)return"";var s=f.apply(void 0,i),l=s.locale||t,c=this._translate(n,l,this.fallbackLocale,e,r,"string",s.params);if(this._isFallbackRoot(c)){if(!this._root)throw Error("unexpected error");return(a=this._root).$t.apply(a,[e].concat(i))}return c=this._warnDefault(l,e,c,r,i,"string"),this._postTranslation&&null!=c&&(c=this._postTranslation(c,e)),c},J.prototype.t=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this)._t.apply(t,[e,this.locale,this._getMessages(),null].concat(n))},J.prototype._i=function(e,t,n,r,a){var i=this._translate(n,t,this.fallbackLocale,e,r,"raw",a);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.i(e,t,a)}return this._warnDefault(t,e,i,r,[a],"raw")},J.prototype.i=function(e,t,n){return e?(c(t)||(t=this.locale),this._i(e,t,this._getMessages(),null,n)):""},J.prototype._tc=function(e,t,n,r,a){for(var i,o=[],s=arguments.length-5;s-- >0;)o[s]=arguments[s+5];if(!e)return"";void 0===a&&(a=1);var l={count:a,n:a},c=f.apply(void 0,o);return c.params=Object.assign(l,c.params),o=null===c.locale?[c.params]:[c.locale,c.params],this.fetchChoice((i=this)._t.apply(i,[e,t,n,r].concat(o)),a)},J.prototype.fetchChoice=function(e,t){if(!e&&!c(e))return null;var n=e.split("|");return n[t=this.getChoiceIndex(t,n.length)]?n[t].trim():e},J.prototype.tc=function(e,t){for(var n,r=[],a=arguments.length-2;a-- >0;)r[a]=arguments[a+2];return(n=this)._tc.apply(n,[e,this.locale,this._getMessages(),null,t].concat(r))},J.prototype._te=function(e,t,n){for(var r=[],a=arguments.length-3;a-- >0;)r[a]=arguments[a+3];var i=f.apply(void 0,r).locale||t;return this._exist(n[i],e)},J.prototype.te=function(e,t){return this._te(e,this.locale,this._getMessages(),t)},J.prototype.getLocaleMessage=function(e){return d(this._vm.messages[e]||{})},J.prototype.setLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,t)},J.prototype.mergeLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,_({},this._vm.messages[e]||{},t))},J.prototype.getDateTimeFormat=function(e){return d(this._vm.dateTimeFormats[e]||{})},J.prototype.setDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,t),this._clearDateTimeFormat(e,t)},J.prototype.mergeDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,_(this._vm.dateTimeFormats[e]||{},t)),this._clearDateTimeFormat(e,t)},J.prototype._clearDateTimeFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._dateTimeFormatters.hasOwnProperty(r)&&delete this._dateTimeFormatters[r]}},J.prototype._localizeDateTime=function(e,t,n,r,a){for(var i=t,o=r[i],s=this._getLocaleChain(t,n),l=0;l<s.length;l++){var c=s[l];if(i=c,!p(o=r[c])&&!p(o[a]))break}if(p(o)||p(o[a]))return null;var u=o[a],h=i+"__"+a,f=this._dateTimeFormatters[h];return f||(f=this._dateTimeFormatters[h]=new Intl.DateTimeFormat(i,u)),f.format(e)},J.prototype._d=function(e,t,n){if(!n)return new Intl.DateTimeFormat(t).format(e);var r=this._localizeDateTime(e,t,this.fallbackLocale,this._getDateTimeFormats(),n);if(this._isFallbackRoot(r)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.d(e,n,t)}return r||""},J.prototype.d=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._d(e,r,a)},J.prototype.getNumberFormat=function(e){return d(this._vm.numberFormats[e]||{})},J.prototype.setNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,t),this._clearNumberFormat(e,t)},J.prototype.mergeNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,_(this._vm.numberFormats[e]||{},t)),this._clearNumberFormat(e,t)},J.prototype._clearNumberFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._numberFormatters.hasOwnProperty(r)&&delete this._numberFormatters[r]}},J.prototype._getNumberFormatter=function(e,t,n,r,a,i){for(var o=t,s=r[o],l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(o=u,!p(s=r[u])&&!p(s[a]))break}if(p(s)||p(s[a]))return null;var h,f=s[a];if(i)h=new Intl.NumberFormat(o,Object.assign({},f,i));else{var d=o+"__"+a;(h=this._numberFormatters[d])||(h=this._numberFormatters[d]=new Intl.NumberFormat(o,f))}return h},J.prototype._n=function(e,t,n,r){if(!J.availabilities.numberFormat)return"";if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).format(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.format(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.n(e,Object.assign({},{key:n,locale:t},r))}return i||""},J.prototype.n=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null,o=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key),o=Object.keys(t[0]).reduce((function(e,n){var r;return m(i,n)?Object.assign({},e,((r={})[n]=t[0][n],r)):e}),null)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._n(e,r,a,o)},J.prototype._ntp=function(e,t,n,r){if(!J.availabilities.numberFormat)return[];if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).formatToParts(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.formatToParts(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n._ntp(e,t,n,r)}return i||[]},Object.defineProperties(J.prototype,Q),Object.defineProperty(J,"availabilities",{get:function(){if(!B){var e="undefined"!=typeof Intl;B={dateTimeFormat:e&&void 0!==Intl.DateTimeFormat,numberFormat:e&&void 0!==Intl.NumberFormat}}return B}}),J.install=A,J.version="8.18.2";var X=J,Z=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("el-container",{class:["ec-doc","ec-doc-"+e.shared.docType,"ec-doc-locale-"+e.shared.locale]},[n("el-aside",{staticStyle:{height:"100%"},attrs:{width:"300px"}},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("Search"),e._v(" "),n("DocNav")],1),e._v(" "),n("el-main",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1)],1)};Z._withStripped=!0;var Y=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-nav"},[e.isOption?n("h3",[e._v(e._s(e.title))]):e._e(),e._v(" "),n("div",{staticClass:"toolbox"},[e.isOption?n("span",{staticClass:"item",on:{click:e.collapseAll}},[n("i",{staticClass:"el-icon-s-fold"}),e._v(e._s(e.$t("nav.collapseAll")))]):e._e()]),e._v(" "),n("el-tree",{ref:"tree",attrs:{"node-key":"path","empty-text":"",props:e.props,lazy:"","default-expanded-keys":e.expandedKeys,indent:10,"expand-on-click-node":!1,load:e.loadTreeNode,data:e.treeData,"current-node-key":e.initialSelectedNode},on:{"current-change":e.onSelectNode},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.node,a=t.data;return"tutorial"!==e.shared.docType?n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(r.expanded&&a.labelExpanded||a.label))]),e._v(" "),null!=a.defaultValue?n("span",{staticClass:"default-value"},[e._v(e._s(a.defaultValue))]):r.isLeaf?n("span",{staticClass:"default-value"},[e._v("...")]):e._e(),e._v(" "),a.isRoot||r.expanded?e._e():n("span",[e._v(",")])]):n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(a.label))])])}}],null,!0)})],1)};Y._withStripped=!0;var ee,te,ne,re,ae=n(21),ie=n(23);function oe(e){return(oe="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var se,le,ce={},ue={},he=[];function pe(e){return new Promise((function(t,n){var r=Object(ie.getDocJSONPVarNname)(e),a="".concat(ee,"/").concat(e,"?").concat(ne),i=document.createElement("script");i.async=!0,i.onload=function(){window[r]?t(window[r]):n("Load failed. ".concat(r))},i.src=a,document.body.appendChild(i)}))}function fe(e){return"doc-content-"+e.replace(/[\. <>]/g,"-")}function de(){if(!re)throw new Error("Preload json with url first");return re}function me(e,t,n,r){return e,ee=t,te=n,ne=r||"1",re||(re=pe("".concat(te,"-outline.js")).then((function(e){return function(e){function t(e,t,n){return e?e+n+t:t}function n(e,r){e.type||(e.type=oe(e.default)),e.type instanceof Array||(e.type=[e.type]);for(var a=0;a<e.type.length;a++)"*"===e.type[a]&&(e.type[a]="any");if(e.arrayItemType?e.path=t(r.path,e.arrayItemType,"-"):e.path=t(r.path,e.prop,"."),e.children){e.path.indexOf(".")<0&&!e.children[0].arrayItemType&&(se[e.path]=e);for(var i=0;i<e.children.length;i++)n(e.children[i],e)}ue[e.path]=e}e,se={};for(var r=0;r<e.children.length;r++)n(e.children[r],{});return e.isRoot=!0,he=Object.keys(ue),e}(e)}))),re}function ve(e){if(!se)throw new Error("Outline data is not loaded.");var t=e.split(".")[0],n=se[t]&&e?te+"."+t:te;if(!ce[n]){var r=pe("".concat(n,".js"));ce[n]={fetcher:r},r.then((function(e){ce[n].indexer=function(e,t){var n,r=[];for(var a in e)r.push({path:t?t+"."+a:a,content:e[a].desc,text:(n=e[a].desc,n.replace(/<[^>]*>?/gm,""))});return{search:function(e){var t=[],n=e.split(/[ +,]/).filter((function(e){return!!e})).map((function(e){return new RegExp(e,"i")}));if(!n.length)return t;for(var a=0;a<r.length;a++){for(var i=!0,o=0;o<n.length;o++)if(!n[o].test(r[a].text)&&!n[o].test(r[a].path)){i=!1;break}i&&t.push(r[a])}return t}}}(e,t)}))}return ce[n]}function ge(e){return ve(e).fetcher}function _e(e){return ue[e]}function ye(e){if(!e)return Object.keys(se)[0];if(_e(e.replace("[i]","")))return e.replace("[i]","");var t,n=e.split(".").map((function(e){var t=_e(e),n=t&&t.children&&t&&t.children[0];return n&&n.arrayItemType?e+"-"+n.arrayItemType:e}));if(_e(n.join(".")))return n.join(".");for(var r=-1/0,a=0;a<he.length;a++){var i=he[a],o=Object(ae.stringSimilarity)(e,i);o>r&&(r=o,t=i)}return t}function be(e){return(be="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var xe=["auto","top","bottom","right"];function Ee(e){ke.computedOptionExampleLayout="auto"===e?window.innerWidth<1400?"bottom":"right":e,ke.optionExampleLayout=e,window.localStorage&&window.localStorage.setItem("_ec_option_example_layout",e)}var we,Ce,Se=(we={},!(Ce=window.localStorage&&window.localStorage.getItem("_ec_option_example_layout"))||"auto"===Ce||xe.indexOf(Ce)<0?(we.mode="auto",we.computedMode=window.innerWidth<1400?"bottom":"right"):we.mode=we.computedMode=Ce,we),ke={docType:"",currentPath:"",fuzzySearch:!1,searchQuery:"",isMobile:!1,locale:"zh",showOptionExample:!1,allOptionExamples:null,cleanMode:!1,currentExampleName:"",currentExampleOption:"",optionExampleLayout:Se.mode,computedOptionExampleLayout:Se.computedMode};function Oe(){if(ke.isMobile){var e=ke.currentPath.split("."),t=_e(ke.currentPath);return t&&(!t.children||!t.children.length)&&e.length>1&&e.pop(),e.join(".")}return ke.currentPath.split(".")[0]}function Me(){return"option"===ke.docType||"option-gl"===ke.docType}var Ne=["markPoint","markLine","markArea","tooltip","axisPointer"];function Te(e,t,n){function r(e,t,a,i){var o=t.shift();if(i=(i?i+".":"")+o,"data"!==a||"object"===be(e)&&!Array.isArray(e)||(e={value:e}),e=Object.assign({},e),!t.length)return void 0===n?(delete e[o],e):(e[o]=n,e);var s=o.split("-"),l=s[0],c=s[1];if(null==e[l]){var u=_e(i);e[l]=function(e){return"markPoint"===e?{data:[{type:"max"}]}:"markLine"===e?{data:[{type:"average"}]}:"markArea"===e?{data:[[{type:"min"},{type:"max"}]]}:void 0}(l)||(u&&u.isArray?[]:{})}var h=e[l];return Array.isArray(h)?"series"===l?e[l]=h.map((function(e,n){return c&&e.type!==c?e:r(e,t.slice(),l,i)})):(e[l]=h.slice(),e[l][0]=r(e[l][0]||{},t.slice(),l,i)):(c&&h.type!==c&&(e[l]=h),e[l]=r(h,t.slice(),l,i)),e}var a=t.split(".")[0];return"timeline"===a&&e.baseOption?Object.assign({},e,{baseOption:r(e.baseOption,t.split("."),"","")}):Ne.indexOf(a)>=0?function e(n,a){if(n[a])return r(n,t.split("."),"","");if(Array.isArray(n)){for(var i=[],o=0;o<n.length;o++)i.push(e(n[o],a));return i}if("object"===be(n)){var s={};for(var l in n)n.hasOwnProperty(l)&&(s[l]=e(n[l],a));return s}return n}(e,a):r(e,t.split("."),"","")}function Ie(){var e=decodeURIComponent(window.location.hash.slice(1));if(e.startsWith("/search/")){var t=e.substr("/search/".length);ke.fuzzySearch=!0,ke.searchQuery=t}else e&&(ke.currentPath=e,ke.fuzzySearch=!1)}function Re(e){window.location.hash="#"+encodeURIComponent(e)}var Ae=n(1),Le=n.n(Ae);function De(e,t){var n=[];return t.children&&t.children.forEach((function(e){var t,r;n.push(((r={path:(t=e).path}).path=t.path,t.arrayItemType?(r.label="{type: ".concat(t.arrayItemType,", ...}"),r.labelExpanded="{"):null!=t.default?(r.defaultValue=t.default,r.label=t.prop+": ",r.leaf=!0):t.isArray?(r.label=t.prop+": [{...}]",r.labelExpanded=t.prop+": [{"):t.isObject?(r.label=t.prop+": {...}",r.labelExpanded=t.prop+": {"):(r.label=t.prop,r.leaf=!0),r.$source=Object.freeze(t),r))})),n}var $e={data:function(){return{props:{isLeaf:"leaf"},title:"setOption({",treeData:[],expandedKeys:[],loading:!0,shared:ke,initialSelectedNode:ke.currentPath}},created:function(){this.updateTreeSelectionAndExpand()},computed:{isOption:function(){return Me()}},methods:{updateTreeSelectionAndExpand:function(){this.expandedKeys=[];for(var e,t=this.shared.currentPath;(e=t.lastIndexOf("."))>=0||(e=t.lastIndexOf("-"))>=0;)t=t.substr(0,e),this.expandedKeys.push(t)},loadTreeNode:function(e,t){var n=this;0===e.level?(this.loading=!1,de().then((function(r){t(De(e.data,r)),setTimeout((function(){n.scrollToCurrentTreeNode()}),200)}))):e.data.children&&e.data.children.length?t(e.data.children):e.data.$source?t(De(e.data,e.data.$source)):t([])},onSelectNode:function(e,t){this.shared.currentPath=e.path},scrollToCurrentTreeNode:function(){var e=this.$el.querySelector(".el-tree-node.is-current");if(e){var t=e.getBoundingClientRect(),n=this.$el.getBoundingClientRect();(t.top>n.bottom||t.bottom<n.top)&&Le()(e,{time:500,align:{top:.1}})}},manualSelectNode:function(e){var t=this;this.updateTreeSelectionAndExpand(),setTimeout((function(){t.$refs.tree.setCurrentKey(null),t.$refs.tree.setCurrentKey(e),setTimeout((function(){t.scrollToCurrentTreeNode()}),200)}),50)},collapseAll:function(){for(var e in this.$refs.tree.store.nodesMap)this.$refs.tree.store.nodesMap[e].expanded=!1}},watch:{"shared.currentPath":function(e){Re(e),this.manualSelectNode(e)}}};n(31);function Pe(e,t,n,r,a,i,o,s){var l,c="function"==typeof e?e.options:e;if(t&&(c.render=t,c.staticRenderFns=n,c._compiled=!0),r&&(c.functional=!0),i&&(c._scopeId="data-v-"+i),o?(l=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),a&&a.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},c._ssrRegister=l):a&&(l=s?function(){a.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:a),l)if(c.functional){c._injectStyles=l;var u=c.render;c.render=function(e,t){return l.call(t),u(e,t)}}else{var h=c.beforeCreate;c.beforeCreate=h?[].concat(h,l):[l]}return{exports:e,options:c}}var Ve=Pe($e,Y,[],!1,null,null,null);Ve.options.__file="src/components/DocNav.vue";var je=Ve.exports,Fe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-main"},[n("div",{ref:"docContentDom",class:["doc-content",e.shared.showOptionExample?"option-example-actived":"","option-example-"+e.shared.computedOptionExampleLayout+"-layout"]},[n("h2",{attrs:{id:e.pageId}},[e._v(e._s(e.pageTitle))]),e._v(" "),e.pageDesc?n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"page-description",domProps:{innerHTML:e._s(e.pageDesc)}}):e._e(),e._v(" "),e.pageDisplayOutline.children&&e.pageDisplayOutline.children&&1<=e.maxDepth?n("div",[n("h3",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),e._l(e.pageDisplayOutline.children,(function(t){return n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.pageDescMap,"max-depth":e.maxDepth,depth:1},on:{"scroll-to-self":e.scrollTo,"toggle-expanded":e.handleCardExpandToggle}})}))],2):e._e()]),e._v(" "),e.showLiveExample?[e.shared.showOptionExample?n("LiveExample",{ref:"liveExample"}):n("div",{staticClass:"open-option-example",on:{click:e.openOptionExample}},[n("i",{staticClass:"el-icon-data-line"}),e._v(" "+e._s(e.$t("example.titleShort"))+"\n        ")])]:e._e()],2)};Fe._withStripped=!0;var ze=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["doc-content-item-card","level-"+e.depth,e.isLeaf?"leaf":"",e.shared.currentPath===e.nodeData.path?"current":""],attrs:{id:e.itemId}},[e.expanded?n("div",{staticClass:"hierarchy-line"}):e._e(),e._v(" "),n("h4",[e.depth>1?n("span",{staticClass:"guider"}):e._e(),e._v(" "),e.supportsExpandable?n("el-button",{attrs:{plain:"",circle:"",size:"mini",icon:e.expanded?"el-icon-minus":"el-icon-plus"},on:{click:e.toggleExpanded}}):e._e(),e._v(" "),e.shared.isMobile?e._e():n("span",{staticClass:"path-parent"},e._l(e.parentPath,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text)+".")])})),0),e._v(" "),n("span",{staticClass:"path-base"},[n("a",{attrs:{href:"#"+e.baseName.link}},[e._v(e._s(e.baseName.text))])]),e._v(" "),e.nodeData.default&&"*"!==e.nodeData.default?n("span",{staticClass:"default-value"},[e._v(" = "+e._s(e.nodeData.default))]):e._e(),e._v(" "),e.uiControl&&e.shared.allOptionExamples&&!e.shared.isMobile?n("span",{class:["control-toggle",e.enableUIControl?"active":""],on:{click:e.toggleUIControl}},[n("i",[e._v("")]),e._v(" "+e._s(e.$t("example.tryDesc"))+"\n            ")]):e._e()],1),e._v(" "),n("div",{staticClass:"prop-types"},e._l(e.nodeData.type,(function(t){return n("span",{key:t,class:["prop-type","prop-type-"+t.toLowerCase()]},[e._v(e._s(t))])})),0),e._v(" "),e.enableUIControl?n("OptionControl",{attrs:{controlConfig:e.uiControl,optionPath:e.nodeData.path}}):e._e(),e._v(" "),n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"item-description",domProps:{innerHTML:e._s(e.desc)}}),e._v(" "),e.supportsExpandable?n("div",{staticClass:"children"},e._l(e.nodeData.children,(function(t){return e.expanded?n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.descMap,depth:e.depth+1,"max-depth":e.maxDepth},on:{"toggle-expanded":e.bubbleEventToggleExapndedEvent,"scroll-to-self":e.bubbleScrollToSelfEvent}}):e._e()})),1):e._e(),e._v(" "),e.expanded&&!e.shared.isMobile||e.isLeaf?e._e():n("PropertiesList",{attrs:{nodeData:e.nodeData,descMap:e.descMap}})],1)};ze._withStripped=!0;var Be=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"properties-list-panel"},[n("h5",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),n("div",{staticClass:"properties-list"},[e._v("\n        {\n        "),e._l(e.displayedProperties,(function(t,r){return n("span",{key:t.path},[e.shared.isMobile?n("span",[n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]):n("el-popover",{attrs:{title:e.getName(t.path),"close-delay":400,"open-delay":200,placement:"top",trigger:"hover"}},[n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"property-popup-desc",domProps:{innerHTML:e._s(e.getDesc(t.path))}}),e._v(" "),n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]),e._v(" "),r<e.displayedProperties.length-1?n("span",[e._v(", ")]):e._e()],1)})),e._v("\n        }\n    ")],2)])};Be._withStripped=!0;var We={props:["nodeData","descMap"],data:function(){return{shared:ke}},computed:{displayedProperties:function(){return this.nodeData.children}},methods:{getDesc:function(e){return this.descMap[e]},getName:function(e){return e.split(".").pop()}}},Ue=(n(32),Pe(We,Be,[],!1,null,null,null));Ue.options.__file="src/components/PropertiesList.vue";var He=Ue.exports,qe=function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"option-control"},[t(this.uiComponent,this._b({tag:"component",attrs:{value:this.defaultValue},on:{change:this.onValueChange}},"component",this.uiAttrs,!1))],1)};qe._withStripped=!0;var Ge=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-color"},[n("el-color-picker",{attrs:{"show-alpha":!0},on:{change:e.onValueChange,"active-change":e.onActiveChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}}),e._v(" "),n("span",{style:{color:e.innerValue||"#aaa"}},[e._v("\n    "+e._s(e.innerValue||e.$t("example.defaultColor"))+"\n")])],1)};Ge._withStripped=!0;var Ke={props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},onActiveChange:function(e){}}},Je=(n(33),Pe(Ke,Ge,[],!1,null,null,null));Je.options.__file="src/controls/ControlColor.vue";var Qe=Je.exports,Xe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-boolean"},[n("el-switch",{attrs:{"active-text":e.$t("example.booleanDesc")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};Xe._withStripped=!0;var Ze=Pe({props:["value"],data:function(){return{innerValue:"true"===this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},Xe,[],!1,null,null,null);Ze.options.__file="src/controls/ControlBoolean.vue";var Ye=Ze.exports,et=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-number"},[n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};et._withStripped=!0;var tt={props:["value","min","max","step"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},nt=(n(34),Pe(tt,et,[],!1,null,null,null));nt.options.__file="src/controls/ControlNumber.vue";var rt=nt.exports,at=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-vector"},[n("el-switch",{attrs:{"active-text":e.$t("example.vectorSetSeparate")},model:{value:e.innerSeparate,callback:function(t){e.innerSeparate=t},expression:"innerSeparate"}}),e._v(" "),e.innerSeparate?n("div",{staticClass:"control-vector-group"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValueArr[r],callback:function(t){e.$set(e.innerValueArr,r,t)},expression:"innerValueArr[index]"}})],1)})),0):n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.innerValueArr[0],callback:function(t){e.$set(e.innerValueArr,0,t)},expression:"innerValueArr[0]"}})],1)};at._withStripped=!0;var it={props:["value","separate","min","max","step","dims"],data:function(){return{innerSeparate:"true"===this.separate,innerValueArr:this.value.split(",").map((function(e){return+e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return+e.trim()}))}},methods:{onValueChange:function(){if(!this.innerSeparate)for(var e=1;e<this.innerValueArr.length;e++)this.innerValueArr[e]=this.innerValueArr[0];this.$emit("change",this.innerValueArr.slice())}}},ot=(n(35),Pe(it,at,[],!1,null,null,null));ot.options.__file="src/controls/ControlVector.vue";var st=ot.exports,lt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-enum"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,class:{"control-enum-special":null!=e.specialValues[t]},attrs:{value:t}},[e._v(e._s(t))])})),1)],1)};lt._withStripped=!0;var ct={true:!0,false:!1},ut={props:["value","options"],computed:{optionsArr:function(){return this.options.split(",").map((function(e){return e.trim()}))},specialValues:function(){return ct}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",ct.hasOwnProperty(this.innerValue)?ct[this.innerValue]:this.innerValue)}}},ht=(n(36),Pe(ut,lt,[],!1,null,null,null));ht.options.__file="src/controls/ControlEnum.vue";var pt=ht.exports,ft=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent"},[n("el-radio-group",{attrs:{size:"mini"},model:{value:e.mode,callback:function(t){e.mode=t},expression:"mode"}},[n("el-radio-button",{attrs:{label:"absolute"}},[e._v(e._s(e.$t("example.absoluteMode")))]),e._v(" "),n("el-radio-button",{attrs:{label:"percent"}},[e._v(e._s(e.$t("example.percentMode")))])],1),e._v(" "),"absolute"===e.mode?n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.absoluteValue,callback:function(t){e.absoluteValue=t},expression:"absoluteValue"}}):n("div",[n("el-slider",{attrs:{min:0,max:100,step:1,"format-tooltip":e.formatTooltip},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}}),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:0,max:100,step:1},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}})],1)],1)};ft._withStripped=!0;var dt={props:["value","min","max","step"],data:function(){var e=this.value.indexOf("%")<0;return{percentValue:e?50:+this.value.replace("%",""),absoluteValue:e?+this.value:0,mode:e?"absolute":"percent"}},watch:{value:function(e){"absolute"===this.mode?this.absoluteValue=+e:this.percentValue=+e.replace("%","")},mode:function(){this.onValueChange()}},methods:{onValueChange:function(){this.$emit("change","absolute"===this.mode?this.absoluteValue:this.percentValue+"%")},formatTooltip:function(e){return e+"%"}}},mt=(n(37),Pe(dt,ft,[],!1,null,null,null));mt.options.__file="src/controls/ControlPercent.vue";var vt=mt.exports,gt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent-vector"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("ControlPercent",{attrs:{value:e.innerValueArr[r],"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:function(t){return e.onValueChange(r,t)}}})],1)})),0)};gt._withStripped=!0;var _t={components:{ControlPercent:vt},props:["value","min","max","step","dims"],data:function(){return{innerValueArr:this.value.split(",").map((function(e){return e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return e.trim()}))}},methods:{onValueChange:function(e,t){this.innerValueArr[e]=t,this.$emit("change",this.innerValueArr.slice())}}},yt=(n(38),Pe(_t,gt,[],!1,null,null,null));yt.options.__file="src/controls/ControlPercentVector.vue";var bt=yt.exports,xt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-text"},[n("el-input",{attrs:{size:"mini",placeholder:e.$t("example.inputPlaceholder")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};xt._withStripped=!0;var Et=Pe({props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},xt,[],!1,null,null,null);Et.options.__file="src/controls/ControlText.vue";var wt=Et.exports,Ct=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-icon"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,attrs:{value:t}},[e._v(e._s(t))])})),1),e._v(" "),n("el-button",{attrs:{size:"mini",type:"primary"},on:{click:e.chooseFile}},[e._v(e._s(e.$t("example.upload")))])],1)};function St(e){return(St="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Ct._withStripped=!0,SVGElement.prototype.getTransformToElement=SVGElement.prototype.getTransformToElement||function(e){return e.getScreenCTM().inverse().multiply(this.getScreenCTM())};var kt=/,?([achlmqrstvxz]),?/gi,Ot=function(e){return e.join(",").replace(kt,"$1")};function Mt(e,t,n,r,a){if(e)if(void 0===r&&(r=!1),void 0===t&&(t=!1),void 0===n&&(n=!1),void 0===a&&(a=!1),e&&e.children&&e.children.length){for(var i=0,o=e.children.length;i<o;i++)Mt(e.children[i],t,n,r,a);e.removeAttribute("transform")}else if(e instanceof SVGCircleElement||e instanceof SVGRectElement||e instanceof SVGEllipseElement||e instanceof SVGLineElement||e instanceof SVGPolygonElement||e instanceof SVGPolylineElement||e instanceof SVGPathElement){var s,l=function(e,t){if(!e)return;for(var n=document.createElementNS(e.ownerSVGElement.namespaceURI,"path"),r=["requiredFeatures","requiredExtensions","systemLanguage","id","xml:base","xml:lang","xml:space","onfocusin","onfocusout","onactivate","onclick","onmousedown","onmouseup","onmouseover","onmousemove","onmouseout","onload","alignment-baseline","baseline-shift","clip","clip-path","clip-rule","color","color-interpolation","color-interpolation-filters","color-profile","color-rendering","cursor","direction","display","dominant-baseline","enable-background","fill","fill-opacity","fill-rule","filter","flood-color","flood-opacity","font-family","font-size","font-size-adjust","font-stretch","font-style","font-variant","font-weight","glyph-orientation-horizontal","glyph-orientation-vertical","image-rendering","kerning","letter-spacing","lighting-color","marker-end","marker-mid","marker-start","mask","opacity","overflow","pointer-events","shape-rendering","stop-color","stop-opacity","stroke","stroke-dasharray","stroke-dashoffset","stroke-linecap","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke-width","text-anchor","text-decoration","text-rendering","unicode-bidi","visibility","word-spacing","writing-mode","class","style","externalResourcesRequired","transform","d","pathLength"],a=0,i=r.length;a<i;a++){var o,s=r[a];(o=e.getAttribute(s))&&n.setAttribute(s,o)}var l="",c=function(e){return!("number"!=typeof e||e==1/0||e<0)},u=1.81,h=e.tagName;switch(h){case"ellipse":case"circle":var p=+e.getAttribute("rx"),f=+e.getAttribute("ry"),d=+e.getAttribute("cx"),m=+e.getAttribute("cy");"circle"==h&&(p=f=+e.getAttribute("r")),l+=Ot([["M",d-p,m],["C",d-p,m-f/u,d-p/u,m-f,d,m-f],["C",d+p/u,m-f,d+p,m-f/u,d+p,m],["C",d+p,m+f/u,d+p/u,m+f,d,m+f],["C",d-p/u,m+f,d-p,m+f/u,d-p,m],["Z"]]);break;case"path":l=e.getAttribute("d");break;case"line":var v=e.getAttribute("x1"),g=e.getAttribute("y1");x2=e.getAttribute("x2"),y2=e.getAttribute("y2"),l="M"+v+","+g+"L"+x2+","+y2;break;case"polyline":l="M"+e.getAttribute("points");break;case"polygon":l="M"+e.getAttribute("points")+"Z";break;case"rect":p=+e.getAttribute("rx"),f=+e.getAttribute("ry");var _=e.getBBox(),y=_.x,b=_.y,x=_.width,E=_.height;if(c(p)||c(f)?c(p)&&!c(f)?f=p:c(f)&&!c(p)?p=f:(p>x/2&&(p=x/2),f>E/2&&(f=E/2)):p=f=0,p||f)if(t)l+=Ot([["M",y+p,b],["H",y+x-p],["A",p,f,0,0,1,y+x,b+f],["V",b+E-f],["A",p,f,0,0,1,y+x-p,b+E],["H",y+p],["A",p,f,0,0,1,y,b+E-f],["V",b+f],["A",p,f,0,0,1,y+p,b]]);else{f||(f=p),l+=Ot([["M",y,b+f],["C",y,b+f/(u=2.19),y+p/u,b,y+p,b],["L",y+x-p,b],["C",y+x-p/u,b,y+x,b+f/u,y+x,b+f],["L",y+x,b+E-f],["C",y+x,b+E-f/u,y+x-p/u,b+E,y+x-p,b+E],["L",y+p,b+E],["C",y+p/u,b+E,y,b+E-f/u,y,b+E-f],["L",y,b+f],["Z"]])}else l+=Ot([["M",y,b],["L",y+x,b],["L",y+x,b+E],["L",y,b+E],["L",y,b],["Z"]])}l&&n.setAttribute("d",l);return e.parentNode.replaceChild(n,e),n}(e,r);if(!l||""==l.getAttribute(u))return"M 0 0";a||0===a?a>15?a=15:a<0&&(a=0):a=!1;var c=l,u=c.getAttribute("d").trim();if(t)h=s=Yt(u);else{var h=s=Gt(u);s=Kt(s)}var p,f,d=c.ownerSVGElement,m=c.getTransformToElement(d),v=(i=0,s.length),g="",_="",y=0,b=0,x=[],E=d.createSVGPoint(),w={},C=0,S=0;for(w.x=null,w.y=null;i<v;i++){if(g=s[i][0].toUpperCase(),_=h[i][0],x[i]=[],x[i][0]=s[i][0],"A"==g)y=s[i][6],b=s[i][7],E.x=s[i][6],E.y=s[i][7],x[i]=Nt(s[i][1],s[i][2],s[i][3],s[i][4],s[i][5],E,m),x[i][1]=x[i][1],x[i][2]=x[i][2],x[i][3]=x[i][3],x[i][6]=x[i][6],x[i][7]=x[i][7];else if("Z"!=g)for(p=1;p<s[i].length;p+=2)"V"==g?b=s[i][p]:"H"==g?y=s[i][p]:(y=s[i][p],b=s[i][p+1]),E.x=y,E.y=b,f=E.matrixTransform(m),"V"==g||"H"==g?(x[i][0]="L",x[i][p]=f.x,x[i][p+1]=f.y):(x[i][p]=f.x,x[i][p+1]=f.y);("Z"!=g&&null===w.x||"M"==g)&&(w.x=y,w.y=b),"Z"==g&&(y=w.x,b=w.y)}var k=0,O=0;for(w.x="",i=0;i<x.length;i++){if("A"==(_=h[i][0])||"M"==_||"L"==_||"C"==_||"S"==_||"Q"==_||"T"==_||"H"==_||"V"==_){var M=N=x[i].length;if("A"==_)x[i][6]=T(x[i][6]),x[i][7]=T(x[i][7]);else for(M--;--M;)x[i][M]=T(x[i][M]);C=x[i][N-2],S=x[i][N-1]}else if("a"==_)k=x[i][6],O=x[i][7],x[i][0]=_,x[i][6]=T(x[i][6]-C),x[i][7]=T(x[i][7]-S),C=k,S=O;else if("m"==_||"l"==_||"c"==_||"s"==_||"q"==_||"t"==_||"h"==_||"v"==_){var N=x[i].length;for(k=x[i][N-2],O=x[i][N-1],p=1;p<N;p+=2)x[i][0]="h"==_||"v"==_?"l":_,x[i][p]=T(x[i][p]-C),x[i][p+1]=T(x[i][p+1]-S);C=k,S=O}("z"!=_.toLowerCase()&&""==w.x||"m"==_.toLowerCase())&&(w.x=C,w.y=S),"z"==_.toLowerCase()&&(C=w.x,S=w.y)}n&&(x=Kt(x)),l.setAttribute("d",Ot(x)),l.removeAttribute("transform")}function T(e){return!1!==a?Math.round(e*Math.pow(10,a))/Math.pow(10,a):e}}function Nt(e,t,n,r,a,i,o,s){function l(e){return Math.abs(e)<1e-16}var c,u,h,p,f,d,m,v,g,_,y,b=[];if(c=e,u=t,h=n*=Math.PI/180,p=parseFloat(Math.sin(h)),f=parseFloat(Math.cos(h)),b[0]=o.a*+c*f+o.c*c*p,b[1]=o.b*+c*f+o.d*c*p,b[2]=o.a*-u*p+o.c*u*f,b[3]=o.b*-u*p+o.d*u*f,g=(d=b[0]*b[0]+b[2]*b[2])-(v=b[1]*b[1]+b[3]*b[3]),l(m=2*(b[0]*b[1]+b[2]*b[3])))n=0,_=d,y=v;else if(l(g))_=d+.5*m,y=d-.5*m,n=Math.PI/4;else{var x=1+m*m/(g*g);_=.5*(d+v+(x=x<0?0:Math.sqrt(x))*g),y=.5*(d+v-x*g),n=.5*Math.atan2(m,g)}return _=_<0?0:Math.sqrt(_),y=y<0?0:Math.sqrt(y),g<=0?(t=_,e=y):(t=y,e=_),o.a*o.d-o.b*o.c<0&&(a=a?0:1),i=i.matrixTransform(o),["A",e,t,n=180*n/Math.PI,r,a,i.x,i.y]}var Tt={},It="hasOwnProperty",Rt=String,At={NaN:1,Infinity:1,"-Infinity":1},Lt=Rt.prototype.toLowerCase,Dt=Rt.prototype.toUpperCase,$t=Object.prototype.toString,Pt="concat",Vt=Math,jt=Vt.max,Ft=(Vt.min,Vt.abs,Vt.pow,Vt.PI),zt=(Vt.round,parseFloat),Bt=(parseInt,kt=/,?([achlmqrstvxz]),?/gi,/([achlmrqstvz])[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*)+)/gi),Wt=/(-?\d*\.?\d*(?:e[\-+]?\d+)?)[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*/gi;Tt.is=function(e,t){return"finite"==(t=Lt.call(t))?!At[It](+e):"array"==t?e instanceof Array:"null"==t&&null===e||t==St(e)&&null!==e||"object"==t&&e===Object(e)||"array"==t&&Array.isArray&&Array.isArray(e)||$t.call(e).slice(8,-1).toLowerCase()==t},Tt._path2string=function(){return this.join(",").replace(kt,"$1")};var Ut=function(e){var t=function e(t){if(Object(t)!==t)return t;var n=new t.constructor;for(var r in t)t[It](r)&&(n[r]=e(t[r]));return n}(e);return t.toString=Tt._path2string,t},Ht=function e(t){var n=e.ps=e.ps||{};return n[t]?n[t].sleep=100:n[t]={sleep:100},setTimeout((function(){for(var e in n)n[It](e)&&e!=t&&(n[e].sleep--,!n[e].sleep&&delete n[e])})),n[t]};function qt(e,t){for(var n=[],r=0,a=e.length;a-2*!t>r;r+=2){var i=[{x:+e[r-2],y:+e[r-1]},{x:+e[r],y:+e[r+1]},{x:+e[r+2],y:+e[r+3]},{x:+e[r+4],y:+e[r+5]}];t?r?a-4==r?i[3]={x:+e[0],y:+e[1]}:a-2==r&&(i[2]={x:+e[0],y:+e[1]},i[3]={x:+e[2],y:+e[3]}):i[0]={x:+e[a-2],y:+e[a-1]}:a-4==r?i[3]=i[2]:r||(i[0]={x:+e[r],y:+e[r+1]}),n.push(["C",(-i[0].x+6*i[1].x+i[2].x)/6,(-i[0].y+6*i[1].y+i[2].y)/6,(i[1].x+6*i[2].x-i[3].x)/6,(i[1].y+6*i[2].y-i[3].y)/6,i[2].x,i[2].y])}return n}var Gt=function(e){if(!e)return null;var t=Ht(e);if(t.arr)return Ut(t.arr);var n={a:7,c:6,h:1,l:2,m:2,r:4,q:4,s:4,t:2,v:1,z:0},r=[];return Tt.is(e,"array")&&Tt.is(e[0],"array")&&(r=Ut(e)),r.length||Rt(e).replace(Bt,(function(e,t,a){var i=[],o=t.toLowerCase();if(a.replace(Wt,(function(e,t){t&&i.push(+t)})),"m"==o&&i.length>2&&(r.push([t][Pt](i.splice(0,2))),o="l",t="m"==t?"l":"L"),"r"==o)r.push([t][Pt](i));else for(;i.length>=n[o]&&(r.push([t][Pt](i.splice(0,n[o]))),n[o]););})),r.toString=Tt._path2string,t.arr=Ut(r),r};var Kt=Jt((function(e){if(Tt.is(e,"array")&&Tt.is(e&&e[0],"array")||(e=Gt(e)),!e||!e.length)return[["M",0,0]];var t=[],n=0,r=0,a=0,i=0,o=0;"M"==e[0][0]&&(a=n=+e[0][1],i=r=+e[0][2],o++,t[0]=["M",n,r]);for(var s,l,c=3==e.length&&"M"==e[0][0]&&"R"==e[1][0].toUpperCase()&&"Z"==e[2][0].toUpperCase(),u=o,h=e.length;u<h;u++){if(t.push(s=[]),(l=e[u])[0]!=Dt.call(l[0]))switch(s[0]=Dt.call(l[0]),s[0]){case"A":s[1]=l[1],s[2]=l[2],s[3]=l[3],s[4]=l[4],s[5]=l[5],s[6]=+(l[6]+n),s[7]=+(l[7]+r);break;case"V":s[1]=+l[1]+r;break;case"H":s[1]=+l[1]+n;break;case"R":for(var p=[n,r][Pt](l.slice(1)),f=2,d=p.length;f<d;f++)p[f]=+p[f]+n,p[++f]=+p[f]+r;t.pop(),t=t[Pt](qt(p,c));break;case"M":a=+l[1]+n,i=+l[2]+r;default:for(f=1,d=l.length;f<d;f++)s[f]=+l[f]+(f%2?n:r)}else if("R"==l[0])p=[n,r][Pt](l.slice(1)),t.pop(),t=t[Pt](qt(p,c)),s=["R"][Pt](l.slice(-2));else for(var m=0,v=l.length;m<v;m++)s[m]=l[m];switch(s[0]){case"Z":n=a,r=i;break;case"H":n=s[1];break;case"V":r=s[1];break;case"M":a=s[s.length-2],i=s[s.length-1];default:n=s[s.length-2],r=s[s.length-1]}}return t.toString=Tt._path2string,t}));function Jt(e,t,n){return function r(){var a=Array.prototype.slice.call(arguments,0),i=a.join("␀"),o=r.cache=r.cache||{},s=r.count=r.count||[];if(o.hasOwnProperty(i)){for(var l=0,c=s.length;l<c;l++)s[l]===i&&s.push(s.splice(l,1)[0]);return n?n(o[i]):o[i]}return s.length>=1e3&&delete o[s.shift()],s.push(i),o[i]=e.apply(t,a),n?n(o[i]):o[i]}}var Qt=function(e,t,n,r){return[e,t,n,r,n,r]},Xt=function(e,t,n,r,a,i){return[1/3*e+2/3*n,1/3*t+2/3*r,1/3*a+2/3*n,1/3*i+2/3*r,a,i]},Zt=Jt((function(e,t,n,r,a,i,o,s,l,c){var u,h=120*Ft/180,p=Ft/180*(+a||0),f=[],d=Jt((function(e,t,n){return{x:e*Math.cos(n)-t*Math.sin(n),y:e*Math.sin(n)+t*Math.cos(n)}}));if(c)w=c[0],C=c[1],x=c[2],E=c[3];else{e=(u=d(e,t,-p)).x,t=u.y,s=(u=d(s,l,-p)).x,l=u.y;Math.cos(Ft/180*a),Math.sin(Ft/180*a);var m=(e-s)/2,v=(t-l)/2,g=m*m/(n*n)+v*v/(r*r);g>1&&(n*=g=Math.sqrt(g),r*=g);var _=n*n,y=r*r,b=(i==o?-1:1)*Math.sqrt(Math.abs((_*y-_*v*v-y*m*m)/(_*v*v+y*m*m))),x=b*n*v/r+(e+s)/2,E=b*-r*m/n+(t+l)/2,w=Math.asin(((t-E)/r).toFixed(9)),C=Math.asin(((l-E)/r).toFixed(9));(w=e<x?Ft-w:w)<0&&(w=2*Ft+w),(C=s<x?Ft-C:C)<0&&(C=2*Ft+C),o&&w>C&&(w-=2*Ft),!o&&C>w&&(C-=2*Ft)}var S=C-w;if(Math.abs(S)>h){var k=C,O=s,M=l;C=w+h*(o&&C>w?1:-1),s=x+n*Math.cos(C),l=E+r*Math.sin(C),f=Zt(s,l,n,r,a,0,o,O,M,[C,k,x,E])}S=C-w;var N=Math.cos(w),T=Math.sin(w),I=Math.cos(C),R=Math.sin(C),A=Math.tan(S/4),L=4/3*n*A,D=4/3*r*A,$=[e,t],P=[e+L*T,t-D*N],V=[s+L*R,l-D*I],j=[s,l];if(P[0]=2*$[0]-P[0],P[1]=2*$[1]-P[1],c)return[P,V,j].concat(f);for(var F=[],z=0,B=(f=[P,V,j].concat(f).join().split(",")).length;z<B;z++)F[z]=z%2?d(f[z-1],f[z],p).y:d(f[z],f[z+1],p).x;return F})),Yt=Jt((function(e,t){var n=!t&&Ht(e);if(!t&&n.curve)return Ut(n.curve);for(var r=Kt(e),a=t&&Kt(t),i={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},o={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},s=function(e,t,n){var r,a;if(!e)return["C",t.x,t.y,t.x,t.y,t.x,t.y];switch(!(e[0]in{T:1,Q:1})&&(t.qx=t.qy=null),e[0]){case"M":t.X=e[1],t.Y=e[2];break;case"A":e=["C"][Pt](Zt.apply(0,[t.x,t.y][Pt](e.slice(1))));break;case"S":"C"==n||"S"==n?(r=2*t.x-t.bx,a=2*t.y-t.by):(r=t.x,a=t.y),e=["C",r,a][Pt](e.slice(1));break;case"T":"Q"==n||"T"==n?(t.qx=2*t.x-t.qx,t.qy=2*t.y-t.qy):(t.qx=t.x,t.qy=t.y),e=["C"][Pt](Xt(t.x,t.y,t.qx,t.qy,e[1],e[2]));break;case"Q":t.qx=e[1],t.qy=e[2],e=["C"][Pt](Xt(t.x,t.y,e[1],e[2],e[3],e[4]));break;case"L":e=["C"][Pt](Qt(t.x,t.y,e[1],e[2]));break;case"H":e=["C"][Pt](Qt(t.x,t.y,e[1],t.y));break;case"V":e=["C"][Pt](Qt(t.x,t.y,t.x,e[1]));break;case"Z":e=["C"][Pt](Qt(t.x,t.y,t.X,t.Y))}return e},l=function(e,t){if(e[t].length>7){e[t].shift();for(var n=e[t];n.length;)u[t]="A",a&&(h[t]="A"),e.splice(t++,0,["C"][Pt](n.splice(0,6)));e.splice(t,1),m=jt(r.length,a&&a.length||0)}},c=function(e,t,n,i,o){e&&t&&"M"==e[o][0]&&"M"!=t[o][0]&&(t.splice(o,0,["M",i.x,i.y]),n.bx=0,n.by=0,n.x=e[o][1],n.y=e[o][2],m=jt(r.length,a&&a.length||0))},u=[],h=[],p="",f="",d=0,m=jt(r.length,a&&a.length||0);d<m;d++){r[d]&&(p=r[d][0]),"C"!=p&&(u[d]=p,d&&(f=u[d-1])),r[d]=s(r[d],i,f),"A"!=u[d]&&"C"==p&&(u[d]="C"),l(r,d),a&&(a[d]&&(p=a[d][0]),"C"!=p&&(h[d]=p,d&&(f=h[d-1])),a[d]=s(a[d],o,f),"A"!=h[d]&&"C"==p&&(h[d]="C"),l(a,d)),c(r,a,i,o,d),c(a,r,o,i,d);var v=r[d],g=a&&a[d],_=v.length,y=a&&g.length;i.x=v[_-2],i.y=v[_-1],i.bx=zt(v[_-4])||i.x,i.by=zt(v[_-3])||i.y,o.bx=a&&(zt(g[y-4])||o.x),o.by=a&&(zt(g[y-3])||o.y),o.x=a&&g[y-2],o.y=a&&g[y-1]}return a||(n.curve=Ut(r)),a?[r,a]:r}),null,Ut);var en=Pe({props:["value"],computed:{optionsArr:function(){return["circle","rect","roundRect","triangle","diamond","pin","arrow","none"]}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},chooseFile:function(){var e=this,t=document.createElement("input");t.type="file",t.accept=".jpg, .jpeg, .png, .svg",t.addEventListener("change",(function(t){var n=t.target.files[0];if(n)if(n.name.endsWith(".svg")){var r=new FileReader;r.addEventListener("load",(function(){var t=function(e){var t=(new DOMParser).parseFromString(e,"text/xml");for(9===t.nodeType&&(t=t.firstChild);"svg"!==t.nodeName.toLowerCase()||1!==t.nodeType;)t=t.nextSibling;return t}(r.result);try{Mt(t)}catch(e){console.error("Unexpected error happens when handling the SVG."),console.error(e.toString())}for(var n=t.querySelectorAll("path"),a=[],i=0;i<n.length;i++)a.push(n[i].getAttribute("d"));e.$emit("change","path://"+a.join(" "))})),r.readAsText(n)}else{var a=new FileReader;a.addEventListener("load",(function(){e.$emit("change","image://"+a.result)})),a.readAsDataURL(n)}})),t.click()}}},Ct,[],!1,null,null,null);en.options.__file="src/controls/ControlIcon.vue";var tn={boolean:Ye,color:Qe,number:rt,vector:st,enum:pt,angle:rt,percent:vt,percentvector:bt,text:wt,icon:en.exports},nn={boolean:function(){return!1},color:function(){return null},number:function(){return 0},angle:function(){return 0},percent:function(){return"50"},enum:function(e){return e.options.split(",")[0].trim()},vector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return 0})).join(",")},percentvector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return"50%"})).join(",")}};var rn={name:"OptionControl",props:["controlConfig","optionPath"],data:function(){return{shared:ke}},computed:{uiComponent:function(){return tn[this.controlConfig.type]},uiAttrs:function(){return function(e){var t={};for(var n in e)e.hasOwnProperty(n)&&"type"!==n&&"default"!==n&&(t[n]=e[n]);return t}(this.controlConfig)},defaultValue:function(){var e=this.controlConfig;return null!=e.default?e.default:nn[e.type]&&nn[e.type](e)}},methods:{onValueChange:function(e){this.shared.cleanMode=this.controlConfig.clean,this.shared.currentExampleOption&&(this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.optionPath,e)))}}},an=(n(39),Pe(rn,qe,[],!1,null,null,null));an.options.__file="src/components/OptionControl.vue";var on={name:"DocContentItemCard",props:["nodeData","descMap","maxDepth","depth"],components:{PropertiesList:He,OptionControl:an.exports},data:function(){return{manualExpanded:null,enableUIControl:!1,shared:ke}},watch:{enableUIControl:function(e){e?(this.shared.showOptionExample||this.$emit("scroll-to-self",this.nodeData.path,300,100),this.shared.showOptionExample=!0):this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.nodeData.path,void 0))},"shared.currentExampleName":function(e,t){e&&t&&(this.enableUIControl=!1)}},computed:{itemId:function(){return fe(this.nodeData.path)},expanded:function(){return!this.isLeaf&&(null!=this.manualExpanded?this.manualExpanded:this.depth<2||ke.currentPath.indexOf(this.nodeData.path)>=0)},isLeaf:function(){return!(this.nodeData.children&&this.nodeData.children.length)},supportsExpandable:function(){return this.depth+1<=this.maxDepth&&!this.isLeaf},desc:function(){var e=this.descMap[this.nodeData.path];return e&&e.desc},uiControl:function(){var e=this.descMap[this.nodeData.path];return e&&e.uiControl},parentPath:function(){for(var e=this.nodeData.path.split("."),t=[],n="",r=0;r<e.length-1;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r],link:n});return t},baseName:function(){return{text:this.nodeData.path.split(".").pop(),link:this.nodeData.path}}},methods:{bubbleEventToggleExapndedEvent:function(){this.$emit("toggle-expanded")},toggleExpanded:function(){this.manualExpanded=!this.expanded,this.$emit("toggle-expanded")},toggleUIControl:function(){this.enableUIControl=!this.enableUIControl},bubbleScrollToSelfEvent:function(e,t,n){this.$emit("scroll-to-self",e,t,n)}}},sn=(n(40),Pe(on,ze,[],!1,null,null,null));sn.options.__file="src/components/DocContentItemCard.vue";var ln=sn.exports,cn=n(24),un=n.n(cn),hn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.shared.computedOptionExampleLayout+"-layout",attrs:{id:"example-panel"}},[n("h2",[e._v(e._s(e.$t("example.title")))]),e._v(" "),n("p",{staticClass:"intro"},[e._v(e._s(e.shared.allOptionExamples?e.$t("example.intro"):e.$t("example.noExample")))]),e._v(" "),e.shared.currentExampleOption?n("div",{staticClass:"preview-and-code"},[n("div",{staticClass:"preview-main"}),e._v(" "),e._m(0),e._v(" "),e.hasError?n("el-alert",{attrs:{title:e.$t("example.setOptionError"),type:"error"}}):e._e()],1):e._e(),e._v(" "),n("div",{staticClass:"toolbar"},[e.shared.allOptionExamples?n("el-select",{staticClass:"example-list",attrs:{size:"mini","popper-append-to-body":!1},model:{value:e.shared.currentExampleName,callback:function(t){e.$set(e.shared,"currentExampleName",t)},expression:"shared.currentExampleName"}},e._l(e.shared.allOptionExamples,(function(t){return n("el-option",{key:t.name,attrs:{value:t.name,label:"en"===e.shared.locale?t["title-en"]:t.title}})})),1):e._e(),e._v(" "),e.shared.currentExampleOption?n("el-button",{attrs:{type:"primary",icon:"el-icon-refresh",size:"mini",title:e.$t("example.refresh")},on:{click:e.refreshForce}}):e._e(),e._v(" "),n("el-button",{directives:[{name:"popover",rawName:"v-popover:changeLayoutPopover",arg:"changeLayoutPopover"}],staticStyle:{"margin-left":"0"},attrs:{type:"primary",icon:"el-icon-s-operation",size:"mini",title:e.$t("example.changeLayout")}}),e._v(" "),n("el-button",{attrs:{size:"mini",circle:"",icon:"el-icon-close"},on:{click:e.closeExamplePanel}})],1),e._v(" "),n("el-popover",{ref:"changeLayoutPopover",attrs:{placement:"bottom",trigger:"click"},model:{value:e.showChangeLayoutPopover,callback:function(t){e.showChangeLayoutPopover=t},expression:"showChangeLayoutPopover"}},[n("div",{staticClass:"example-change-layout"},[n("div",{staticClass:"layout-title"},[n("i",{staticClass:"el-icon-s-operation"}),e._v(e._s(e.$t("example.changeLayout")))]),e._v(" "),n("div",{staticClass:"layout-mode"},[n("el-radio-group",{attrs:{size:"mini"},on:{change:e.changeLayout},model:{value:e.shared.optionExampleLayout,callback:function(t){e.$set(e.shared,"optionExampleLayout",t)},expression:"shared.optionExampleLayout"}},e._l(e.optionExampleLayouts,(function(t){return n("el-radio-button",{key:t,attrs:{label:t}},[e._v(e._s(e.$t("example.layout."+t)))])})),1)],1)])])],1)};hn._withStripped=!0;var pn=n(25),fn=n.n(pn),dn=(n(41),n(42),n(26)),mn=n.n(dn),vn=n(19),gn=n.n(vn);function _n(e,t){return e===t}function yn(e,t,n,r){e.push(function(e,t,n){var r={cmd:e,idx:t};return"="===e&&(r.idx1=n),r}(t,n,r))}var bn=Math.abs;function xn(e,t,n,r,a,i,o,s){var l,c,u,h=n>r,p=a>i,f=bn(r-n),d=bn(i-a);for(c=0;c<=f;c++)for(u=0;u<=d;u++)if(0===c)s[u]=u;else if(0===u)l=s[u],s[u]=c;else{var m=l+(o(e[h?n-c:c-1+n],t[p?a-u:u-1+a])?0:2),v=s[u]+1,g=s[u-1]+1;l=s[u],s[u]=m<v?m:v,g<s[u]&&(s[u]=g)}return s}var En,wn=function(e,t,n){var r,a;n=n||_n;var i=e.length,o=t.length,s=Math.min(i,o),l=[];for(r=0;r<s&&n(e[r],t[r]);r++)yn(l,"=",r,r);for(a=0;a<s&&n(e[i-a-1],t[o-a-1]);a++);if(i-a>=r||o-a>=r){var c=function e(t,n,r,a,i,o,s,l,c){var u,h,p=[],f=a-r,d=o-i;if(f)if(d)if(1===f){var m=t[r],v=!1;for(h=0;h<d;h++)s(m,n[h+i])&&!v?(v=!0,yn(p,"=",r,h+i)):yn(p,"+",h+i);v||yn(p,"-",r)}else if(1===d){var g=n[i];v=!1;for(u=0;u<f;u++)s(g,t[u+r])&&!v?(v=!0,yn(p,"=",u+r,i)):yn(p,"-",u+r);v||yn(p,"+",i)}else{var _=(f/2|0)+r;xn(t,n,r,_,i,o,s,l),xn(t,n,a,_+1,o,i,s,c);var y,b=1/0,x=0;for(h=0;h<=d;h++)(y=l[h]+c[d-h])<b&&(b=y,x=h);p=e(t,n,r,_,i,x+=i,s,l,c);var E=e(t,n,_,a,x,o,s,l,c);for(u=0;u<E.length;u++)p.push(E[u])}else for(u=0;u<f;u++)yn(p,"-",u+r);else for(h=0;h<d;h++)yn(p,"+",h+i);return p}(e,t,r,i-a,r,o-a,n,[],[]);for(r=0;r<c.length;r++)l.push(c[r]);for(r=0;r<a;r++)yn(l,"=",i-a+r,o-a+r)}return l};function Cn(e,t){var n=this;if(this.shared.currentExampleName!==this.lastUpdateExampleName)return this.lastUpdateExampleName=this.shared.currentExampleName,void this.refreshForce();var r=this.$el.querySelector(".preview-main");if(r){if(this.hasError=!1,"undefined"==typeof echarts)(En||(En=new Promise((function(e){var t=document.createElement("script");t.src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js",t.async=!0,t.onload=function(){e(),En=null},document.body.appendChild(t)})))).then((function(){n.echartsInstance||(n.chartInstance=echarts.init(r)),n.shared.cleanMode&&n.chartInstance.clear(),n.chartInstance.setOption(e,!0)}));else{this.echartsInstance||(this.chartInstance=echarts.init(r));try{this.shared.cleanMode&&this.chartInstance.clear(),this.chartInstance.setOption(e,!0)}catch(e){console.error(e),this.hasError=!0}}if(this.cmInstance){var a=this.cmInstance.getValue(),i=this.formattedOptionCodeStr;this.oldHighlightedLines&&this.oldHighlightedLines.forEach((function(e){n.cmInstance.removeLineClass(e,"wrap","option-changed")})),t?(this.cmInstance.setValue(i),this.oldHighlightedLines=[]):this.oldHighlightedLines=function(e,t,n){for(var r=e.split(/\n/),a=t.split(/\n/),i=wn(r,a),o=[],s=i.length,l=s-1;l>=0;l--){var c=i[l];"-"===c.cmd&&n.replaceRange("",{line:c.idx,ch:0},{line:c.idx+1,ch:0})}for(var u=0;u<s;u++){var h=i[u];"+"===h.cmd&&(n.replaceRange(a[h.idx]+"\n",{line:h.idx,ch:0}),o.push(h.idx))}return o.forEach((function(e){n.addLineClass(e,"wrap","option-changed")})),s&&setTimeout((function(){n.scrollIntoView({line:o[0],ch:0},n.getWrapperElement().clientHeight-50)}),20),o}(a,i,this.cmInstance)}else this.cmInstance=fn()(this.$el.querySelector(".codemirror-main"),{value:this.formattedOptionCodeStr,mode:"javascript",theme:"dracula",readOnly:!0});this.lastUpdateExampleName=this.shared.currentExampleName}}var Sn={data:function(){return{shared:ke,hasError:!1,lastUpdateExampleName:"",oldHighlightedLines:[],showChangeLayoutPopover:!1,optionExampleLayouts:xe}},mounted:function(){this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize(),this.shared.currentExampleOption&&this.updateOptionThrottled(this.shared.currentExampleOption),this.shared.allOptionExamples?this.shared.currentExampleName=this.shared.allOptionExamples[0].name:this.shared.currentExampleName=""},destroyed:function(){this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),window.removeEventListener("resize",this.resize)},watch:{"shared.currentExampleOption":function(e){e&&this.updateOptionThrottled(e)},"shared.allOptionExamples":function(e){this.shared.currentExampleName=e?e[0].name:""},"shared.currentExampleName":function(e){this.changeExample(e)}},methods:{updateOption:Cn,updateOptionThrottled:gn()(Cn,300,{leading:!1}),resize:function(){var e=this.$el;e.querySelector(".preview-main");"right"!==this.shared.computedOptionExampleLayout?(e.style.height=.5*window.innerHeight-60+"px",e.style.width="auto"):(e.style.width=.45*e.parentNode.clientWidth+"px",e.style.height="auto"),this.chartInstance&&this.chartInstance.resize()},refreshForce:function(){this.shared.currentExampleOption&&(this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),this.updateOption(this.shared.currentExampleOption,!0))},closeExamplePanel:function(){this.shared.showOptionExample=!1},changeExample:function(e){var t=this.shared.allOptionExamples&&this.shared.allOptionExamples.find((function(t){return t.name===e}));if(!t)return this.shared.currentExampleOption=null,!1;var n=t.code;try{var r=new Function(n+"\n return option");this.shared.currentExampleOption=Object.freeze(r())}catch(e){console.error(e),console.log(n)}},changeLayout:function(e){var t=this;this.showChangeLayoutPopover=!1,Ee(e),this.$nextTick((function(){t.resize()}))}},computed:{optionCodeStr:function(){var e=JSON.stringify(this.shared.currentExampleOption,(function(e,t){return"function"==typeof t?"__functionstart__"+t.toString().replace(/\n/g,"__newline__")+"__functionend__":t}));return"option = ".concat(e)},formattedOptionCodeStr:function(){return mn.a.js(this.optionCodeStr.replace(/"(\w+)"\s*:/g,"$1:").replace(/"__functionstart__/g,"").replace(/__functionend__"/g,"").replace(/__newline__/g,"\n"),{indent_size:2})}}},kn=(n(43),Pe(Sn,hn,[function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"example-code"},[t("div",{staticClass:"codemirror-main"})])}],!1,null,null,null));kn.options.__file="src/components/LiveExample.vue";var On=kn.exports,Mn={components:{DocContentItemCard:ln,LiveExample:On},data:function(){return{loading:!1,pagePath:"",shared:ke,maxDepth:1/0,rootPageDescMap:{},pageOutline:{},pageDescMap:{}}},computed:{pageTitle:function(){return this.pagePath},pageId:function(){return fe(this.pagePath)},pageDesc:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.desc},pageExamples:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.exampleBaseOptions||[]},pageDisplayOutline:function(){return this.shared.isMobile?_e(Oe()):this.pageOutline},showLiveExample:function(){return!this.shared.isMobile&&Me()},needScrollOffset:function(){return this.shared.showOptionExample&&!this.shared.isMobile&&"top"===this.shared.computedOptionExampleLayout}},created:function(){var e=this;ge("").then((function(t){e.rootPageDescMap=Object.freeze(t)})),this._lazyload=new un.a({elements_selector:"iframe",load_delay:300}),this.updateCurrentPath(this.shared.currentPath,!0),this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize()},destroyed:function(){window.removeEventListener("resize",this.resize)},methods:{resize:function(){var e=this;"auto"===this.shared.optionExampleLayout&&Ee("auto"),a.a.nextTick((function(){e.updateDocContentMargin()}))},updateLazyload:function(){var e=this;a.a.nextTick((function(){e._lazyload.update()}))},handleCardExpandToggle:function(){this.updateLazyload()},scrollTo:function(e,t,n){var r=this;setTimeout((function(){var n=ke.isMobile?100:20;r.needScrollOffset&&(n+=r.$refs.liveExample.$el.offsetHeight),Le()(document.getElementById(fe(e)),{time:t||400,align:{top:0,topOffset:n}})}),n||0)},updateCurrentPath:function(e,t){var n=this;if(e)if(_e(e)){var r,a,i=Oe();if(i!==this.pagePath)this.loading=!0,this.pagePath=i,(r=e,a=r.split(".")[0],de().then((function(){return se[a]||de()}))).then((function(r){return r.isRoot?n.maxDepth=0:n.shared.isMobile?n.maxDepth=1:n.maxDepth=1/0,ge(e).then((function(a){n.pageOutline=Object.freeze(Object.assign({},r));var i={},o=e.split(".")[0];for(var s in a)i[o+"."+s]=a[s];n.pageDescMap=Object.freeze(i),n.loading=!1,n.scrollTo(e,600,t?300:50),n.updateLazyload()}))})).catch((function(e){n.pageOutline={},n.loading=!1}));else this.scrollTo(e)}else Re(ye(e));else Re(ye())},openOptionExample:function(){this.shared.showOptionExample=!0},updateDocContentMargin:function(e){if((this.$refs.liveExample||e)&&(this.$refs.docContentDom.style.margin="",!e)){var t=this.shared.computedOptionExampleLayout;if("right"!==t){var n="margin"+t[0].toUpperCase()+t.slice(1),r=this.$refs.liveExample.$el.clientHeight;this.$refs.docContentDom.style[n]=r+"px"}}}},watch:{"shared.currentPath":function(e){var t=this;this.updateCurrentPath(e),a.a.nextTick((function(){t.updateDocContentMargin()}))},pageExamples:function(e){e&&e.length?this.shared.allOptionExamples=Object.freeze(e):this.shared.allOptionExamples=null},"shared.computedOptionExampleLayout":function(){var e=this;a.a.nextTick((function(){e.updateDocContentMargin()}))},"shared.showOptionExample":function(e){var t=this;a.a.nextTick((function(){t.updateDocContentMargin(!e)}))}}},Nn=(n(44),Pe(Mn,Fe,[],!1,null,null,null));Nn.options.__file="src/components/DocContent.vue";var Tn=Nn.exports,In=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search"},[n("el-autocomplete",{staticClass:"search-input",attrs:{"popper-class":"search-input-popper",size:"small","fetch-suggestions":e.searchOptions,debounce:200,placeholder:e.$t("search.placeholder")},on:{select:e.selectPath},nativeOn:{keyup:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.fuzzySearch(t)}},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.item;return[n("div",{staticClass:"doc-path-suggestion-item"},[e._v(e._s(r.path))])]}}]),model:{value:e.queryString,callback:function(t){e.queryString=t},expression:"queryString"}},[e._v(" "),n("el-button",{attrs:{slot:"append",icon:"el-icon-search",type:"primary"},on:{click:e.fuzzySearch},slot:"append"})],1)],1)};In._withStripped=!0;var Rn={data:function(){return{queryString:ke.searchQuery,shared:ke}},computed:{},methods:{searchOptions:function(e,t){e?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:50;return de().then((function(){for(var n=[],r=0;r<he.length;r++){if(n.length>=t)return n;var a=he[r];a.indexOf(e)>=0&&n.push(_e(a))}if(n.length<t){le||(le=new Uint8Array(he.length));for(var i=0,o=0;o<he.length;o++)le[o]=255*Object(ae.stringSimilarity)(he[o],e),le[o]>50&&i++;for(var s={},l=0;n.length<t&&i>0;){for(var c=0,u=void 0,h=0;h<le.length;h++)le[h]>c&&!s[h]&&(u=h,c=le[h]);if(c>50&&(s[u]=!0,n.push(_e(he[u])),i--),++l>200)break}}return n}))}(e,100).then((function(e){t(e)})):t([])},selectPath:function(e){this.shared.currentPath=e.path},fuzzySearch:function(){this.shared.searchQuery=this.queryString,Re("/search/"+this.shared.searchQuery)}}},An=(n(45),Pe(Rn,In,[],!1,null,null,null));An.options.__file="src/components/Search.vue";var Ln=An.exports,Dn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search-result"},[n("h3",[e._v(e._s(e.$t("search.resultTitle")))]),e._v(" "),n("el-input",{attrs:{"prefix-icon":"el-icon-search"},model:{value:e.shared.searchQuery,callback:function(t){e.$set(e.shared,"searchQuery",t)},expression:"shared.searchQuery"}}),e._v(" "),n("div",{staticClass:"result-summary"},[e._v("\n        "+e._s(e.$t("search.foundCountBrief").replace("${searchResultCount}",e.searchResultCount))+",\n        "),e.searchToken?n("span",{staticClass:"searching"},[e._v("\n            搜索中"),n("i",{staticClass:"el-icon-loading"})]):n("span",[e._v("\n            "+e._s(e.$t("search.displayCountBrief").replace("${displayResultCount}",e.displayResultCount))+"\n        ")])]),e._v(" "),e._l(e.searchResult,(function(t){return n("SearchResultItemCard",{key:t.path,attrs:{"item-data":t,"search-query":e.shared.searchQuery}})}))],2)};Dn._withStripped=!0;var $n=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:{"doc-search-result-item-card":!0,"needs-show-more":e.needsShowMoreDesc}},[n("h4",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}]},[n("a",{staticClass:"path",attrs:{href:"#"+e.itemData.path}},[e._v(e._s(e.itemData.path))])]),e._v(" "),e.itemData.similarPaths.length>0?n("div",{staticClass:"other-result"},e._l(e.itemData.similarPaths,(function(t){return n("div",{key:t},[n("a",{attrs:{href:"#"+t}},[e._v(e._s(t))])])})),0):e._e(),e._v(" "),n("div",{staticClass:"item-description"},[n("div",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}],domProps:{innerHTML:e._s(e.itemData.content)}})]),e._v(" "),n("div",{staticClass:"show-more-button"},[n("el-button",{attrs:{icon:"el-icon-more",size:"mini"},on:{click:e.showMore}},[e._v(e._s(e.$t("search.showMore")))])],1)])};$n._withStripped=!0;var Pn={props:["itemData","searchQuery"],data:function(){return{needsShowMoreDesc:!0}},methods:{showMore:function(){this.needsShowMoreDesc=!1}},mounted:function(){var e=this;a.a.nextTick((function(){var t=e.$el.querySelector(".item-description");e.needsShowMoreDesc=t.scrollHeight!==t.clientHeight}))}},Vn=(n(46),Pe(Pn,$n,[],!1,null,null,null));function jn(e){var t=this;console.log("Searching, ",e),this.searchResult=[],this.searchResultCount=0,this.displayResultCount=0,this.static.searchResult.cache={},this.searchToken=Date.now()+"";var n,r,a=this.searchToken;(n=e,r=function(e){if(a===t.searchToken){if(!t.noLimit&&t.displayResultCount<=t.limitedResultCount){for(var n=0;n<e.length;n++){var r=e[n].text,i=t.static.searchResult.cache[r];if(i)i.similarPaths.push(e[n].path);else{var o=Object.freeze({path:e[n].path,content:e[n].content,similarPaths:[]});t.searchResult.push(o),t.static.searchResult.cache[r]=o}}t.displayResultCount+=e.length}t.searchResultCount+=e.length}},de().then((function(){return new Promise((function(e){var t=0;function a(){--t||e()}function i(e){var i=ve(e);i.indexer?r(i.indexer.search(n)):(t++,i.fetcher.then((function(){r(i.indexer.search(n)),a()})).catch((function(e){a()})))}for(var o in i(""),se)i(o);t||e()}))}))).then((function(){t.searchToken=""})).catch((function(){t.searchToken=""}))}Vn.options.__file="src/components/SearchResultItemCard.vue";var Fn={components:{SearchResultItemCard:Vn.exports},data:function(){return{searchResult:[],searchResultCount:0,displayResultCount:0,noLimit:!1,limitedResultCount:200,searchToken:"",static:Object.freeze({searchResult:{cache:null}}),shared:ke}},created:function(){this.updateSearchResultsImmediate(this.shared.searchQuery)},methods:{updateSearchResultsImmediate:jn,updateSearchResults:gn()(jn,500,{leading:!1})},watch:{"shared.searchQuery":function(e){this.updateSearchResults(e),Re("/search/"+this.shared.searchQuery)}}},zn=(n(47),Pe(Fn,Dn,[],!1,null,null,null));zn.options.__file="src/components/SearchResult.vue";var Bn=zn.exports,Wn=function(){var e=this.$createElement;return(this._self._c||e)("div")};Wn._withStripped=!0;var Un=Pe({},Wn,[],!1,null,null,null);Un.options.__file="src/components/Home.vue";var Hn=Un.exports,qn={props:["docType"],data:function(){return{shared:ke}},computed:{pagePath:function(){return Oe()}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,LiveExample:On,Home:Hn}},Gn=(n(48),Pe(qn,Z,[],!1,null,null,null));Gn.options.__file="src/App.vue";var Kn=Gn.exports,Jn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["ec-doc-mobile","ec-doc-"+e.shared.docType]},[n("div",{staticClass:"top-bar"},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("div",{staticClass:"doc-mobile-toolbar"},[n("el-button",{staticClass:"open-nav",attrs:{icon:"el-icon-menu",size:"mini"},on:{click:e.showNav}}),e._v(" "),n("Search")],1)]),e._v(" "),n("el-drawer",{attrs:{direction:"ltr",size:"80%",visible:e.navShown,"show-close":!1},on:{"update:visible":function(t){e.navShown=t}}},[n("DocNav")],1),e._v(" "),n("transition",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1),e._v(" "),e.pagePathParts.length>1?n("div",{staticClass:"doc-breadcrumb"},e._l(e.pagePathParts,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text))])})),0):e._e()],1)};Jn._withStripped=!0;var Qn={props:["docType"],data:function(){return{navShown:!1,shared:ke}},computed:{pagePath:function(){return Oe()},pagePathParts:function(){for(var e=this.pagePath.split("."),t=[],n="",r=0;r<e.length;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r]+(r===e.length-1?"":"."),link:n});return t}},methods:{showNav:function(){this.navShown=!0}},watch:{"shared.currentPath":function(e){this.navShown=!1}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,Home:Hn}},Xn=(n(49),Pe(Qn,Jn,[],!1,null,null,null));Xn.options.__file="src/AppMobile.vue";var Zn=Xn.exports,Yn=n(20),er=n.n(Yn),tr=n(27),nr=n.n(tr),rr=n(28),ar=n.n(rr);n(50);function ir(e){e.querySelectorAll("pre code").forEach((function(e){e.classList.contains("hljs")||er.a.highlightBlock(e)}))}er.a.registerLanguage("javascript",nr.a),er.a.registerLanguage("xml",ar.a),a.a.directive("highlight",{inserted:function(e){ir(e)},update:function(e){ir(e)}});var or=n(29),sr=n.n(or),lr=n(30),cr=n.n(lr);function ur(e,t){function n(){e.__markInstance.mark(t,{diacritics:!0,separateWordSearch:!0})}e.__markInstance?e.__markInstance.unmark({done:function(){n()}}):(e.__markInstance=new sr.a(e),n())}function hr(){window.innerWidth<600?ke.isMobile=!0:ke.isMobile=!1}a.a.directive("mark",{inserted:function(e,t){e.__doMarkDebounced=cr()(ur,500,{trailing:!0,leading:!1}),e.__doMarkDebounced(e,t.value)},update:function(e,t){e.__doMarkDebounced(e,t.value)}});var pr={en:{nav:{option:"Option",API:"API",tutorial:"Tutorial",optionGL:"GL",collapseAll:"Collapse All"},search:{placeholder:"Search document",resultTitle:"Search Result",showMore:"Show more",foundCountBrief:"Found ${searchResultCount} items",displayCountBrief:"${displayResultCount} displayed"},content:{properties:"Properties"},example:{title:"Preview",titleShort:"Preview",intro:"Try different values of the option and preview!",noExample:"No example available for current component.",tryDesc:"Try It",defaultColor:"Default Color",booleanDesc:"Enable",vectorSetSeparate:"SEPARATE",absoluteMode:"ABSOLUTE",percentMode:"PERCENT",inputPlaceholder:"Input to change the text content",builtin:"Builtin",upload:"Upload SVG or PNG",setOptionError:"Something Unexpected Happerns. Click refresh to try again!",refresh:"Refresh",close:"Close",changeLayout:"Change Layout",layout:{auto:"Auto",right:"Right",top:"Top",bottom:"Bottom"}}},zh:{nav:{option:"配置项",API:"API",tutorial:"教程",optionGL:"GL配置",collapseAll:"收起所有"},search:{placeholder:"搜索文档,回车查看更多结果",resultTitle:"文档搜索结果",showMore:"显示更多",foundCountBrief:"找到 ${searchResultCount} 条配置项",displayCountBrief:"显示 ${displayResultCount} 条"},content:{properties:"所有属性"},example:{title:"配置项效果预览",titleShort:"预览",intro:"调节控件可预览配置项不同取值的效果",noExample:"当前组件暂无可用示例",tryDesc:"试一试",defaultColor:"默认颜色",booleanDesc:"开启",vectorSetSeparate:"分别设置",absoluteMode:"绝对值",percentMode:"百分比",inputPlaceholder:"输入改变文本",builtin:"内置",upload:"上传 SVG 或 PNG",setOptionError:"发生了一些意料之外的错误,点击刷新再试试!",refresh:"刷新",close:"关闭",changeLayout:"切换布局",layout:{auto:"自动",right:"右侧",top:"顶部",bottom:"底部"}}}};function fr(e,t){window.addEventListener("resize",hr),hr();var n=t.cdnRoot||t.baseUrl;me(t.baseUrl,n,t.docType,t.version).then((function(){if(window.addEventListener("hashchange",(function(e){Ie()})),Ie(),ke.docType=t.docType,ke.locale=t.locale,"string"==typeof e&&(e=document.querySelector(e)),!e)throw new Error("Can't find el.");var n=document.createElement("div");e.appendChild(n);var r=new X({locale:t.locale,fallbackLocale:"en",messages:pr});new a.a({i18n:r,el:n,render:function(e){return console.log("iMobile: ",ke.isMobile),ke.isMobile?e(Zn):e(Kn)}})}))}}])}));
\ No newline at end of file
+e.exports=function(){"use strict";var e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},t=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},n=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),r=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},a=function(){function e(n){var r=!(arguments.length>1&&void 0!==arguments[1])||arguments[1],a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[],i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:5e3;t(this,e),this.ctx=n,this.iframes=r,this.exclude=a,this.iframesTimeout=i}return n(e,[{key:"getContexts",value:function(){var e=[];return(void 0!==this.ctx&&this.ctx?NodeList.prototype.isPrototypeOf(this.ctx)?Array.prototype.slice.call(this.ctx):Array.isArray(this.ctx)?this.ctx:"string"==typeof this.ctx?Array.prototype.slice.call(document.querySelectorAll(this.ctx)):[this.ctx]:[]).forEach((function(t){var n=e.filter((function(e){return e.contains(t)})).length>0;-1!==e.indexOf(t)||n||e.push(t)})),e}},{key:"getIframeContents",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},r=void 0;try{var a=e.contentWindow;if(r=a.document,!a||!r)throw new Error("iframe inaccessible")}catch(e){n()}r&&t(r)}},{key:"isIframeBlank",value:function(e){var t="about:blank",n=e.getAttribute("src").trim();return e.contentWindow.location.href===t&&n!==t&&n}},{key:"observeIframeLoad",value:function(e,t,n){var r=this,a=!1,i=null,o=function o(){if(!a){a=!0,clearTimeout(i);try{r.isIframeBlank(e)||(e.removeEventListener("load",o),r.getIframeContents(e,t,n))}catch(e){n()}}};e.addEventListener("load",o),i=setTimeout(o,this.iframesTimeout)}},{key:"onIframeReady",value:function(e,t,n){try{"complete"===e.contentWindow.document.readyState?this.isIframeBlank(e)?this.observeIframeLoad(e,t,n):this.getIframeContents(e,t,n):this.observeIframeLoad(e,t,n)}catch(e){n()}}},{key:"waitForIframes",value:function(e,t){var n=this,r=0;this.forEachIframe(e,(function(){return!0}),(function(e){r++,n.waitForIframes(e.querySelector("html"),(function(){--r||t()}))}),(function(e){e||t()}))}},{key:"forEachIframe",value:function(t,n,r){var a=this,i=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},o=t.querySelectorAll("iframe"),s=o.length,l=0;o=Array.prototype.slice.call(o);var c=function(){--s<=0&&i(l)};s||c(),o.forEach((function(t){e.matches(t,a.exclude)?c():a.onIframeReady(t,(function(e){n(t)&&(l++,r(e)),c()}),c)}))}},{key:"createIterator",value:function(e,t,n){return document.createNodeIterator(e,t,n,!1)}},{key:"createInstanceOnIframe",value:function(t){return new e(t.querySelector("html"),this.iframes)}},{key:"compareNodeIframe",value:function(e,t,n){if(e.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_PRECEDING){if(null===t)return!0;if(t.compareDocumentPosition(n)&Node.DOCUMENT_POSITION_FOLLOWING)return!0}return!1}},{key:"getIteratorNode",value:function(e){var t=e.previousNode();return{prevNode:t,node:(null===t||e.nextNode())&&e.nextNode()}}},{key:"checkIframeFilter",value:function(e,t,n,r){var a=!1,i=!1;return r.forEach((function(e,t){e.val===n&&(a=t,i=e.handled)})),this.compareNodeIframe(e,t,n)?(!1!==a||i?!1===a||i||(r[a].handled=!0):r.push({val:n,handled:!0}),!0):(!1===a&&r.push({val:n,handled:!1}),!1)}},{key:"handleOpenIframes",value:function(e,t,n,r){var a=this;e.forEach((function(e){e.handled||a.getIframeContents(e.val,(function(e){a.createInstanceOnIframe(e).forEachNode(t,n,r)}))}))}},{key:"iterateThroughNodes",value:function(e,t,n,r,a){for(var i,o=this,s=this.createIterator(t,e,r),l=[],c=[],u=void 0,h=void 0;i=void 0,i=o.getIteratorNode(s),h=i.prevNode,u=i.node;)this.iframes&&this.forEachIframe(t,(function(e){return o.checkIframeFilter(u,h,e,l)}),(function(t){o.createInstanceOnIframe(t).forEachNode(e,(function(e){return c.push(e)}),r)})),c.push(u);c.forEach((function(e){n(e)})),this.iframes&&this.handleOpenIframes(l,e,n,r),a()}},{key:"forEachNode",value:function(e,t,n){var r=this,a=arguments.length>3&&void 0!==arguments[3]?arguments[3]:function(){},i=this.getContexts(),o=i.length;o||a(),i.forEach((function(i){var s=function(){r.iterateThroughNodes(e,i,t,n,(function(){--o<=0&&a()}))};r.iframes?r.waitForIframes(i,s):s()}))}}],[{key:"matches",value:function(e,t){var n="string"==typeof t?[t]:t,r=e.matches||e.matchesSelector||e.msMatchesSelector||e.mozMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector;if(r){var a=!1;return n.every((function(t){return!r.call(e,t)||(a=!0,!1)})),a}return!1}}]),e}(),i=function(){function i(e){t(this,i),this.ctx=e,this.ie=!1;var n=window.navigator.userAgent;(n.indexOf("MSIE")>-1||n.indexOf("Trident")>-1)&&(this.ie=!0)}return n(i,[{key:"log",value:function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"debug",r=this.opt.log;this.opt.debug&&"object"===(void 0===r?"undefined":e(r))&&"function"==typeof r[n]&&r[n]("mark.js: "+t)}},{key:"escapeStr",value:function(e){return e.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g,"\\$&")}},{key:"createRegExp",value:function(e){return"disabled"!==this.opt.wildcards&&(e=this.setupWildcardsRegExp(e)),e=this.escapeStr(e),Object.keys(this.opt.synonyms).length&&(e=this.createSynonymsRegExp(e)),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),this.opt.diacritics&&(e=this.createDiacriticsRegExp(e)),e=this.createMergedBlanksRegExp(e),(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.createJoinersRegExp(e)),"disabled"!==this.opt.wildcards&&(e=this.createWildcardsRegExp(e)),e=this.createAccuracyRegExp(e)}},{key:"createSynonymsRegExp",value:function(e){var t=this.opt.synonyms,n=this.opt.caseSensitive?"":"i",r=this.opt.ignoreJoiners||this.opt.ignorePunctuation.length?"\0":"";for(var a in t)if(t.hasOwnProperty(a)){var i=t[a],o="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(a):this.escapeStr(a),s="disabled"!==this.opt.wildcards?this.setupWildcardsRegExp(i):this.escapeStr(i);""!==o&&""!==s&&(e=e.replace(new RegExp("("+this.escapeStr(o)+"|"+this.escapeStr(s)+")","gm"+n),r+"("+this.processSynomyms(o)+"|"+this.processSynomyms(s)+")"+r))}return e}},{key:"processSynomyms",value:function(e){return(this.opt.ignoreJoiners||this.opt.ignorePunctuation.length)&&(e=this.setupIgnoreJoinersRegExp(e)),e}},{key:"setupWildcardsRegExp",value:function(e){return(e=e.replace(/(?:\\)*\?/g,(function(e){return"\\"===e.charAt(0)?"?":""}))).replace(/(?:\\)*\*/g,(function(e){return"\\"===e.charAt(0)?"*":""}))}},{key:"createWildcardsRegExp",value:function(e){var t="withSpaces"===this.opt.wildcards;return e.replace(/\u0001/g,t?"[\\S\\s]?":"\\S?").replace(/\u0002/g,t?"[\\S\\s]*?":"\\S*")}},{key:"setupIgnoreJoinersRegExp",value:function(e){return e.replace(/[^(|)\\]/g,(function(e,t,n){var r=n.charAt(t+1);return/[(|)\\]/.test(r)||""===r?e:e+"\0"}))}},{key:"createJoinersRegExp",value:function(e){var t=[],n=this.opt.ignorePunctuation;return Array.isArray(n)&&n.length&&t.push(this.escapeStr(n.join(""))),this.opt.ignoreJoiners&&t.push("\\u00ad\\u200b\\u200c\\u200d"),t.length?e.split(/\u0000+/).join("["+t.join("")+"]*"):e}},{key:"createDiacriticsRegExp",value:function(e){var t=this.opt.caseSensitive?"":"i",n=this.opt.caseSensitive?["aàáảãạăằắẳẵặâầấẩẫậäåāą","AÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćč","CÇĆČ","dđď","DĐĎ","eèéẻẽẹêềếểễệëěēę","EÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïī","IÌÍỈĨỊÎÏĪ","lł","LŁ","nñňń","NÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøō","OÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rř","RŘ","sšśșş","SŠŚȘŞ","tťțţ","TŤȚŢ","uùúủũụưừứửữựûüůū","UÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿ","YÝỲỶỸỴŸ","zžżź","ZŽŻŹ"]:["aàáảãạăằắẳẵặâầấẩẫậäåāąAÀÁẢÃẠĂẰẮẲẴẶÂẦẤẨẪẬÄÅĀĄ","cçćčCÇĆČ","dđďDĐĎ","eèéẻẽẹêềếểễệëěēęEÈÉẺẼẸÊỀẾỂỄỆËĚĒĘ","iìíỉĩịîïīIÌÍỈĨỊÎÏĪ","lłLŁ","nñňńNÑŇŃ","oòóỏõọôồốổỗộơởỡớờợöøōOÒÓỎÕỌÔỒỐỔỖỘƠỞỠỚỜỢÖØŌ","rřRŘ","sšśșşSŠŚȘŞ","tťțţTŤȚŢ","uùúủũụưừứửữựûüůūUÙÚỦŨỤƯỪỨỬỮỰÛÜŮŪ","yýỳỷỹỵÿYÝỲỶỸỴŸ","zžżźZŽŻŹ"],r=[];return e.split("").forEach((function(a){n.every((function(n){if(-1!==n.indexOf(a)){if(r.indexOf(n)>-1)return!1;e=e.replace(new RegExp("["+n+"]","gm"+t),"["+n+"]"),r.push(n)}return!0}))})),e}},{key:"createMergedBlanksRegExp",value:function(e){return e.replace(/[\s]+/gim,"[\\s]+")}},{key:"createAccuracyRegExp",value:function(e){var t=this,n=this.opt.accuracy,r="string"==typeof n?n:n.value,a="string"==typeof n?[]:n.limiters,i="";switch(a.forEach((function(e){i+="|"+t.escapeStr(e)})),r){case"partially":default:return"()("+e+")";case"complementary":return"()([^"+(i="\\s"+(i||this.escapeStr("!\"#$%&'()*+,-./:;<=>?@[\\]^_`{|}~¡¿")))+"]*"+e+"[^"+i+"]*)";case"exactly":return"(^|\\s"+i+")("+e+")(?=$|\\s"+i+")"}}},{key:"getSeparatedKeywords",value:function(e){var t=this,n=[];return e.forEach((function(e){t.opt.separateWordSearch?e.split(" ").forEach((function(e){e.trim()&&-1===n.indexOf(e)&&n.push(e)})):e.trim()&&-1===n.indexOf(e)&&n.push(e)})),{keywords:n.sort((function(e,t){return t.length-e.length})),length:n.length}}},{key:"isNumeric",value:function(e){return Number(parseFloat(e))==e}},{key:"checkRanges",value:function(e){var t=this;if(!Array.isArray(e)||"[object Object]"!==Object.prototype.toString.call(e[0]))return this.log("markRanges() will only accept an array of objects"),this.opt.noMatch(e),[];var n=[],r=0;return e.sort((function(e,t){return e.start-t.start})).forEach((function(e){var a=t.callNoMatchOnInvalidRanges(e,r),i=a.start,o=a.end;a.valid&&(e.start=i,e.length=o-i,n.push(e),r=o)})),n}},{key:"callNoMatchOnInvalidRanges",value:function(e,t){var n=void 0,r=void 0,a=!1;return e&&void 0!==e.start?(r=(n=parseInt(e.start,10))+parseInt(e.length,10),this.isNumeric(e.start)&&this.isNumeric(e.length)&&r-t>0&&r-n>0?a=!0:(this.log("Ignoring invalid or overlapping range: "+JSON.stringify(e)),this.opt.noMatch(e))):(this.log("Ignoring invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:n,end:r,valid:a}}},{key:"checkWhitespaceRanges",value:function(e,t,n){var r=void 0,a=!0,i=n.length,o=t-i,s=parseInt(e.start,10)-o;return(r=(s=s>i?i:s)+parseInt(e.length,10))>i&&(r=i,this.log("End range automatically set to the max value of "+i)),s<0||r-s<0||s>i||r>i?(a=!1,this.log("Invalid range: "+JSON.stringify(e)),this.opt.noMatch(e)):""===n.substring(s,r).replace(/\s+/g,"")&&(a=!1,this.log("Skipping whitespace only range: "+JSON.stringify(e)),this.opt.noMatch(e)),{start:s,end:r,valid:a}}},{key:"getTextNodes",value:function(e){var t=this,n="",r=[];this.iterator.forEachNode(NodeFilter.SHOW_TEXT,(function(e){r.push({start:n.length,end:(n+=e.textContent).length,node:e})}),(function(e){return t.matchesExclude(e.parentNode)?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),(function(){e({value:n,nodes:r})}))}},{key:"matchesExclude",value:function(e){return a.matches(e,this.opt.exclude.concat(["script","style","title","head","html"]))}},{key:"wrapRangeInTextNode",value:function(e,t,n){var r=this.opt.element?this.opt.element:"mark",a=e.splitText(t),i=a.splitText(n-t),o=document.createElement(r);return o.setAttribute("data-markjs","true"),this.opt.className&&o.setAttribute("class",this.opt.className),o.textContent=a.textContent,a.parentNode.replaceChild(o,a),i}},{key:"wrapRangeInMappedTextNode",value:function(e,t,n,r,a){var i=this;e.nodes.every((function(o,s){var l=e.nodes[s+1];if(void 0===l||l.start>t){if(!r(o.node))return!1;var c=t-o.start,u=(n>o.end?o.end:n)-o.start,h=e.value.substr(0,o.start),p=e.value.substr(u+o.start);if(o.node=i.wrapRangeInTextNode(o.node,c,u),e.value=h+p,e.nodes.forEach((function(t,n){n>=s&&(e.nodes[n].start>0&&n!==s&&(e.nodes[n].start-=u),e.nodes[n].end-=u)})),n-=u,a(o.node.previousSibling,o.start),!(n>o.end))return!1;t=o.end}return!0}))}},{key:"wrapMatches",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){t.nodes.forEach((function(t){t=t.node;for(var a=void 0;null!==(a=e.exec(t.textContent))&&""!==a[o];)if(n(a[o],t)){var s=a.index;if(0!==o)for(var l=1;l<o;l++)s+=a[l].length;t=i.wrapRangeInTextNode(t,s,s+a[o].length),r(t.previousSibling),e.lastIndex=0}})),a()}))}},{key:"wrapMatchesAcrossElements",value:function(e,t,n,r,a){var i=this,o=0===t?0:t+1;this.getTextNodes((function(t){for(var s=void 0;null!==(s=e.exec(t.value))&&""!==s[o];){var l=s.index;if(0!==o)for(var c=1;c<o;c++)l+=s[c].length;var u=l+s[o].length;i.wrapRangeInMappedTextNode(t,l,u,(function(e){return n(s[o],e)}),(function(t,n){e.lastIndex=n,r(t)}))}a()}))}},{key:"wrapRangeFromIndex",value:function(e,t,n,r){var a=this;this.getTextNodes((function(i){var o=i.value.length;e.forEach((function(e,r){var s=a.checkWhitespaceRanges(e,o,i.value),l=s.start,c=s.end;s.valid&&a.wrapRangeInMappedTextNode(i,l,c,(function(n){return t(n,e,i.value.substring(l,c),r)}),(function(t){n(t,e)}))})),r()}))}},{key:"unwrapMatches",value:function(e){for(var t=e.parentNode,n=document.createDocumentFragment();e.firstChild;)n.appendChild(e.removeChild(e.firstChild));t.replaceChild(n,e),this.ie?this.normalizeTextNode(t):t.normalize()}},{key:"normalizeTextNode",value:function(e){if(e){if(3===e.nodeType)for(;e.nextSibling&&3===e.nextSibling.nodeType;)e.nodeValue+=e.nextSibling.nodeValue,e.parentNode.removeChild(e.nextSibling);else this.normalizeTextNode(e.firstChild);this.normalizeTextNode(e.nextSibling)}}},{key:"markRegExp",value:function(e,t){var n=this;this.opt=t,this.log('Searching with expression "'+e+'"');var r=0,a="wrapMatches";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),this[a](e,this.opt.ignoreGroups,(function(e,t){return n.opt.filter(t,e,r)}),(function(e){r++,n.opt.each(e)}),(function(){0===r&&n.opt.noMatch(e),n.opt.done(r)}))}},{key:"mark",value:function(e,t){var n=this;this.opt=t;var r=0,a="wrapMatches",i=this.getSeparatedKeywords("string"==typeof e?[e]:e),o=i.keywords,s=i.length,l=this.opt.caseSensitive?"":"i";this.opt.acrossElements&&(a="wrapMatchesAcrossElements"),0===s?this.opt.done(r):function e(t){var i=new RegExp(n.createRegExp(t),"gm"+l),c=0;n.log('Searching with expression "'+i+'"'),n[a](i,1,(function(e,a){return n.opt.filter(a,t,r,c)}),(function(e){c++,r++,n.opt.each(e)}),(function(){0===c&&n.opt.noMatch(t),o[s-1]===t?n.opt.done(r):e(o[o.indexOf(t)+1])}))}(o[0])}},{key:"markRanges",value:function(e,t){var n=this;this.opt=t;var r=0,a=this.checkRanges(e);a&&a.length?(this.log("Starting to mark with the following ranges: "+JSON.stringify(a)),this.wrapRangeFromIndex(a,(function(e,t,r,a){return n.opt.filter(e,t,r,a)}),(function(e,t){r++,n.opt.each(e,t)}),(function(){n.opt.done(r)}))):this.opt.done(r)}},{key:"unmark",value:function(e){var t=this;this.opt=e;var n=this.opt.element?this.opt.element:"*";n+="[data-markjs]",this.opt.className&&(n+="."+this.opt.className),this.log('Removal selector "'+n+'"'),this.iterator.forEachNode(NodeFilter.SHOW_ELEMENT,(function(e){t.unwrapMatches(e)}),(function(e){var r=a.matches(e,n),i=t.matchesExclude(e);return!r||i?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}),this.opt.done)}},{key:"opt",set:function(e){this._opt=r({},{element:"",className:"",exclude:[],iframes:!1,iframesTimeout:5e3,separateWordSearch:!0,diacritics:!0,synonyms:{},accuracy:"partially",acrossElements:!1,caseSensitive:!1,ignoreJoiners:!1,ignoreGroups:0,ignorePunctuation:[],wildcards:"disabled",each:function(){},noMatch:function(){},filter:function(){return!0},done:function(){},debug:!1,log:window.console},e)},get:function(){return this._opt}},{key:"iterator",get:function(){return new a(this.ctx,this.opt.iframes,this.opt.exclude,this.opt.iframesTimeout)}}]),i}();return function(e){var t=this,n=new i(e);return this.mark=function(e,r){return n.mark(e,r),t},this.markRegExp=function(e,r){return n.markRegExp(e,r),t},this.markRanges=function(e,r){return n.markRanges(e,r),t},this.unmark=function(e){return n.unmark(e),t},this}}()},function(e,t,n){(function(t){var n=/^\s+|\s+$/g,r=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,i=/^0o[0-7]+$/i,o=parseInt,s="object"==typeof t&&t&&t.Object===Object&&t,l="object"==typeof self&&self&&self.Object===Object&&self,c=s||l||Function("return this")(),u=Object.prototype.toString,h=Math.max,p=Math.min,f=function(){return c.Date.now()};function d(e){var t=typeof e;return!!e&&("object"==t||"function"==t)}function m(e){if("number"==typeof e)return e;if(function(e){return"symbol"==typeof e||function(e){return!!e&&"object"==typeof e}(e)&&"[object Symbol]"==u.call(e)}(e))return NaN;if(d(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=d(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=e.replace(n,"");var s=a.test(e);return s||i.test(e)?o(e.slice(2),s?2:8):r.test(e)?NaN:+e}e.exports=function(e,t,n){var r,a,i,o,s,l,c=0,u=!1,v=!1,g=!0;if("function"!=typeof e)throw new TypeError("Expected a function");function _(t){var n=r,i=a;return r=a=void 0,c=t,o=e.apply(i,n)}function y(e){return c=e,s=setTimeout(x,t),u?_(e):o}function b(e){var n=e-l;return void 0===l||n>=t||n<0||v&&e-c>=i}function x(){var e=f();if(b(e))return E(e);s=setTimeout(x,function(e){var n=t-(e-l);return v?p(n,i-(e-c)):n}(e))}function E(e){return s=void 0,g&&r?_(e):(r=a=void 0,o)}function w(){var e=f(),n=b(e);if(r=arguments,a=this,l=e,n){if(void 0===s)return y(l);if(v)return s=setTimeout(x,t),_(l)}return void 0===s&&(s=setTimeout(x,t)),o}return t=m(t)||0,d(n)&&(u=!!n.leading,i=(v="maxWait"in n)?h(m(n.maxWait)||0,t):i,g="trailing"in n?!!n.trailing:g),w.cancel=function(){void 0!==s&&clearTimeout(s),c=0,r=l=a=s=void 0},w.flush=function(){return void 0===s?o:E(f())},w}}).call(this,n(22))},function(e,t,n){"use strict";var r=n(2);n.n(r).a},function(e,t,n){"use strict";var r=n(3);n.n(r).a},function(e,t,n){"use strict";var r=n(4);n.n(r).a},function(e,t,n){"use strict";var r=n(5);n.n(r).a},function(e,t,n){"use strict";var r=n(6);n.n(r).a},function(e,t,n){"use strict";var r=n(7);n.n(r).a},function(e,t,n){"use strict";var r=n(8);n.n(r).a},function(e,t,n){"use strict";var r=n(9);n.n(r).a},function(e,t,n){"use strict";var r=n(10);n.n(r).a},function(e,t,n){"use strict";var r=n(11);n.n(r).a},function(e,t,n){},function(e,t,n){},function(e,t,n){"use strict";var r=n(12);n.n(r).a},function(e,t,n){"use strict";var r=n(13);n.n(r).a},function(e,t,n){"use strict";var r=n(14);n.n(r).a},function(e,t,n){"use strict";var r=n(15);n.n(r).a},function(e,t,n){"use strict";var r=n(16);n.n(r).a},function(e,t,n){"use strict";var r=n(17);n.n(r).a},function(e,t,n){"use strict";var r=n(18);n.n(r).a},function(e,t,n){},function(e,t,n){"use strict";n.r(t),n.d(t,"init",(function(){return fr}));var r=n(0),a=n.n(r),i=["style","currency","currencyDisplay","useGrouping","minimumIntegerDigits","minimumFractionDigits","maximumFractionDigits","minimumSignificantDigits","maximumSignificantDigits","localeMatcher","formatMatcher","unit"];function o(e,t){"undefined"!=typeof console&&(console.warn("[vue-i18n] "+e),t&&console.warn(t.stack))}var s=Array.isArray;function l(e){return null!==e&&"object"==typeof e}function c(e){return"string"==typeof e}var u=Object.prototype.toString;function h(e){return"[object Object]"===u.call(e)}function p(e){return null==e}function f(){for(var e=[],t=arguments.length;t--;)e[t]=arguments[t];var n=null,r=null;return 1===e.length?l(e[0])||Array.isArray(e[0])?r=e[0]:"string"==typeof e[0]&&(n=e[0]):2===e.length&&("string"==typeof e[0]&&(n=e[0]),(l(e[1])||Array.isArray(e[1]))&&(r=e[1])),{locale:n,params:r}}function d(e){return JSON.parse(JSON.stringify(e))}function m(e,t){return!!~e.indexOf(t)}var v=Object.prototype.hasOwnProperty;function g(e,t){return v.call(e,t)}function _(e){for(var t=arguments,n=Object(e),r=1;r<arguments.length;r++){var a=t[r];if(null!=a){var i=void 0;for(i in a)g(a,i)&&(l(a[i])?n[i]=_(n[i],a[i]):n[i]=a[i])}}return n}function y(e,t){if(e===t)return!0;var n=l(e),r=l(t);if(!n||!r)return!n&&!r&&String(e)===String(t);try{var a=Array.isArray(e),i=Array.isArray(t);if(a&&i)return e.length===t.length&&e.every((function(e,n){return y(e,t[n])}));if(a||i)return!1;var o=Object.keys(e),s=Object.keys(t);return o.length===s.length&&o.every((function(n){return y(e[n],t[n])}))}catch(e){return!1}}var b={beforeCreate:function(){var e=this.$options;if(e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n)if(e.i18n instanceof J){if(e.__i18n)try{var t={};e.__i18n.forEach((function(e){t=_(t,JSON.parse(e))})),Object.keys(t).forEach((function(n){e.i18n.mergeLocaleMessage(n,t[n])}))}catch(e){0}this._i18n=e.i18n,this._i18nWatcher=this._i18n.watchI18nData()}else if(h(e.i18n)){var n=this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this.$root.$i18n:null;if(n&&(e.i18n.root=this.$root,e.i18n.formatter=n.formatter,e.i18n.fallbackLocale=n.fallbackLocale,e.i18n.formatFallbackMessages=n.formatFallbackMessages,e.i18n.silentTranslationWarn=n.silentTranslationWarn,e.i18n.silentFallbackWarn=n.silentFallbackWarn,e.i18n.pluralizationRules=n.pluralizationRules,e.i18n.preserveDirectiveContent=n.preserveDirectiveContent),e.__i18n)try{var r={};e.__i18n.forEach((function(e){r=_(r,JSON.parse(e))})),e.i18n.messages=r}catch(e){0}var a=e.i18n.sharedMessages;a&&h(a)&&(e.i18n.messages=_(e.i18n.messages,a)),this._i18n=new J(e.i18n),this._i18nWatcher=this._i18n.watchI18nData(),(void 0===e.i18n.sync||e.i18n.sync)&&(this._localeWatcher=this.$i18n.watchLocale()),n&&n.onComponentInstanceCreated(this._i18n)}else 0;else this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J?this._i18n=this.$root.$i18n:e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J&&(this._i18n=e.parent.$i18n)},beforeMount:function(){var e=this.$options;e.i18n=e.i18n||(e.__i18n?{}:null),e.i18n?(e.i18n instanceof J||h(e.i18n))&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0):(this.$root&&this.$root.$i18n&&this.$root.$i18n instanceof J||e.parent&&e.parent.$i18n&&e.parent.$i18n instanceof J)&&(this._i18n.subscribeDataChanging(this),this._subscribing=!0)},beforeDestroy:function(){if(this._i18n){var e=this;this.$nextTick((function(){e._subscribing&&(e._i18n.unsubscribeDataChanging(e),delete e._subscribing),e._i18nWatcher&&(e._i18nWatcher(),e._i18n.destroyVM(),delete e._i18nWatcher),e._localeWatcher&&(e._localeWatcher(),delete e._localeWatcher)}))}}},x={name:"i18n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},path:{type:String,required:!0},locale:{type:String},places:{type:[Array,Object]}},render:function(e,t){var n=t.data,r=t.parent,a=t.props,i=t.slots,o=r.$i18n;if(o){var s=a.path,l=a.locale,c=a.places,u=i(),h=o.i(s,l,function(e){var t;for(t in e)if("default"!==t)return!1;return Boolean(t)}(u)||c?function(e,t){var n=t?function(e){0;return Array.isArray(e)?e.reduce(w,{}):Object.assign({},e)}(t):{};if(!e)return n;var r=(e=e.filter((function(e){return e.tag||""!==e.text.trim()}))).every(C);0;return e.reduce(r?E:w,n)}(u.default,c):u),p=a.tag&&!0!==a.tag||!1===a.tag?a.tag:"span";return p?e(p,n,h):h}}};function E(e,t){return t.data&&t.data.attrs&&t.data.attrs.place&&(e[t.data.attrs.place]=t),e}function w(e,t,n){return e[n]=t,e}function C(e){return Boolean(e.data&&e.data.attrs&&e.data.attrs.place)}var S,k={name:"i18n-n",functional:!0,props:{tag:{type:[String,Boolean],default:"span"},value:{type:Number,required:!0},format:{type:[String,Object]},locale:{type:String}},render:function(e,t){var n=t.props,r=t.parent,a=t.data,o=r.$i18n;if(!o)return null;var s=null,u=null;c(n.format)?s=n.format:l(n.format)&&(n.format.key&&(s=n.format.key),u=Object.keys(n.format).reduce((function(e,t){var r;return m(i,t)?Object.assign({},e,((r={})[t]=n.format[t],r)):e}),null));var h=n.locale||o.locale,p=o._ntp(n.value,h,s,u),f=p.map((function(e,t){var n,r=a.scopedSlots&&a.scopedSlots[e.type];return r?r(((n={})[e.type]=e.value,n.index=t,n.parts=p,n)):e.value})),d=n.tag&&!0!==n.tag||!1===n.tag?n.tag:"span";return d?e(d,{attrs:a.attrs,class:a.class,staticClass:a.staticClass},f):f}};function O(e,t,n){T(e,n)&&I(e,t,n)}function M(e,t,n,r){if(T(e,n)){var a=n.context.$i18n;(function(e,t){var n=t.context;return e._locale===n.$i18n.locale})(e,n)&&y(t.value,t.oldValue)&&y(e._localeMessage,a.getLocaleMessage(a.locale))||I(e,t,n)}}function N(e,t,n,r){if(n.context){var a=n.context.$i18n||{};t.modifiers.preserve||a.preserveDirectiveContent||(e.textContent=""),e._vt=void 0,delete e._vt,e._locale=void 0,delete e._locale,e._localeMessage=void 0,delete e._localeMessage}else o("Vue instance does not exists in VNode context")}function T(e,t){var n=t.context;return n?!!n.$i18n||(o("VueI18n instance does not exists in Vue instance"),!1):(o("Vue instance does not exists in VNode context"),!1)}function I(e,t,n){var r,a,i=function(e){var t,n,r,a;c(e)?t=e:h(e)&&(t=e.path,n=e.locale,r=e.args,a=e.choice);return{path:t,locale:n,args:r,choice:a}}(t.value),s=i.path,l=i.locale,u=i.args,p=i.choice;if(s||l||u)if(s){var f=n.context;e._vt=e.textContent=null!=p?(r=f.$i18n).tc.apply(r,[s,p].concat(R(l,u))):(a=f.$i18n).t.apply(a,[s].concat(R(l,u))),e._locale=f.$i18n.locale,e._localeMessage=f.$i18n.getLocaleMessage(f.$i18n.locale)}else o("`path` is required in v-t directive");else o("value type not supported")}function R(e,t){var n=[];return e&&n.push(e),t&&(Array.isArray(t)||h(t))&&n.push(t),n}function A(e){A.installed=!0;(S=e).version&&Number(S.version.split(".")[0]);(function(e){e.prototype.hasOwnProperty("$i18n")||Object.defineProperty(e.prototype,"$i18n",{get:function(){return this._i18n}}),e.prototype.$t=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.$i18n;return r._t.apply(r,[e,r.locale,r._getMessages(),this].concat(t))},e.prototype.$tc=function(e,t){for(var n=[],r=arguments.length-2;r-- >0;)n[r]=arguments[r+2];var a=this.$i18n;return a._tc.apply(a,[e,a.locale,a._getMessages(),this,t].concat(n))},e.prototype.$te=function(e,t){var n=this.$i18n;return n._te(e,n.locale,n._getMessages(),t)},e.prototype.$d=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).d.apply(t,[e].concat(n))},e.prototype.$n=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this.$i18n).n.apply(t,[e].concat(n))}})(S),S.mixin(b),S.directive("t",{bind:O,update:M,unbind:N}),S.component(x.name,x),S.component(k.name,k),S.config.optionMergeStrategies.i18n=function(e,t){return void 0===t?e:t}}var L=function(){this._caches=Object.create(null)};L.prototype.interpolate=function(e,t){if(!t)return[e];var n=this._caches[e];return n||(n=function(e){var t=[],n=0,r="";for(;n<e.length;){var a=e[n++];if("{"===a){r&&t.push({type:"text",value:r}),r="";var i="";for(a=e[n++];void 0!==a&&"}"!==a;)i+=a,a=e[n++];var o="}"===a,s=D.test(i)?"list":o&&$.test(i)?"named":"unknown";t.push({value:i,type:s})}else"%"===a?"{"!==e[n]&&(r+=a):r+=a}return r&&t.push({type:"text",value:r}),t}(e),this._caches[e]=n),function(e,t){var n=[],r=0,a=Array.isArray(t)?"list":l(t)?"named":"unknown";if("unknown"===a)return n;for(;r<e.length;){var i=e[r];switch(i.type){case"text":n.push(i.value);break;case"list":n.push(t[parseInt(i.value,10)]);break;case"named":"named"===a&&n.push(t[i.value]);break;case"unknown":0}r++}return n}(n,t)};var D=/^(?:\d)+/,$=/^(?:\w)+/;var P=[];P[0]={ws:[0],ident:[3,0],"[":[4],eof:[7]},P[1]={ws:[1],".":[2],"[":[4],eof:[7]},P[2]={ws:[2],ident:[3,0],0:[3,0],number:[3,0]},P[3]={ident:[3,0],0:[3,0],number:[3,0],ws:[1,1],".":[2,1],"[":[4,1],eof:[7,1]},P[4]={"'":[5,0],'"':[6,0],"[":[4,2],"]":[1,3],eof:8,else:[4,0]},P[5]={"'":[4,0],eof:8,else:[5,0]},P[6]={'"':[4,0],eof:8,else:[6,0]};var V=/^\s?(?:true|false|-?[\d.]+|'[^']*'|"[^"]*")\s?$/;function j(e){if(null==e)return"eof";switch(e.charCodeAt(0)){case 91:case 93:case 46:case 34:case 39:return e;case 95:case 36:case 45:return"ident";case 9:case 10:case 13:case 160:case 65279:case 8232:case 8233:return"ws"}return"ident"}function F(e){var t,n,r,a=e.trim();return("0"!==e.charAt(0)||!isNaN(e))&&(r=a,V.test(r)?(n=(t=a).charCodeAt(0))!==t.charCodeAt(t.length-1)||34!==n&&39!==n?t:t.slice(1,-1):"*"+a)}var z=function(){this._cache=Object.create(null)};z.prototype.parsePath=function(e){var t=this._cache[e];return t||(t=function(e){var t,n,r,a,i,o,s,l=[],c=-1,u=0,h=0,p=[];function f(){var t=e[c+1];if(5===u&&"'"===t||6===u&&'"'===t)return c++,r="\\"+t,p[0](),!0}for(p[1]=function(){void 0!==n&&(l.push(n),n=void 0)},p[0]=function(){void 0===n?n=r:n+=r},p[2]=function(){p[0](),h++},p[3]=function(){if(h>0)h--,u=4,p[0]();else{if(h=0,void 0===n)return!1;if(!1===(n=F(n)))return!1;p[1]()}};null!==u;)if(c++,"\\"!==(t=e[c])||!f()){if(a=j(t),8===(i=(s=P[u])[a]||s.else||8))return;if(u=i[0],(o=p[i[1]])&&(r=void 0===(r=i[2])?t:r,!1===o()))return;if(7===u)return l}}(e))&&(this._cache[e]=t),t||[]},z.prototype.getPathValue=function(e,t){if(!l(e))return null;var n=this.parsePath(t);if(0===n.length)return null;for(var r=n.length,a=e,i=0;i<r;){var o=a[n[i]];if(void 0===o)return null;a=o,i++}return a};var B,W=/<\/?[\w\s="/.':;#-\/]+>/,U=/(?:@(?:\.[a-z]+)?:(?:[\w\-_|.]+|\([\w\-_|.]+\)))/g,H=/^@(?:\.([a-z]+))?:/,q=/[()]/g,G={upper:function(e){return e.toLocaleUpperCase()},lower:function(e){return e.toLocaleLowerCase()},capitalize:function(e){return""+e.charAt(0).toLocaleUpperCase()+e.substr(1)}},K=new L,J=function(e){var t=this;void 0===e&&(e={}),!S&&"undefined"!=typeof window&&window.Vue&&A(window.Vue);var n=e.locale||"en-US",r=!1!==e.fallbackLocale&&(e.fallbackLocale||"en-US"),a=e.messages||{},i=e.dateTimeFormats||{},o=e.numberFormats||{};this._vm=null,this._formatter=e.formatter||K,this._modifiers=e.modifiers||{},this._missing=e.missing||null,this._root=e.root||null,this._sync=void 0===e.sync||!!e.sync,this._fallbackRoot=void 0===e.fallbackRoot||!!e.fallbackRoot,this._formatFallbackMessages=void 0!==e.formatFallbackMessages&&!!e.formatFallbackMessages,this._silentTranslationWarn=void 0!==e.silentTranslationWarn&&e.silentTranslationWarn,this._silentFallbackWarn=void 0!==e.silentFallbackWarn&&!!e.silentFallbackWarn,this._dateTimeFormatters={},this._numberFormatters={},this._path=new z,this._dataListeners=[],this._componentInstanceCreatedListener=e.componentInstanceCreatedListener||null,this._preserveDirectiveContent=void 0!==e.preserveDirectiveContent&&!!e.preserveDirectiveContent,this.pluralizationRules=e.pluralizationRules||{},this._warnHtmlInMessage=e.warnHtmlInMessage||"off",this._postTranslation=e.postTranslation||null,this.getChoiceIndex=function(e,n){var r=Object.getPrototypeOf(t);if(r&&r.getChoiceIndex)return r.getChoiceIndex.call(t,e,n);var a,i;return t.locale in t.pluralizationRules?t.pluralizationRules[t.locale].apply(t,[e,n]):(a=e,i=n,a=Math.abs(a),2===i?a?a>1?1:0:1:a?Math.min(a,2):0)},this._exist=function(e,n){return!(!e||!n)&&(!p(t._path.getPathValue(e,n))||!!e[n])},"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||Object.keys(a).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,a[e])})),this._initVM({locale:n,fallbackLocale:r,messages:a,dateTimeFormats:i,numberFormats:o})},Q={vm:{configurable:!0},messages:{configurable:!0},dateTimeFormats:{configurable:!0},numberFormats:{configurable:!0},availableLocales:{configurable:!0},locale:{configurable:!0},fallbackLocale:{configurable:!0},formatFallbackMessages:{configurable:!0},missing:{configurable:!0},formatter:{configurable:!0},silentTranslationWarn:{configurable:!0},silentFallbackWarn:{configurable:!0},preserveDirectiveContent:{configurable:!0},warnHtmlInMessage:{configurable:!0},postTranslation:{configurable:!0}};J.prototype._checkLocaleMessage=function(e,t,n){var r=function(e,t,n,a){if(h(n))Object.keys(n).forEach((function(i){var o=n[i];h(o)?(a.push(i),a.push("."),r(e,t,o,a),a.pop(),a.pop()):(a.push(i),r(e,t,o,a),a.pop())}));else if(Array.isArray(n))n.forEach((function(n,i){h(n)?(a.push("["+i+"]"),a.push("."),r(e,t,n,a),a.pop(),a.pop()):(a.push("["+i+"]"),r(e,t,n,a),a.pop())}));else if(c(n)){if(W.test(n)){var i="Detected HTML in message '"+n+"' of keypath '"+a.join("")+"' at '"+t+"'. Consider component interpolation with '<i18n>' to avoid XSS. See https://bit.ly/2ZqJzkp";"warn"===e?o(i):"error"===e&&function(e,t){"undefined"!=typeof console&&(console.error("[vue-i18n] "+e),t&&console.error(t.stack))}(i)}}};r(t,e,n,[])},J.prototype._initVM=function(e){var t=S.config.silent;S.config.silent=!0,this._vm=new S({data:e}),S.config.silent=t},J.prototype.destroyVM=function(){this._vm.$destroy()},J.prototype.subscribeDataChanging=function(e){this._dataListeners.push(e)},J.prototype.unsubscribeDataChanging=function(e){!function(e,t){if(e.length){var n=e.indexOf(t);if(n>-1)e.splice(n,1)}}(this._dataListeners,e)},J.prototype.watchI18nData=function(){var e=this;return this._vm.$watch("$data",(function(){for(var t=e._dataListeners.length;t--;)S.nextTick((function(){e._dataListeners[t]&&e._dataListeners[t].$forceUpdate()}))}),{deep:!0})},J.prototype.watchLocale=function(){if(!this._sync||!this._root)return null;var e=this._vm;return this._root.$i18n.vm.$watch("locale",(function(t){e.$set(e,"locale",t),e.$forceUpdate()}),{immediate:!0})},J.prototype.onComponentInstanceCreated=function(e){this._componentInstanceCreatedListener&&this._componentInstanceCreatedListener(e,this)},Q.vm.get=function(){return this._vm},Q.messages.get=function(){return d(this._getMessages())},Q.dateTimeFormats.get=function(){return d(this._getDateTimeFormats())},Q.numberFormats.get=function(){return d(this._getNumberFormats())},Q.availableLocales.get=function(){return Object.keys(this.messages).sort()},Q.locale.get=function(){return this._vm.locale},Q.locale.set=function(e){this._vm.$set(this._vm,"locale",e)},Q.fallbackLocale.get=function(){return this._vm.fallbackLocale},Q.fallbackLocale.set=function(e){this._localeChainCache={},this._vm.$set(this._vm,"fallbackLocale",e)},Q.formatFallbackMessages.get=function(){return this._formatFallbackMessages},Q.formatFallbackMessages.set=function(e){this._formatFallbackMessages=e},Q.missing.get=function(){return this._missing},Q.missing.set=function(e){this._missing=e},Q.formatter.get=function(){return this._formatter},Q.formatter.set=function(e){this._formatter=e},Q.silentTranslationWarn.get=function(){return this._silentTranslationWarn},Q.silentTranslationWarn.set=function(e){this._silentTranslationWarn=e},Q.silentFallbackWarn.get=function(){return this._silentFallbackWarn},Q.silentFallbackWarn.set=function(e){this._silentFallbackWarn=e},Q.preserveDirectiveContent.get=function(){return this._preserveDirectiveContent},Q.preserveDirectiveContent.set=function(e){this._preserveDirectiveContent=e},Q.warnHtmlInMessage.get=function(){return this._warnHtmlInMessage},Q.warnHtmlInMessage.set=function(e){var t=this,n=this._warnHtmlInMessage;if(this._warnHtmlInMessage=e,n!==e&&("warn"===e||"error"===e)){var r=this._getMessages();Object.keys(r).forEach((function(e){t._checkLocaleMessage(e,t._warnHtmlInMessage,r[e])}))}},Q.postTranslation.get=function(){return this._postTranslation},Q.postTranslation.set=function(e){this._postTranslation=e},J.prototype._getMessages=function(){return this._vm.messages},J.prototype._getDateTimeFormats=function(){return this._vm.dateTimeFormats},J.prototype._getNumberFormats=function(){return this._vm.numberFormats},J.prototype._warnDefault=function(e,t,n,r,a,i){if(!p(n))return n;if(this._missing){var o=this._missing.apply(null,[e,t,r,a]);if(c(o))return o}else 0;if(this._formatFallbackMessages){var s=f.apply(void 0,a);return this._render(t,i,s.params,t)}return t},J.prototype._isFallbackRoot=function(e){return!e&&!p(this._root)&&this._fallbackRoot},J.prototype._isSilentFallbackWarn=function(e){return this._silentFallbackWarn instanceof RegExp?this._silentFallbackWarn.test(e):this._silentFallbackWarn},J.prototype._isSilentFallback=function(e,t){return this._isSilentFallbackWarn(t)&&(this._isFallbackRoot()||e!==this.fallbackLocale)},J.prototype._isSilentTranslationWarn=function(e){return this._silentTranslationWarn instanceof RegExp?this._silentTranslationWarn.test(e):this._silentTranslationWarn},J.prototype._interpolate=function(e,t,n,r,a,i,o){if(!t)return null;var s,l=this._path.getPathValue(t,n);if(Array.isArray(l)||h(l))return l;if(p(l)){if(!h(t))return null;if(!c(s=t[n]))return null}else{if(!c(l))return null;s=l}return(s.indexOf("@:")>=0||s.indexOf("@.")>=0)&&(s=this._link(e,t,s,r,"raw",i,o)),this._render(s,a,i,n)},J.prototype._link=function(e,t,n,r,a,i,o){var s=n,l=s.match(U);for(var c in l)if(l.hasOwnProperty(c)){var u=l[c],h=u.match(H),p=h[0],f=h[1],d=u.replace(p,"").replace(q,"");if(m(o,d))return s;o.push(d);var v=this._interpolate(e,t,d,r,"raw"===a?"string":a,"raw"===a?void 0:i,o);if(this._isFallbackRoot(v)){if(!this._root)throw Error("unexpected error");var g=this._root.$i18n;v=g._translate(g._getMessages(),g.locale,g.fallbackLocale,d,r,a,i)}v=this._warnDefault(e,d,v,r,Array.isArray(i)?i:[i],a),this._modifiers.hasOwnProperty(f)?v=this._modifiers[f](v):G.hasOwnProperty(f)&&(v=G[f](v)),o.pop(),s=v?s.replace(u,v):s}return s},J.prototype._render=function(e,t,n,r){var a=this._formatter.interpolate(e,n,r);return a||(a=K.interpolate(e,n,r)),"string"!==t||c(a)?a:a.join("")},J.prototype._appendItemToChain=function(e,t,n){var r=!1;return m(e,t)||(r=!0,t&&(r="!"!==t[t.length-1],t=t.replace(/!/g,""),e.push(t),n&&n[t]&&(r=n[t]))),r},J.prototype._appendLocaleToChain=function(e,t,n){var r,a=t.split("-");do{var i=a.join("-");r=this._appendItemToChain(e,i,n),a.splice(-1,1)}while(a.length&&!0===r);return r},J.prototype._appendBlockToChain=function(e,t,n){for(var r=!0,a=0;a<t.length&&"boolean"==typeof r;a++){var i=t[a];c(i)&&(r=this._appendLocaleToChain(e,i,n))}return r},J.prototype._getLocaleChain=function(e,t){if(""===e)return[];this._localeChainCache||(this._localeChainCache={});var n=this._localeChainCache[e];if(!n){t||(t=this.fallbackLocale),n=[];for(var r,a=[e];s(a);)a=this._appendBlockToChain(n,a,t);(a=c(r=s(t)?t:l(t)?t.default?t.default:null:t)?[r]:r)&&this._appendBlockToChain(n,a,null),this._localeChainCache[e]=n}return n},J.prototype._translate=function(e,t,n,r,a,i,o){for(var s,l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(!p(s=this._interpolate(u,e[u],r,a,i,o,[r])))return s}return null},J.prototype._t=function(e,t,n,r){for(var a,i=[],o=arguments.length-4;o-- >0;)i[o]=arguments[o+4];if(!e)return"";var s=f.apply(void 0,i),l=s.locale||t,c=this._translate(n,l,this.fallbackLocale,e,r,"string",s.params);if(this._isFallbackRoot(c)){if(!this._root)throw Error("unexpected error");return(a=this._root).$t.apply(a,[e].concat(i))}return c=this._warnDefault(l,e,c,r,i,"string"),this._postTranslation&&null!=c&&(c=this._postTranslation(c,e)),c},J.prototype.t=function(e){for(var t,n=[],r=arguments.length-1;r-- >0;)n[r]=arguments[r+1];return(t=this)._t.apply(t,[e,this.locale,this._getMessages(),null].concat(n))},J.prototype._i=function(e,t,n,r,a){var i=this._translate(n,t,this.fallbackLocale,e,r,"raw",a);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.i(e,t,a)}return this._warnDefault(t,e,i,r,[a],"raw")},J.prototype.i=function(e,t,n){return e?(c(t)||(t=this.locale),this._i(e,t,this._getMessages(),null,n)):""},J.prototype._tc=function(e,t,n,r,a){for(var i,o=[],s=arguments.length-5;s-- >0;)o[s]=arguments[s+5];if(!e)return"";void 0===a&&(a=1);var l={count:a,n:a},c=f.apply(void 0,o);return c.params=Object.assign(l,c.params),o=null===c.locale?[c.params]:[c.locale,c.params],this.fetchChoice((i=this)._t.apply(i,[e,t,n,r].concat(o)),a)},J.prototype.fetchChoice=function(e,t){if(!e&&!c(e))return null;var n=e.split("|");return n[t=this.getChoiceIndex(t,n.length)]?n[t].trim():e},J.prototype.tc=function(e,t){for(var n,r=[],a=arguments.length-2;a-- >0;)r[a]=arguments[a+2];return(n=this)._tc.apply(n,[e,this.locale,this._getMessages(),null,t].concat(r))},J.prototype._te=function(e,t,n){for(var r=[],a=arguments.length-3;a-- >0;)r[a]=arguments[a+3];var i=f.apply(void 0,r).locale||t;return this._exist(n[i],e)},J.prototype.te=function(e,t){return this._te(e,this.locale,this._getMessages(),t)},J.prototype.getLocaleMessage=function(e){return d(this._vm.messages[e]||{})},J.prototype.setLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,t)},J.prototype.mergeLocaleMessage=function(e,t){"warn"!==this._warnHtmlInMessage&&"error"!==this._warnHtmlInMessage||this._checkLocaleMessage(e,this._warnHtmlInMessage,t),this._vm.$set(this._vm.messages,e,_({},this._vm.messages[e]||{},t))},J.prototype.getDateTimeFormat=function(e){return d(this._vm.dateTimeFormats[e]||{})},J.prototype.setDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,t),this._clearDateTimeFormat(e,t)},J.prototype.mergeDateTimeFormat=function(e,t){this._vm.$set(this._vm.dateTimeFormats,e,_(this._vm.dateTimeFormats[e]||{},t)),this._clearDateTimeFormat(e,t)},J.prototype._clearDateTimeFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._dateTimeFormatters.hasOwnProperty(r)&&delete this._dateTimeFormatters[r]}},J.prototype._localizeDateTime=function(e,t,n,r,a){for(var i=t,o=r[i],s=this._getLocaleChain(t,n),l=0;l<s.length;l++){var c=s[l];if(i=c,!p(o=r[c])&&!p(o[a]))break}if(p(o)||p(o[a]))return null;var u=o[a],h=i+"__"+a,f=this._dateTimeFormatters[h];return f||(f=this._dateTimeFormatters[h]=new Intl.DateTimeFormat(i,u)),f.format(e)},J.prototype._d=function(e,t,n){if(!n)return new Intl.DateTimeFormat(t).format(e);var r=this._localizeDateTime(e,t,this.fallbackLocale,this._getDateTimeFormats(),n);if(this._isFallbackRoot(r)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.d(e,n,t)}return r||""},J.prototype.d=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._d(e,r,a)},J.prototype.getNumberFormat=function(e){return d(this._vm.numberFormats[e]||{})},J.prototype.setNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,t),this._clearNumberFormat(e,t)},J.prototype.mergeNumberFormat=function(e,t){this._vm.$set(this._vm.numberFormats,e,_(this._vm.numberFormats[e]||{},t)),this._clearNumberFormat(e,t)},J.prototype._clearNumberFormat=function(e,t){for(var n in t){var r=e+"__"+n;this._numberFormatters.hasOwnProperty(r)&&delete this._numberFormatters[r]}},J.prototype._getNumberFormatter=function(e,t,n,r,a,i){for(var o=t,s=r[o],l=this._getLocaleChain(t,n),c=0;c<l.length;c++){var u=l[c];if(o=u,!p(s=r[u])&&!p(s[a]))break}if(p(s)||p(s[a]))return null;var h,f=s[a];if(i)h=new Intl.NumberFormat(o,Object.assign({},f,i));else{var d=o+"__"+a;(h=this._numberFormatters[d])||(h=this._numberFormatters[d]=new Intl.NumberFormat(o,f))}return h},J.prototype._n=function(e,t,n,r){if(!J.availabilities.numberFormat)return"";if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).format(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.format(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n.n(e,Object.assign({},{key:n,locale:t},r))}return i||""},J.prototype.n=function(e){for(var t=[],n=arguments.length-1;n-- >0;)t[n]=arguments[n+1];var r=this.locale,a=null,o=null;return 1===t.length?c(t[0])?a=t[0]:l(t[0])&&(t[0].locale&&(r=t[0].locale),t[0].key&&(a=t[0].key),o=Object.keys(t[0]).reduce((function(e,n){var r;return m(i,n)?Object.assign({},e,((r={})[n]=t[0][n],r)):e}),null)):2===t.length&&(c(t[0])&&(a=t[0]),c(t[1])&&(r=t[1])),this._n(e,r,a,o)},J.prototype._ntp=function(e,t,n,r){if(!J.availabilities.numberFormat)return[];if(!n)return(r?new Intl.NumberFormat(t,r):new Intl.NumberFormat(t)).formatToParts(e);var a=this._getNumberFormatter(e,t,this.fallbackLocale,this._getNumberFormats(),n,r),i=a&&a.formatToParts(e);if(this._isFallbackRoot(i)){if(!this._root)throw Error("unexpected error");return this._root.$i18n._ntp(e,t,n,r)}return i||[]},Object.defineProperties(J.prototype,Q),Object.defineProperty(J,"availabilities",{get:function(){if(!B){var e="undefined"!=typeof Intl;B={dateTimeFormat:e&&void 0!==Intl.DateTimeFormat,numberFormat:e&&void 0!==Intl.NumberFormat}}return B}}),J.install=A,J.version="8.18.2";var X=J,Z=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("el-container",{class:["ec-doc","ec-doc-"+e.shared.docType,"ec-doc-locale-"+e.shared.locale]},[n("el-aside",{staticStyle:{height:"100%"},attrs:{width:"300px"}},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("Search"),e._v(" "),n("DocNav")],1),e._v(" "),n("el-main",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1)],1)};Z._withStripped=!0;var Y=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-nav"},[e.isOption?n("h3",[e._v(e._s(e.title))]):e._e(),e._v(" "),n("div",{staticClass:"toolbox"},[e.isOption?n("span",{staticClass:"item",on:{click:e.collapseAll}},[n("i",{staticClass:"el-icon-s-fold"}),e._v(e._s(e.$t("nav.collapseAll")))]):e._e()]),e._v(" "),n("el-tree",{ref:"tree",attrs:{"node-key":"path","empty-text":"",props:e.props,lazy:"","default-expanded-keys":e.expandedKeys,indent:10,"expand-on-click-node":!1,load:e.loadTreeNode,data:e.treeData,"current-node-key":e.initialSelectedNode},on:{"current-change":e.onSelectNode},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.node,a=t.data;return"tutorial"!==e.shared.docType?n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(r.expanded&&a.labelExpanded||a.label))]),e._v(" "),null!=a.defaultValue?n("span",{staticClass:"default-value"},[e._v(e._s(a.defaultValue))]):r.isLeaf?n("span",{staticClass:"default-value"},[e._v("...")]):e._e(),e._v(" "),a.isRoot||r.expanded?e._e():n("span",[e._v(",")])]):n("div",{staticClass:"doc-nav-item"},[n("span",[e._v(e._s(a.label))])])}}],null,!0)})],1)};Y._withStripped=!0;var ee,te,ne,re,ae=n(21),ie=n(23);function oe(e){return(oe="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var se,le,ce={},ue={},he=[];function pe(e){return new Promise((function(t,n){var r=Object(ie.getDocJSONPVarNname)(e),a="".concat(ee,"/").concat(e,"?").concat(ne),i=document.createElement("script");i.async=!0,i.onload=function(){window[r]?t(window[r]):n("Load failed. ".concat(r))},i.src=a,document.body.appendChild(i)}))}function fe(e){return"doc-content-"+e.replace(/[\. <>]/g,"-")}function de(){if(!re)throw new Error("Preload json with url first");return re}function me(e,t,n,r){return e,ee=t,te=n,ne=r||"1",re||(re=pe("".concat(te,"-outline.js")).then((function(e){return function(e){function t(e,t,n){return e?e+n+t:t}function n(e,r){e.type||(e.type=oe(e.default)),e.type instanceof Array||(e.type=[e.type]);for(var a=0;a<e.type.length;a++)"*"===e.type[a]&&(e.type[a]="any");if(e.arrayItemType?e.path=t(r.path,e.arrayItemType,"-"):e.path=t(r.path,e.prop,"."),e.children){e.path.indexOf(".")<0&&!e.children[0].arrayItemType&&(se[e.path]=e);for(var i=0;i<e.children.length;i++)n(e.children[i],e)}ue[e.path]=e}e,se={};for(var r=0;r<e.children.length;r++)n(e.children[r],{});return e.isRoot=!0,he=Object.keys(ue),e}(e)}))),re}function ve(e){if(!se)throw new Error("Outline data is not loaded.");var t=e.split(".")[0],n=se[t]&&e?te+"."+t:te;if(!ce[n]){var r=pe("".concat(n,".js"));ce[n]={fetcher:r},r.then((function(e){ce[n].indexer=function(e,t){var n,r=[];for(var a in e)r.push({path:t?t+"."+a:a,content:e[a].desc,text:(n=e[a].desc,n.replace(/<[^>]*>?/gm,""))});return{search:function(e){var t=[],n=e.split(/[ +,]/).filter((function(e){return!!e})).map((function(e){return new RegExp(e,"i")}));if(!n.length)return t;for(var a=0;a<r.length;a++){for(var i=!0,o=0;o<n.length;o++)if(!n[o].test(r[a].text)&&!n[o].test(r[a].path)){i=!1;break}i&&t.push(r[a])}return t}}}(e,t)}))}return ce[n]}function ge(e){return ve(e).fetcher}function _e(e){return ue[e]}function ye(e){if(!e)return Object.keys(se)[0];if(_e(e.replace("[i]","")))return e.replace("[i]","");var t,n=e.split(".").map((function(e){var t=_e(e),n=t&&t.children&&t&&t.children[0];return n&&n.arrayItemType?e+"-"+n.arrayItemType:e}));if(_e(n.join(".")))return n.join(".");for(var r=-1/0,a=0;a<he.length;a++){var i=he[a],o=Object(ae.stringSimilarity)(e,i);o>r&&(r=o,t=i)}return t}function be(e){return(be="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}var xe=["auto","top","bottom","right"];function Ee(e){ke.computedOptionExampleLayout="auto"===e?window.innerWidth<1400?"bottom":"right":e,ke.optionExampleLayout=e,window.localStorage&&window.localStorage.setItem("_ec_option_example_layout",e)}var we,Ce,Se=(we={},!(Ce=window.localStorage&&window.localStorage.getItem("_ec_option_example_layout"))||"auto"===Ce||xe.indexOf(Ce)<0?(we.mode="auto",we.computedMode=window.innerWidth<1400?"bottom":"right"):we.mode=we.computedMode=Ce,we),ke={docType:"",currentPath:"",fuzzySearch:!1,searchQuery:"",isMobile:!1,locale:"zh",showOptionExample:!1,allOptionExamples:null,cleanMode:!1,currentExampleName:"",currentExampleOption:"",optionExampleLayout:Se.mode,computedOptionExampleLayout:Se.computedMode};function Oe(){if(ke.isMobile){var e=ke.currentPath.split("."),t=_e(ke.currentPath);return t&&(!t.children||!t.children.length)&&e.length>1&&e.pop(),e.join(".")}return ke.currentPath.split(".")[0]}function Me(){return"option"===ke.docType||"option-gl"===ke.docType}var Ne=["markPoint","markLine","markArea","tooltip","axisPointer"];function Te(e,t,n){function r(e,t,a,i){var o=t.shift();if(i=(i?i+".":"")+o,"data"!==a||"object"===be(e)&&!Array.isArray(e)||(e={value:e}),e=Object.assign({},e),!t.length)return void 0===n?(delete e[o],e):(e[o]=n,e);var s=o.split("-"),l=s[0],c=s[1];if(null==e[l]){var u=_e(i);e[l]=function(e){return"markPoint"===e?{data:[{type:"max"}]}:"markLine"===e?{data:[{type:"average"}]}:"markArea"===e?{data:[[{type:"min"},{type:"max"}]]}:void 0}(l)||(u&&u.isArray?[]:{})}var h=e[l];return Array.isArray(h)?"series"===l?e[l]=h.map((function(e,n){return c&&e.type!==c?e:r(e,t.slice(),l,i)})):(e[l]=h.slice(),e[l][0]=r(e[l][0]||{},t.slice(),l,i)):(c&&h.type!==c&&(e[l]=h),e[l]=r(h,t.slice(),l,i)),e}var a=t.split(".")[0];return"timeline"===a&&e.baseOption?Object.assign({},e,{baseOption:r(e.baseOption,t.split("."),"","")}):Ne.indexOf(a)>=0?function e(n,a){if(n[a])return r(n,t.split("."),"","");if(Array.isArray(n)){for(var i=[],o=0;o<n.length;o++)i.push(e(n[o],a));return i}if("object"===be(n)){var s={};for(var l in n)n.hasOwnProperty(l)&&(s[l]=e(n[l],a));return s}return n}(e,a):r(e,t.split("."),"","")}function Ie(){var e=decodeURIComponent(window.location.hash.slice(1));if(e.startsWith("/search/")){var t=e.substr("/search/".length);ke.fuzzySearch=!0,ke.searchQuery=t}else e&&(ke.currentPath=e,ke.fuzzySearch=!1)}function Re(e){window.location.hash="#"+encodeURIComponent(e)}var Ae=n(1),Le=n.n(Ae);function De(e,t){var n=[];return t.children&&t.children.forEach((function(e){var t,r;n.push(((r={path:(t=e).path}).path=t.path,t.arrayItemType?(r.label="{type: ".concat(t.arrayItemType,", ...}"),r.labelExpanded="{"):null!=t.default?(r.defaultValue=t.default,r.label=t.prop+": ",r.leaf=!0):t.isArray?(r.label=t.prop+": [{...}]",r.labelExpanded=t.prop+": [{"):t.isObject?(r.label=t.prop+": {...}",r.labelExpanded=t.prop+": {"):(r.label=t.prop,r.leaf=!0),r.$source=Object.freeze(t),r))})),n}var $e={data:function(){return{props:{isLeaf:"leaf"},title:"setOption({",treeData:[],expandedKeys:[],loading:!0,shared:ke,initialSelectedNode:ke.currentPath}},created:function(){this.updateTreeSelectionAndExpand()},computed:{isOption:function(){return Me()}},methods:{updateTreeSelectionAndExpand:function(){this.expandedKeys=[];for(var e,t=this.shared.currentPath;(e=t.lastIndexOf("."))>=0||(e=t.lastIndexOf("-"))>=0;)t=t.substr(0,e),this.expandedKeys.push(t)},loadTreeNode:function(e,t){var n=this;0===e.level?(this.loading=!1,de().then((function(r){t(De(e.data,r)),setTimeout((function(){n.scrollToCurrentTreeNode()}),200)}))):e.data.children&&e.data.children.length?t(e.data.children):e.data.$source?t(De(e.data,e.data.$source)):t([])},onSelectNode:function(e,t){this.shared.currentPath=e.path},scrollToCurrentTreeNode:function(){var e=this.$el.querySelector(".el-tree-node.is-current");if(e){var t=e.getBoundingClientRect(),n=this.$el.getBoundingClientRect();(t.top>n.bottom||t.bottom<n.top)&&Le()(e,{time:500,align:{top:.1}})}},manualSelectNode:function(e){var t=this;this.updateTreeSelectionAndExpand(),setTimeout((function(){t.$refs.tree.setCurrentKey(null),t.$refs.tree.setCurrentKey(e),setTimeout((function(){t.scrollToCurrentTreeNode()}),200)}),50)},collapseAll:function(){for(var e in this.$refs.tree.store.nodesMap)this.$refs.tree.store.nodesMap[e].expanded=!1}},watch:{"shared.currentPath":function(e){Re(e),this.manualSelectNode(e)}}};n(31);function Pe(e,t,n,r,a,i,o,s){var l,c="function"==typeof e?e.options:e;if(t&&(c.render=t,c.staticRenderFns=n,c._compiled=!0),r&&(c.functional=!0),i&&(c._scopeId="data-v-"+i),o?(l=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),a&&a.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},c._ssrRegister=l):a&&(l=s?function(){a.call(this,(c.functional?this.parent:this).$root.$options.shadowRoot)}:a),l)if(c.functional){c._injectStyles=l;var u=c.render;c.render=function(e,t){return l.call(t),u(e,t)}}else{var h=c.beforeCreate;c.beforeCreate=h?[].concat(h,l):[l]}return{exports:e,options:c}}var Ve=Pe($e,Y,[],!1,null,null,null);Ve.options.__file="src/components/DocNav.vue";var je=Ve.exports,Fe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"}],staticClass:"doc-main"},[n("div",{ref:"docContentDom",class:["doc-content",e.shared.showOptionExample?"option-example-actived":"","option-example-"+e.shared.computedOptionExampleLayout+"-layout"]},[n("h2",{attrs:{id:e.pageId}},[e._v(e._s(e.pageTitle))]),e._v(" "),e.pageDesc?n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"page-description",domProps:{innerHTML:e._s(e.pageDesc)}}):e._e(),e._v(" "),e.pageDisplayOutline.children&&e.pageDisplayOutline.children&&1<=e.maxDepth?n("div",[n("h3",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),e._l(e.pageDisplayOutline.children,(function(t){return n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.pageDescMap,"max-depth":e.maxDepth,depth:1},on:{"scroll-to-self":e.scrollTo,"toggle-expanded":e.handleCardExpandToggle}})}))],2):e._e()]),e._v(" "),e.showLiveExample?[e.shared.showOptionExample?n("LiveExample",{ref:"liveExample"}):n("div",{staticClass:"open-option-example",on:{click:e.openOptionExample}},[n("i",{staticClass:"el-icon-data-line"}),e._v(" "+e._s(e.$t("example.titleShort"))+"\n        ")])]:e._e()],2)};Fe._withStripped=!0;var ze=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["doc-content-item-card","level-"+e.depth,e.isLeaf?"leaf":"",e.shared.currentPath===e.nodeData.path?"current":""],attrs:{id:e.itemId}},[e.expanded?n("div",{staticClass:"hierarchy-line"}):e._e(),e._v(" "),n("h4",[e.depth>1?n("span",{staticClass:"guider"}):e._e(),e._v(" "),e.supportsExpandable?n("el-button",{attrs:{plain:"",circle:"",size:"mini",icon:e.expanded?"el-icon-minus":"el-icon-plus"},on:{click:e.toggleExpanded}}):e._e(),e._v(" "),e.shared.isMobile?e._e():n("span",{staticClass:"path-parent"},e._l(e.parentPath,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text)+".")])})),0),e._v(" "),n("span",{staticClass:"path-base"},[n("a",{attrs:{href:"#"+e.baseName.link}},[e._v(e._s(e.baseName.text))])]),e._v(" "),e.nodeData.default&&"*"!==e.nodeData.default?n("span",{staticClass:"default-value"},[e._v(" = "+e._s(e.nodeData.default))]):e._e(),e._v(" "),e.uiControl&&e.shared.allOptionExamples&&!e.shared.isMobile?n("span",{class:["control-toggle",e.enableUIControl?"active":""],on:{click:e.toggleUIControl}},[n("i",[e._v("")]),e._v(" "+e._s(e.$t("example.tryDesc"))+"\n            ")]):e._e()],1),e._v(" "),n("div",{staticClass:"prop-types"},e._l(e.nodeData.type,(function(t){return n("span",{key:t,class:["prop-type","prop-type-"+t.toLowerCase()]},[e._v(e._s(t))])})),0),e._v(" "),e.enableUIControl?n("OptionControl",{attrs:{controlConfig:e.uiControl,optionPath:e.nodeData.path}}):e._e(),e._v(" "),n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"item-description",domProps:{innerHTML:e._s(e.desc)}}),e._v(" "),e.supportsExpandable?n("div",{staticClass:"children"},e._l(e.nodeData.children,(function(t){return e.expanded?n("DocContentItemCard",{key:t.path,attrs:{"node-data":t,"desc-map":e.descMap,depth:e.depth+1,"max-depth":e.maxDepth},on:{"toggle-expanded":e.bubbleEventToggleExapndedEvent,"scroll-to-self":e.bubbleScrollToSelfEvent}}):e._e()})),1):e._e(),e._v(" "),e.expanded&&!e.shared.isMobile||e.isLeaf?e._e():n("PropertiesList",{attrs:{nodeData:e.nodeData,descMap:e.descMap}})],1)};ze._withStripped=!0;var Be=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"properties-list-panel"},[n("h5",[e._v(e._s(e.$t("content.properties")))]),e._v(" "),n("div",{staticClass:"properties-list"},[e._v("\n        {\n        "),e._l(e.displayedProperties,(function(t,r){return n("span",{key:t.path},[e.shared.isMobile?n("span",[n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]):n("el-popover",{attrs:{title:e.getName(t.path),"close-delay":400,"open-delay":200,placement:"top",trigger:"hover"}},[n("div",{directives:[{name:"highlight",rawName:"v-highlight"}],staticClass:"property-popup-desc",domProps:{innerHTML:e._s(e.getDesc(t.path))}}),e._v(" "),n("a",{attrs:{slot:"reference",href:"#"+t.path},slot:"reference"},[e._v(e._s(e.getName(t.path)))])]),e._v(" "),r<e.displayedProperties.length-1?n("span",[e._v(", ")]):e._e()],1)})),e._v("\n        }\n    ")],2)])};Be._withStripped=!0;var We={props:["nodeData","descMap"],data:function(){return{shared:ke}},computed:{displayedProperties:function(){return this.nodeData.children}},methods:{getDesc:function(e){return this.descMap[e]&&this.descMap[e].desc},getName:function(e){return e.split(".").pop()}}},Ue=(n(32),Pe(We,Be,[],!1,null,null,null));Ue.options.__file="src/components/PropertiesList.vue";var He=Ue.exports,qe=function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"option-control"},[t(this.uiComponent,this._b({tag:"component",attrs:{value:this.defaultValue},on:{change:this.onValueChange}},"component",this.uiAttrs,!1))],1)};qe._withStripped=!0;var Ge=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-color"},[n("el-color-picker",{attrs:{"show-alpha":!0},on:{change:e.onValueChange,"active-change":e.onActiveChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}}),e._v(" "),n("span",{style:{color:e.innerValue||"#aaa"}},[e._v("\n    "+e._s(e.innerValue||e.$t("example.defaultColor"))+"\n")])],1)};Ge._withStripped=!0;var Ke={props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},onActiveChange:function(e){}}},Je=(n(33),Pe(Ke,Ge,[],!1,null,null,null));Je.options.__file="src/controls/ControlColor.vue";var Qe=Je.exports,Xe=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-boolean"},[n("el-switch",{attrs:{"active-text":e.$t("example.booleanDesc")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};Xe._withStripped=!0;var Ze=Pe({props:["value"],data:function(){return{innerValue:"true"===this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},Xe,[],!1,null,null,null);Ze.options.__file="src/controls/ControlBoolean.vue";var Ye=Ze.exports,et=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-number"},[n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};et._withStripped=!0;var tt={props:["value","min","max","step"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},nt=(n(34),Pe(tt,et,[],!1,null,null,null));nt.options.__file="src/controls/ControlNumber.vue";var rt=nt.exports,at=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-vector"},[n("el-switch",{attrs:{"active-text":e.$t("example.vectorSetSeparate")},model:{value:e.innerSeparate,callback:function(t){e.innerSeparate=t},expression:"innerSeparate"}}),e._v(" "),e.innerSeparate?n("div",{staticClass:"control-vector-group"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step,size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValueArr[r],callback:function(t){e.$set(e.innerValueArr,r,t)},expression:"innerValueArr[index]"}})],1)})),0):n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.innerValueArr[0],callback:function(t){e.$set(e.innerValueArr,0,t)},expression:"innerValueArr[0]"}})],1)};at._withStripped=!0;var it={props:["value","separate","min","max","step","dims"],data:function(){return{innerSeparate:"true"===this.separate,innerValueArr:this.value.split(",").map((function(e){return+e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return+e.trim()}))}},methods:{onValueChange:function(){if(!this.innerSeparate)for(var e=1;e<this.innerValueArr.length;e++)this.innerValueArr[e]=this.innerValueArr[0];this.$emit("change",this.innerValueArr.slice())}}},ot=(n(35),Pe(it,at,[],!1,null,null,null));ot.options.__file="src/controls/ControlVector.vue";var st=ot.exports,lt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-enum"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,class:{"control-enum-special":null!=e.specialValues[t]},attrs:{value:t}},[e._v(e._s(t))])})),1)],1)};lt._withStripped=!0;var ct={true:!0,false:!1},ut={props:["value","options"],computed:{optionsArr:function(){return this.options.split(",").map((function(e){return e.trim()}))},specialValues:function(){return ct}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",ct.hasOwnProperty(this.innerValue)?ct[this.innerValue]:this.innerValue)}}},ht=(n(36),Pe(ut,lt,[],!1,null,null,null));ht.options.__file="src/controls/ControlEnum.vue";var pt=ht.exports,ft=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent"},[n("el-radio-group",{attrs:{size:"mini"},model:{value:e.mode,callback:function(t){e.mode=t},expression:"mode"}},[n("el-radio-button",{attrs:{label:"absolute"}},[e._v(e._s(e.$t("example.absoluteMode")))]),e._v(" "),n("el-radio-button",{attrs:{label:"percent"}},[e._v(e._s(e.$t("example.percentMode")))])],1),e._v(" "),"absolute"===e.mode?n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:e.onValueChange},model:{value:e.absoluteValue,callback:function(t){e.absoluteValue=t},expression:"absoluteValue"}}):n("div",[n("el-slider",{attrs:{min:0,max:100,step:1,"format-tooltip":e.formatTooltip},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}}),e._v(" "),n("el-input-number",{attrs:{"controls-position":"right",size:"mini",min:0,max:100,step:1},on:{change:e.onValueChange},model:{value:e.percentValue,callback:function(t){e.percentValue=t},expression:"percentValue"}})],1)],1)};ft._withStripped=!0;var dt={props:["value","min","max","step"],data:function(){var e=this.value.indexOf("%")<0;return{percentValue:e?50:+this.value.replace("%",""),absoluteValue:e?+this.value:0,mode:e?"absolute":"percent"}},watch:{value:function(e){"absolute"===this.mode?this.absoluteValue=+e:this.percentValue=+e.replace("%","")},mode:function(){this.onValueChange()}},methods:{onValueChange:function(){this.$emit("change","absolute"===this.mode?this.absoluteValue:this.percentValue+"%")},formatTooltip:function(e){return e+"%"}}},mt=(n(37),Pe(dt,ft,[],!1,null,null,null));mt.options.__file="src/controls/ControlPercent.vue";var vt=mt.exports,gt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-percent-vector"},e._l(e.dimsArr,(function(t,r){return n("div",{key:r},[n("label",[e._v(e._s(t))]),e._v(" "),n("ControlPercent",{attrs:{value:e.innerValueArr[r],"controls-position":"right",min:null==e.min?-1e4:+e.min,max:null==e.max?1e4:+e.max,step:null==e.step?1:+e.step},on:{change:function(t){return e.onValueChange(r,t)}}})],1)})),0)};gt._withStripped=!0;var _t={components:{ControlPercent:vt},props:["value","min","max","step","dims"],data:function(){return{innerValueArr:this.value.split(",").map((function(e){return e.trim()}))}},computed:{dimsArr:function(){return this.dims.split(",").map((function(e){return e.trim()}))}},watch:{value:function(e){this.innerValueArr=this.value.split(",").map((function(e){return e.trim()}))}},methods:{onValueChange:function(e,t){this.innerValueArr[e]=t,this.$emit("change",this.innerValueArr.slice())}}},yt=(n(38),Pe(_t,gt,[],!1,null,null,null));yt.options.__file="src/controls/ControlPercentVector.vue";var bt=yt.exports,xt=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-text"},[n("el-input",{attrs:{size:"mini",placeholder:e.$t("example.inputPlaceholder")},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}})],1)};xt._withStripped=!0;var Et=Pe({props:["value"],data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)}}},xt,[],!1,null,null,null);Et.options.__file="src/controls/ControlText.vue";var wt=Et.exports,Ct=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"control-icon"},[n("el-select",{attrs:{size:"mini"},on:{change:e.onValueChange},model:{value:e.innerValue,callback:function(t){e.innerValue=t},expression:"innerValue"}},e._l(e.optionsArr,(function(t){return n("el-option",{key:t,attrs:{value:t}},[e._v(e._s(t))])})),1),e._v(" "),n("el-button",{attrs:{size:"mini",type:"primary"},on:{click:e.chooseFile}},[e._v(e._s(e.$t("example.upload")))])],1)};function St(e){return(St="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}Ct._withStripped=!0,SVGElement.prototype.getTransformToElement=SVGElement.prototype.getTransformToElement||function(e){return e.getScreenCTM().inverse().multiply(this.getScreenCTM())};var kt=/,?([achlmqrstvxz]),?/gi,Ot=function(e){return e.join(",").replace(kt,"$1")};function Mt(e,t,n,r,a){if(e)if(void 0===r&&(r=!1),void 0===t&&(t=!1),void 0===n&&(n=!1),void 0===a&&(a=!1),e&&e.children&&e.children.length){for(var i=0,o=e.children.length;i<o;i++)Mt(e.children[i],t,n,r,a);e.removeAttribute("transform")}else if(e instanceof SVGCircleElement||e instanceof SVGRectElement||e instanceof SVGEllipseElement||e instanceof SVGLineElement||e instanceof SVGPolygonElement||e instanceof SVGPolylineElement||e instanceof SVGPathElement){var s,l=function(e,t){if(!e)return;for(var n=document.createElementNS(e.ownerSVGElement.namespaceURI,"path"),r=["requiredFeatures","requiredExtensions","systemLanguage","id","xml:base","xml:lang","xml:space","onfocusin","onfocusout","onactivate","onclick","onmousedown","onmouseup","onmouseover","onmousemove","onmouseout","onload","alignment-baseline","baseline-shift","clip","clip-path","clip-rule","color","color-interpolation","color-interpolation-filters","color-profile","color-rendering","cursor","direction","display","dominant-baseline","enable-background","fill","fill-opacity","fill-rule","filter","flood-color","flood-opacity","font-family","font-size","font-size-adjust","font-stretch","font-style","font-variant","font-weight","glyph-orientation-horizontal","glyph-orientation-vertical","image-rendering","kerning","letter-spacing","lighting-color","marker-end","marker-mid","marker-start","mask","opacity","overflow","pointer-events","shape-rendering","stop-color","stop-opacity","stroke","stroke-dasharray","stroke-dashoffset","stroke-linecap","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke-width","text-anchor","text-decoration","text-rendering","unicode-bidi","visibility","word-spacing","writing-mode","class","style","externalResourcesRequired","transform","d","pathLength"],a=0,i=r.length;a<i;a++){var o,s=r[a];(o=e.getAttribute(s))&&n.setAttribute(s,o)}var l="",c=function(e){return!("number"!=typeof e||e==1/0||e<0)},u=1.81,h=e.tagName;switch(h){case"ellipse":case"circle":var p=+e.getAttribute("rx"),f=+e.getAttribute("ry"),d=+e.getAttribute("cx"),m=+e.getAttribute("cy");"circle"==h&&(p=f=+e.getAttribute("r")),l+=Ot([["M",d-p,m],["C",d-p,m-f/u,d-p/u,m-f,d,m-f],["C",d+p/u,m-f,d+p,m-f/u,d+p,m],["C",d+p,m+f/u,d+p/u,m+f,d,m+f],["C",d-p/u,m+f,d-p,m+f/u,d-p,m],["Z"]]);break;case"path":l=e.getAttribute("d");break;case"line":var v=e.getAttribute("x1"),g=e.getAttribute("y1");x2=e.getAttribute("x2"),y2=e.getAttribute("y2"),l="M"+v+","+g+"L"+x2+","+y2;break;case"polyline":l="M"+e.getAttribute("points");break;case"polygon":l="M"+e.getAttribute("points")+"Z";break;case"rect":p=+e.getAttribute("rx"),f=+e.getAttribute("ry");var _=e.getBBox(),y=_.x,b=_.y,x=_.width,E=_.height;if(c(p)||c(f)?c(p)&&!c(f)?f=p:c(f)&&!c(p)?p=f:(p>x/2&&(p=x/2),f>E/2&&(f=E/2)):p=f=0,p||f)if(t)l+=Ot([["M",y+p,b],["H",y+x-p],["A",p,f,0,0,1,y+x,b+f],["V",b+E-f],["A",p,f,0,0,1,y+x-p,b+E],["H",y+p],["A",p,f,0,0,1,y,b+E-f],["V",b+f],["A",p,f,0,0,1,y+p,b]]);else{f||(f=p),l+=Ot([["M",y,b+f],["C",y,b+f/(u=2.19),y+p/u,b,y+p,b],["L",y+x-p,b],["C",y+x-p/u,b,y+x,b+f/u,y+x,b+f],["L",y+x,b+E-f],["C",y+x,b+E-f/u,y+x-p/u,b+E,y+x-p,b+E],["L",y+p,b+E],["C",y+p/u,b+E,y,b+E-f/u,y,b+E-f],["L",y,b+f],["Z"]])}else l+=Ot([["M",y,b],["L",y+x,b],["L",y+x,b+E],["L",y,b+E],["L",y,b],["Z"]])}l&&n.setAttribute("d",l);return e.parentNode.replaceChild(n,e),n}(e,r);if(!l||""==l.getAttribute(u))return"M 0 0";a||0===a?a>15?a=15:a<0&&(a=0):a=!1;var c=l,u=c.getAttribute("d").trim();if(t)h=s=Yt(u);else{var h=s=Gt(u);s=Kt(s)}var p,f,d=c.ownerSVGElement,m=c.getTransformToElement(d),v=(i=0,s.length),g="",_="",y=0,b=0,x=[],E=d.createSVGPoint(),w={},C=0,S=0;for(w.x=null,w.y=null;i<v;i++){if(g=s[i][0].toUpperCase(),_=h[i][0],x[i]=[],x[i][0]=s[i][0],"A"==g)y=s[i][6],b=s[i][7],E.x=s[i][6],E.y=s[i][7],x[i]=Nt(s[i][1],s[i][2],s[i][3],s[i][4],s[i][5],E,m),x[i][1]=x[i][1],x[i][2]=x[i][2],x[i][3]=x[i][3],x[i][6]=x[i][6],x[i][7]=x[i][7];else if("Z"!=g)for(p=1;p<s[i].length;p+=2)"V"==g?b=s[i][p]:"H"==g?y=s[i][p]:(y=s[i][p],b=s[i][p+1]),E.x=y,E.y=b,f=E.matrixTransform(m),"V"==g||"H"==g?(x[i][0]="L",x[i][p]=f.x,x[i][p+1]=f.y):(x[i][p]=f.x,x[i][p+1]=f.y);("Z"!=g&&null===w.x||"M"==g)&&(w.x=y,w.y=b),"Z"==g&&(y=w.x,b=w.y)}var k=0,O=0;for(w.x="",i=0;i<x.length;i++){if("A"==(_=h[i][0])||"M"==_||"L"==_||"C"==_||"S"==_||"Q"==_||"T"==_||"H"==_||"V"==_){var M=N=x[i].length;if("A"==_)x[i][6]=T(x[i][6]),x[i][7]=T(x[i][7]);else for(M--;--M;)x[i][M]=T(x[i][M]);C=x[i][N-2],S=x[i][N-1]}else if("a"==_)k=x[i][6],O=x[i][7],x[i][0]=_,x[i][6]=T(x[i][6]-C),x[i][7]=T(x[i][7]-S),C=k,S=O;else if("m"==_||"l"==_||"c"==_||"s"==_||"q"==_||"t"==_||"h"==_||"v"==_){var N=x[i].length;for(k=x[i][N-2],O=x[i][N-1],p=1;p<N;p+=2)x[i][0]="h"==_||"v"==_?"l":_,x[i][p]=T(x[i][p]-C),x[i][p+1]=T(x[i][p+1]-S);C=k,S=O}("z"!=_.toLowerCase()&&""==w.x||"m"==_.toLowerCase())&&(w.x=C,w.y=S),"z"==_.toLowerCase()&&(C=w.x,S=w.y)}n&&(x=Kt(x)),l.setAttribute("d",Ot(x)),l.removeAttribute("transform")}function T(e){return!1!==a?Math.round(e*Math.pow(10,a))/Math.pow(10,a):e}}function Nt(e,t,n,r,a,i,o,s){function l(e){return Math.abs(e)<1e-16}var c,u,h,p,f,d,m,v,g,_,y,b=[];if(c=e,u=t,h=n*=Math.PI/180,p=parseFloat(Math.sin(h)),f=parseFloat(Math.cos(h)),b[0]=o.a*+c*f+o.c*c*p,b[1]=o.b*+c*f+o.d*c*p,b[2]=o.a*-u*p+o.c*u*f,b[3]=o.b*-u*p+o.d*u*f,g=(d=b[0]*b[0]+b[2]*b[2])-(v=b[1]*b[1]+b[3]*b[3]),l(m=2*(b[0]*b[1]+b[2]*b[3])))n=0,_=d,y=v;else if(l(g))_=d+.5*m,y=d-.5*m,n=Math.PI/4;else{var x=1+m*m/(g*g);_=.5*(d+v+(x=x<0?0:Math.sqrt(x))*g),y=.5*(d+v-x*g),n=.5*Math.atan2(m,g)}return _=_<0?0:Math.sqrt(_),y=y<0?0:Math.sqrt(y),g<=0?(t=_,e=y):(t=y,e=_),o.a*o.d-o.b*o.c<0&&(a=a?0:1),i=i.matrixTransform(o),["A",e,t,n=180*n/Math.PI,r,a,i.x,i.y]}var Tt={},It="hasOwnProperty",Rt=String,At={NaN:1,Infinity:1,"-Infinity":1},Lt=Rt.prototype.toLowerCase,Dt=Rt.prototype.toUpperCase,$t=Object.prototype.toString,Pt="concat",Vt=Math,jt=Vt.max,Ft=(Vt.min,Vt.abs,Vt.pow,Vt.PI),zt=(Vt.round,parseFloat),Bt=(parseInt,kt=/,?([achlmqrstvxz]),?/gi,/([achlmrqstvz])[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029,]*((-?\d*\.?\d*(?:e[\-+]?\d+)?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*)+)/gi),Wt=/(-?\d*\.?\d*(?:e[\-+]?\d+)?)[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*,?[\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029]*/gi;Tt.is=function(e,t){return"finite"==(t=Lt.call(t))?!At[It](+e):"array"==t?e instanceof Array:"null"==t&&null===e||t==St(e)&&null!==e||"object"==t&&e===Object(e)||"array"==t&&Array.isArray&&Array.isArray(e)||$t.call(e).slice(8,-1).toLowerCase()==t},Tt._path2string=function(){return this.join(",").replace(kt,"$1")};var Ut=function(e){var t=function e(t){if(Object(t)!==t)return t;var n=new t.constructor;for(var r in t)t[It](r)&&(n[r]=e(t[r]));return n}(e);return t.toString=Tt._path2string,t},Ht=function e(t){var n=e.ps=e.ps||{};return n[t]?n[t].sleep=100:n[t]={sleep:100},setTimeout((function(){for(var e in n)n[It](e)&&e!=t&&(n[e].sleep--,!n[e].sleep&&delete n[e])})),n[t]};function qt(e,t){for(var n=[],r=0,a=e.length;a-2*!t>r;r+=2){var i=[{x:+e[r-2],y:+e[r-1]},{x:+e[r],y:+e[r+1]},{x:+e[r+2],y:+e[r+3]},{x:+e[r+4],y:+e[r+5]}];t?r?a-4==r?i[3]={x:+e[0],y:+e[1]}:a-2==r&&(i[2]={x:+e[0],y:+e[1]},i[3]={x:+e[2],y:+e[3]}):i[0]={x:+e[a-2],y:+e[a-1]}:a-4==r?i[3]=i[2]:r||(i[0]={x:+e[r],y:+e[r+1]}),n.push(["C",(-i[0].x+6*i[1].x+i[2].x)/6,(-i[0].y+6*i[1].y+i[2].y)/6,(i[1].x+6*i[2].x-i[3].x)/6,(i[1].y+6*i[2].y-i[3].y)/6,i[2].x,i[2].y])}return n}var Gt=function(e){if(!e)return null;var t=Ht(e);if(t.arr)return Ut(t.arr);var n={a:7,c:6,h:1,l:2,m:2,r:4,q:4,s:4,t:2,v:1,z:0},r=[];return Tt.is(e,"array")&&Tt.is(e[0],"array")&&(r=Ut(e)),r.length||Rt(e).replace(Bt,(function(e,t,a){var i=[],o=t.toLowerCase();if(a.replace(Wt,(function(e,t){t&&i.push(+t)})),"m"==o&&i.length>2&&(r.push([t][Pt](i.splice(0,2))),o="l",t="m"==t?"l":"L"),"r"==o)r.push([t][Pt](i));else for(;i.length>=n[o]&&(r.push([t][Pt](i.splice(0,n[o]))),n[o]););})),r.toString=Tt._path2string,t.arr=Ut(r),r};var Kt=Jt((function(e){if(Tt.is(e,"array")&&Tt.is(e&&e[0],"array")||(e=Gt(e)),!e||!e.length)return[["M",0,0]];var t=[],n=0,r=0,a=0,i=0,o=0;"M"==e[0][0]&&(a=n=+e[0][1],i=r=+e[0][2],o++,t[0]=["M",n,r]);for(var s,l,c=3==e.length&&"M"==e[0][0]&&"R"==e[1][0].toUpperCase()&&"Z"==e[2][0].toUpperCase(),u=o,h=e.length;u<h;u++){if(t.push(s=[]),(l=e[u])[0]!=Dt.call(l[0]))switch(s[0]=Dt.call(l[0]),s[0]){case"A":s[1]=l[1],s[2]=l[2],s[3]=l[3],s[4]=l[4],s[5]=l[5],s[6]=+(l[6]+n),s[7]=+(l[7]+r);break;case"V":s[1]=+l[1]+r;break;case"H":s[1]=+l[1]+n;break;case"R":for(var p=[n,r][Pt](l.slice(1)),f=2,d=p.length;f<d;f++)p[f]=+p[f]+n,p[++f]=+p[f]+r;t.pop(),t=t[Pt](qt(p,c));break;case"M":a=+l[1]+n,i=+l[2]+r;default:for(f=1,d=l.length;f<d;f++)s[f]=+l[f]+(f%2?n:r)}else if("R"==l[0])p=[n,r][Pt](l.slice(1)),t.pop(),t=t[Pt](qt(p,c)),s=["R"][Pt](l.slice(-2));else for(var m=0,v=l.length;m<v;m++)s[m]=l[m];switch(s[0]){case"Z":n=a,r=i;break;case"H":n=s[1];break;case"V":r=s[1];break;case"M":a=s[s.length-2],i=s[s.length-1];default:n=s[s.length-2],r=s[s.length-1]}}return t.toString=Tt._path2string,t}));function Jt(e,t,n){return function r(){var a=Array.prototype.slice.call(arguments,0),i=a.join("␀"),o=r.cache=r.cache||{},s=r.count=r.count||[];if(o.hasOwnProperty(i)){for(var l=0,c=s.length;l<c;l++)s[l]===i&&s.push(s.splice(l,1)[0]);return n?n(o[i]):o[i]}return s.length>=1e3&&delete o[s.shift()],s.push(i),o[i]=e.apply(t,a),n?n(o[i]):o[i]}}var Qt=function(e,t,n,r){return[e,t,n,r,n,r]},Xt=function(e,t,n,r,a,i){return[1/3*e+2/3*n,1/3*t+2/3*r,1/3*a+2/3*n,1/3*i+2/3*r,a,i]},Zt=Jt((function(e,t,n,r,a,i,o,s,l,c){var u,h=120*Ft/180,p=Ft/180*(+a||0),f=[],d=Jt((function(e,t,n){return{x:e*Math.cos(n)-t*Math.sin(n),y:e*Math.sin(n)+t*Math.cos(n)}}));if(c)w=c[0],C=c[1],x=c[2],E=c[3];else{e=(u=d(e,t,-p)).x,t=u.y,s=(u=d(s,l,-p)).x,l=u.y;Math.cos(Ft/180*a),Math.sin(Ft/180*a);var m=(e-s)/2,v=(t-l)/2,g=m*m/(n*n)+v*v/(r*r);g>1&&(n*=g=Math.sqrt(g),r*=g);var _=n*n,y=r*r,b=(i==o?-1:1)*Math.sqrt(Math.abs((_*y-_*v*v-y*m*m)/(_*v*v+y*m*m))),x=b*n*v/r+(e+s)/2,E=b*-r*m/n+(t+l)/2,w=Math.asin(((t-E)/r).toFixed(9)),C=Math.asin(((l-E)/r).toFixed(9));(w=e<x?Ft-w:w)<0&&(w=2*Ft+w),(C=s<x?Ft-C:C)<0&&(C=2*Ft+C),o&&w>C&&(w-=2*Ft),!o&&C>w&&(C-=2*Ft)}var S=C-w;if(Math.abs(S)>h){var k=C,O=s,M=l;C=w+h*(o&&C>w?1:-1),s=x+n*Math.cos(C),l=E+r*Math.sin(C),f=Zt(s,l,n,r,a,0,o,O,M,[C,k,x,E])}S=C-w;var N=Math.cos(w),T=Math.sin(w),I=Math.cos(C),R=Math.sin(C),A=Math.tan(S/4),L=4/3*n*A,D=4/3*r*A,$=[e,t],P=[e+L*T,t-D*N],V=[s+L*R,l-D*I],j=[s,l];if(P[0]=2*$[0]-P[0],P[1]=2*$[1]-P[1],c)return[P,V,j].concat(f);for(var F=[],z=0,B=(f=[P,V,j].concat(f).join().split(",")).length;z<B;z++)F[z]=z%2?d(f[z-1],f[z],p).y:d(f[z],f[z+1],p).x;return F})),Yt=Jt((function(e,t){var n=!t&&Ht(e);if(!t&&n.curve)return Ut(n.curve);for(var r=Kt(e),a=t&&Kt(t),i={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},o={x:0,y:0,bx:0,by:0,X:0,Y:0,qx:null,qy:null},s=function(e,t,n){var r,a;if(!e)return["C",t.x,t.y,t.x,t.y,t.x,t.y];switch(!(e[0]in{T:1,Q:1})&&(t.qx=t.qy=null),e[0]){case"M":t.X=e[1],t.Y=e[2];break;case"A":e=["C"][Pt](Zt.apply(0,[t.x,t.y][Pt](e.slice(1))));break;case"S":"C"==n||"S"==n?(r=2*t.x-t.bx,a=2*t.y-t.by):(r=t.x,a=t.y),e=["C",r,a][Pt](e.slice(1));break;case"T":"Q"==n||"T"==n?(t.qx=2*t.x-t.qx,t.qy=2*t.y-t.qy):(t.qx=t.x,t.qy=t.y),e=["C"][Pt](Xt(t.x,t.y,t.qx,t.qy,e[1],e[2]));break;case"Q":t.qx=e[1],t.qy=e[2],e=["C"][Pt](Xt(t.x,t.y,e[1],e[2],e[3],e[4]));break;case"L":e=["C"][Pt](Qt(t.x,t.y,e[1],e[2]));break;case"H":e=["C"][Pt](Qt(t.x,t.y,e[1],t.y));break;case"V":e=["C"][Pt](Qt(t.x,t.y,t.x,e[1]));break;case"Z":e=["C"][Pt](Qt(t.x,t.y,t.X,t.Y))}return e},l=function(e,t){if(e[t].length>7){e[t].shift();for(var n=e[t];n.length;)u[t]="A",a&&(h[t]="A"),e.splice(t++,0,["C"][Pt](n.splice(0,6)));e.splice(t,1),m=jt(r.length,a&&a.length||0)}},c=function(e,t,n,i,o){e&&t&&"M"==e[o][0]&&"M"!=t[o][0]&&(t.splice(o,0,["M",i.x,i.y]),n.bx=0,n.by=0,n.x=e[o][1],n.y=e[o][2],m=jt(r.length,a&&a.length||0))},u=[],h=[],p="",f="",d=0,m=jt(r.length,a&&a.length||0);d<m;d++){r[d]&&(p=r[d][0]),"C"!=p&&(u[d]=p,d&&(f=u[d-1])),r[d]=s(r[d],i,f),"A"!=u[d]&&"C"==p&&(u[d]="C"),l(r,d),a&&(a[d]&&(p=a[d][0]),"C"!=p&&(h[d]=p,d&&(f=h[d-1])),a[d]=s(a[d],o,f),"A"!=h[d]&&"C"==p&&(h[d]="C"),l(a,d)),c(r,a,i,o,d),c(a,r,o,i,d);var v=r[d],g=a&&a[d],_=v.length,y=a&&g.length;i.x=v[_-2],i.y=v[_-1],i.bx=zt(v[_-4])||i.x,i.by=zt(v[_-3])||i.y,o.bx=a&&(zt(g[y-4])||o.x),o.by=a&&(zt(g[y-3])||o.y),o.x=a&&g[y-2],o.y=a&&g[y-1]}return a||(n.curve=Ut(r)),a?[r,a]:r}),null,Ut);var en=Pe({props:["value"],computed:{optionsArr:function(){return["circle","rect","roundRect","triangle","diamond","pin","arrow","none"]}},data:function(){return{innerValue:this.value}},watch:{value:function(e){this.innerValue=e}},methods:{onValueChange:function(){this.$emit("change",this.innerValue)},chooseFile:function(){var e=this,t=document.createElement("input");t.type="file",t.accept=".jpg, .jpeg, .png, .svg",t.addEventListener("change",(function(t){var n=t.target.files[0];if(n)if(n.name.endsWith(".svg")){var r=new FileReader;r.addEventListener("load",(function(){var t=function(e){var t=(new DOMParser).parseFromString(e,"text/xml");for(9===t.nodeType&&(t=t.firstChild);"svg"!==t.nodeName.toLowerCase()||1!==t.nodeType;)t=t.nextSibling;return t}(r.result);try{Mt(t)}catch(e){console.error("Unexpected error happens when handling the SVG."),console.error(e.toString())}for(var n=t.querySelectorAll("path"),a=[],i=0;i<n.length;i++)a.push(n[i].getAttribute("d"));e.$emit("change","path://"+a.join(" "))})),r.readAsText(n)}else{var a=new FileReader;a.addEventListener("load",(function(){e.$emit("change","image://"+a.result)})),a.readAsDataURL(n)}})),t.click()}}},Ct,[],!1,null,null,null);en.options.__file="src/controls/ControlIcon.vue";var tn={boolean:Ye,color:Qe,number:rt,vector:st,enum:pt,angle:rt,percent:vt,percentvector:bt,text:wt,icon:en.exports},nn={boolean:function(){return!1},color:function(){return null},number:function(){return 0},angle:function(){return 0},percent:function(){return"50"},enum:function(e){return e.options.split(",")[0].trim()},vector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return 0})).join(",")},percentvector:function(e){if(!e.dims)throw new Error("Must specify dims in vector");return e.dims.split(",").map((function(e){return"50%"})).join(",")}};var rn={name:"OptionControl",props:["controlConfig","optionPath"],data:function(){return{shared:ke}},computed:{uiComponent:function(){return tn[this.controlConfig.type]},uiAttrs:function(){return function(e){var t={};for(var n in e)e.hasOwnProperty(n)&&"type"!==n&&"default"!==n&&(t[n]=e[n]);return t}(this.controlConfig)},defaultValue:function(){var e=this.controlConfig;return null!=e.default?e.default:nn[e.type]&&nn[e.type](e)}},methods:{onValueChange:function(e){this.shared.cleanMode=this.controlConfig.clean,this.shared.currentExampleOption&&(this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.optionPath,e)))}}},an=(n(39),Pe(rn,qe,[],!1,null,null,null));an.options.__file="src/components/OptionControl.vue";var on={name:"DocContentItemCard",props:["nodeData","descMap","maxDepth","depth"],components:{PropertiesList:He,OptionControl:an.exports},data:function(){return{manualExpanded:null,enableUIControl:!1,shared:ke}},watch:{enableUIControl:function(e){e?(this.shared.showOptionExample||this.$emit("scroll-to-self",this.nodeData.path,300,100),this.shared.showOptionExample=!0):this.shared.currentExampleOption=Object.freeze(Te(this.shared.currentExampleOption,this.nodeData.path,void 0))},"shared.currentExampleName":function(e,t){e&&t&&(this.enableUIControl=!1)}},computed:{itemId:function(){return fe(this.nodeData.path)},expanded:function(){return!this.isLeaf&&(null!=this.manualExpanded?this.manualExpanded:this.depth<2||ke.currentPath.indexOf(this.nodeData.path)>=0)},isLeaf:function(){return!(this.nodeData.children&&this.nodeData.children.length)},supportsExpandable:function(){return this.depth+1<=this.maxDepth&&!this.isLeaf},desc:function(){var e=this.descMap[this.nodeData.path];return e&&e.desc},uiControl:function(){var e=this.descMap[this.nodeData.path];return e&&e.uiControl},parentPath:function(){for(var e=this.nodeData.path.split("."),t=[],n="",r=0;r<e.length-1;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r],link:n});return t},baseName:function(){return{text:this.nodeData.path.split(".").pop(),link:this.nodeData.path}}},methods:{bubbleEventToggleExapndedEvent:function(){this.$emit("toggle-expanded")},toggleExpanded:function(){this.manualExpanded=!this.expanded,this.$emit("toggle-expanded")},toggleUIControl:function(){this.enableUIControl=!this.enableUIControl},bubbleScrollToSelfEvent:function(e,t,n){this.$emit("scroll-to-self",e,t,n)}}},sn=(n(40),Pe(on,ze,[],!1,null,null,null));sn.options.__file="src/components/DocContentItemCard.vue";var ln=sn.exports,cn=n(24),un=n.n(cn),hn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:e.shared.computedOptionExampleLayout+"-layout",attrs:{id:"example-panel"}},[n("h2",[e._v(e._s(e.$t("example.title")))]),e._v(" "),n("p",{staticClass:"intro"},[e._v(e._s(e.shared.allOptionExamples?e.$t("example.intro"):e.$t("example.noExample")))]),e._v(" "),e.shared.currentExampleOption?n("div",{staticClass:"preview-and-code"},[n("div",{staticClass:"preview-main"}),e._v(" "),e._m(0),e._v(" "),e.hasError?n("el-alert",{attrs:{title:e.$t("example.setOptionError"),type:"error"}}):e._e()],1):e._e(),e._v(" "),n("div",{staticClass:"toolbar"},[e.shared.allOptionExamples?n("el-select",{staticClass:"example-list",attrs:{size:"mini","popper-append-to-body":!1},model:{value:e.shared.currentExampleName,callback:function(t){e.$set(e.shared,"currentExampleName",t)},expression:"shared.currentExampleName"}},e._l(e.shared.allOptionExamples,(function(t){return n("el-option",{key:t.name,attrs:{value:t.name,label:"en"===e.shared.locale?t["title-en"]:t.title}})})),1):e._e(),e._v(" "),e.shared.currentExampleOption?n("el-button",{attrs:{type:"primary",icon:"el-icon-refresh",size:"mini",title:e.$t("example.refresh")},on:{click:e.refreshForce}}):e._e(),e._v(" "),n("el-button",{directives:[{name:"popover",rawName:"v-popover:changeLayoutPopover",arg:"changeLayoutPopover"}],staticStyle:{"margin-left":"0"},attrs:{type:"primary",icon:"el-icon-s-operation",size:"mini",title:e.$t("example.changeLayout")}}),e._v(" "),n("el-button",{attrs:{size:"mini",circle:"",icon:"el-icon-close"},on:{click:e.closeExamplePanel}})],1),e._v(" "),n("el-popover",{ref:"changeLayoutPopover",attrs:{placement:"bottom",trigger:"click"},model:{value:e.showChangeLayoutPopover,callback:function(t){e.showChangeLayoutPopover=t},expression:"showChangeLayoutPopover"}},[n("div",{staticClass:"example-change-layout"},[n("div",{staticClass:"layout-title"},[n("i",{staticClass:"el-icon-s-operation"}),e._v(e._s(e.$t("example.changeLayout")))]),e._v(" "),n("div",{staticClass:"layout-mode"},[n("el-radio-group",{attrs:{size:"mini"},on:{change:e.changeLayout},model:{value:e.shared.optionExampleLayout,callback:function(t){e.$set(e.shared,"optionExampleLayout",t)},expression:"shared.optionExampleLayout"}},e._l(e.optionExampleLayouts,(function(t){return n("el-radio-button",{key:t,attrs:{label:t}},[e._v(e._s(e.$t("example.layout."+t)))])})),1)],1)])])],1)};hn._withStripped=!0;var pn=n(25),fn=n.n(pn),dn=(n(41),n(42),n(26)),mn=n.n(dn),vn=n(19),gn=n.n(vn);function _n(e,t){return e===t}function yn(e,t,n,r){e.push(function(e,t,n){var r={cmd:e,idx:t};return"="===e&&(r.idx1=n),r}(t,n,r))}var bn=Math.abs;function xn(e,t,n,r,a,i,o,s){var l,c,u,h=n>r,p=a>i,f=bn(r-n),d=bn(i-a);for(c=0;c<=f;c++)for(u=0;u<=d;u++)if(0===c)s[u]=u;else if(0===u)l=s[u],s[u]=c;else{var m=l+(o(e[h?n-c:c-1+n],t[p?a-u:u-1+a])?0:2),v=s[u]+1,g=s[u-1]+1;l=s[u],s[u]=m<v?m:v,g<s[u]&&(s[u]=g)}return s}var En,wn=function(e,t,n){var r,a;n=n||_n;var i=e.length,o=t.length,s=Math.min(i,o),l=[];for(r=0;r<s&&n(e[r],t[r]);r++)yn(l,"=",r,r);for(a=0;a<s&&n(e[i-a-1],t[o-a-1]);a++);if(i-a>=r||o-a>=r){var c=function e(t,n,r,a,i,o,s,l,c){var u,h,p=[],f=a-r,d=o-i;if(f)if(d)if(1===f){var m=t[r],v=!1;for(h=0;h<d;h++)s(m,n[h+i])&&!v?(v=!0,yn(p,"=",r,h+i)):yn(p,"+",h+i);v||yn(p,"-",r)}else if(1===d){var g=n[i];v=!1;for(u=0;u<f;u++)s(g,t[u+r])&&!v?(v=!0,yn(p,"=",u+r,i)):yn(p,"-",u+r);v||yn(p,"+",i)}else{var _=(f/2|0)+r;xn(t,n,r,_,i,o,s,l),xn(t,n,a,_+1,o,i,s,c);var y,b=1/0,x=0;for(h=0;h<=d;h++)(y=l[h]+c[d-h])<b&&(b=y,x=h);p=e(t,n,r,_,i,x+=i,s,l,c);var E=e(t,n,_,a,x,o,s,l,c);for(u=0;u<E.length;u++)p.push(E[u])}else for(u=0;u<f;u++)yn(p,"-",u+r);else for(h=0;h<d;h++)yn(p,"+",h+i);return p}(e,t,r,i-a,r,o-a,n,[],[]);for(r=0;r<c.length;r++)l.push(c[r]);for(r=0;r<a;r++)yn(l,"=",i-a+r,o-a+r)}return l};function Cn(e,t){var n=this;if(this.shared.currentExampleName!==this.lastUpdateExampleName)return this.lastUpdateExampleName=this.shared.currentExampleName,void this.refreshForce();var r=this.$el.querySelector(".preview-main");if(r){if(this.hasError=!1,"undefined"==typeof echarts)(En||(En=new Promise((function(e){var t=document.createElement("script");t.src="https://cdn.jsdelivr.net/npm/echarts@4.8.0/dist/echarts.min.js",t.async=!0,t.onload=function(){e(),En=null},document.body.appendChild(t)})))).then((function(){n.echartsInstance||(n.chartInstance=echarts.init(r)),n.shared.cleanMode&&n.chartInstance.clear(),n.chartInstance.setOption(e,!0)}));else{this.echartsInstance||(this.chartInstance=echarts.init(r));try{this.shared.cleanMode&&this.chartInstance.clear(),this.chartInstance.setOption(e,!0)}catch(e){console.error(e),this.hasError=!0}}if(this.cmInstance){var a=this.cmInstance.getValue(),i=this.formattedOptionCodeStr;this.oldHighlightedLines&&this.oldHighlightedLines.forEach((function(e){n.cmInstance.removeLineClass(e,"wrap","option-changed")})),t?(this.cmInstance.setValue(i),this.oldHighlightedLines=[]):this.oldHighlightedLines=function(e,t,n){for(var r=e.split(/\n/),a=t.split(/\n/),i=wn(r,a),o=[],s=i.length,l=s-1;l>=0;l--){var c=i[l];"-"===c.cmd&&n.replaceRange("",{line:c.idx,ch:0},{line:c.idx+1,ch:0})}for(var u=0;u<s;u++){var h=i[u];"+"===h.cmd&&(n.replaceRange(a[h.idx]+"\n",{line:h.idx,ch:0}),o.push(h.idx))}return o.forEach((function(e){n.addLineClass(e,"wrap","option-changed")})),s&&setTimeout((function(){n.scrollIntoView({line:o[0],ch:0},n.getWrapperElement().clientHeight-50)}),20),o}(a,i,this.cmInstance)}else this.cmInstance=fn()(this.$el.querySelector(".codemirror-main"),{value:this.formattedOptionCodeStr,mode:"javascript",theme:"dracula",readOnly:!0});this.lastUpdateExampleName=this.shared.currentExampleName}}var Sn={data:function(){return{shared:ke,hasError:!1,lastUpdateExampleName:"",oldHighlightedLines:[],showChangeLayoutPopover:!1,optionExampleLayouts:xe}},mounted:function(){this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize(),this.shared.currentExampleOption&&this.updateOptionThrottled(this.shared.currentExampleOption),this.shared.allOptionExamples?this.shared.currentExampleName=this.shared.allOptionExamples[0].name:this.shared.currentExampleName=""},destroyed:function(){this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),window.removeEventListener("resize",this.resize)},watch:{"shared.currentExampleOption":function(e){e&&this.updateOptionThrottled(e)},"shared.allOptionExamples":function(e){this.shared.currentExampleName=e?e[0].name:""},"shared.currentExampleName":function(e){this.changeExample(e)}},methods:{updateOption:Cn,updateOptionThrottled:gn()(Cn,300,{leading:!1}),resize:function(){var e=this.$el;e.querySelector(".preview-main");"right"!==this.shared.computedOptionExampleLayout?(e.style.height=.5*window.innerHeight-60+"px",e.style.width="auto"):(e.style.width=.45*e.parentNode.clientWidth+"px",e.style.height="auto"),this.chartInstance&&this.chartInstance.resize()},refreshForce:function(){this.shared.currentExampleOption&&(this.chartInstance&&(this.chartInstance.dispose(),this.chartInstance=null),this.updateOption(this.shared.currentExampleOption,!0))},closeExamplePanel:function(){this.shared.showOptionExample=!1},changeExample:function(e){var t=this.shared.allOptionExamples&&this.shared.allOptionExamples.find((function(t){return t.name===e}));if(!t)return this.shared.currentExampleOption=null,!1;var n=t.code;try{var r=new Function(n+"\n return option");this.shared.currentExampleOption=Object.freeze(r())}catch(e){console.error(e),console.log(n)}},changeLayout:function(e){var t=this;this.showChangeLayoutPopover=!1,Ee(e),this.$nextTick((function(){t.resize()}))}},computed:{optionCodeStr:function(){var e=JSON.stringify(this.shared.currentExampleOption,(function(e,t){return"function"==typeof t?"__functionstart__"+t.toString().replace(/\n/g,"__newline__")+"__functionend__":t}));return"option = ".concat(e)},formattedOptionCodeStr:function(){return mn.a.js(this.optionCodeStr.replace(/"(\w+)"\s*:/g,"$1:").replace(/"__functionstart__/g,"").replace(/__functionend__"/g,"").replace(/__newline__/g,"\n"),{indent_size:2})}}},kn=(n(43),Pe(Sn,hn,[function(){var e=this.$createElement,t=this._self._c||e;return t("div",{staticClass:"example-code"},[t("div",{staticClass:"codemirror-main"})])}],!1,null,null,null));kn.options.__file="src/components/LiveExample.vue";var On=kn.exports,Mn={components:{DocContentItemCard:ln,LiveExample:On},data:function(){return{loading:!1,pagePath:"",shared:ke,maxDepth:1/0,rootPageDescMap:{},pageOutline:{},pageDescMap:{}}},computed:{pageTitle:function(){return this.pagePath},pageId:function(){return fe(this.pagePath)},pageDesc:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.desc},pageExamples:function(){var e=this.rootPageDescMap[this.pagePath]||this.pageDescMap[this.pagePath];return e&&e.exampleBaseOptions||[]},pageDisplayOutline:function(){return this.shared.isMobile?_e(Oe()):this.pageOutline},showLiveExample:function(){return!this.shared.isMobile&&Me()},needScrollOffset:function(){return this.shared.showOptionExample&&!this.shared.isMobile&&"top"===this.shared.computedOptionExampleLayout}},created:function(){var e=this;ge("").then((function(t){e.rootPageDescMap=Object.freeze(t)})),this._lazyload=new un.a({elements_selector:"iframe",load_delay:300}),this.updateCurrentPath(this.shared.currentPath,!0),this.resize=this.resize.bind(this),window.addEventListener("resize",this.resize),this.resize()},destroyed:function(){window.removeEventListener("resize",this.resize)},methods:{resize:function(){var e=this;"auto"===this.shared.optionExampleLayout&&Ee("auto"),a.a.nextTick((function(){e.updateDocContentMargin()}))},updateLazyload:function(){var e=this;a.a.nextTick((function(){e._lazyload.update()}))},handleCardExpandToggle:function(){this.updateLazyload()},scrollTo:function(e,t,n){var r=this;setTimeout((function(){var n=ke.isMobile?100:20;r.needScrollOffset&&(n+=r.$refs.liveExample.$el.offsetHeight),Le()(document.getElementById(fe(e)),{time:t||400,align:{top:0,topOffset:n}})}),n||0)},updateCurrentPath:function(e,t){var n=this;if(e)if(_e(e)){var r,a,i=Oe();if(i!==this.pagePath)this.loading=!0,this.pagePath=i,(r=e,a=r.split(".")[0],de().then((function(){return se[a]||de()}))).then((function(r){return r.isRoot?n.maxDepth=0:n.shared.isMobile?n.maxDepth=1:n.maxDepth=1/0,ge(e).then((function(a){n.pageOutline=Object.freeze(Object.assign({},r));var i={},o=e.split(".")[0];for(var s in a)i[o+"."+s]=a[s];n.pageDescMap=Object.freeze(i),n.loading=!1,n.scrollTo(e,600,t?300:50),n.updateLazyload()}))})).catch((function(e){n.pageOutline={},n.loading=!1}));else this.scrollTo(e)}else Re(ye(e));else Re(ye())},openOptionExample:function(){this.shared.showOptionExample=!0},updateDocContentMargin:function(e){if((this.$refs.liveExample||e)&&(this.$refs.docContentDom.style.margin="",!e)){var t=this.shared.computedOptionExampleLayout;if("right"!==t){var n="margin"+t[0].toUpperCase()+t.slice(1),r=this.$refs.liveExample.$el.clientHeight;this.$refs.docContentDom.style[n]=r+"px"}}}},watch:{"shared.currentPath":function(e){var t=this;this.updateCurrentPath(e),a.a.nextTick((function(){t.updateDocContentMargin()}))},pageExamples:function(e){e&&e.length?this.shared.allOptionExamples=Object.freeze(e):this.shared.allOptionExamples=null},"shared.computedOptionExampleLayout":function(){var e=this;a.a.nextTick((function(){e.updateDocContentMargin()}))},"shared.showOptionExample":function(e){var t=this;a.a.nextTick((function(){t.updateDocContentMargin(!e)}))}}},Nn=(n(44),Pe(Mn,Fe,[],!1,null,null,null));Nn.options.__file="src/components/DocContent.vue";var Tn=Nn.exports,In=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search"},[n("el-autocomplete",{staticClass:"search-input",attrs:{"popper-class":"search-input-popper",size:"small","fetch-suggestions":e.searchOptions,debounce:200,placeholder:e.$t("search.placeholder")},on:{select:e.selectPath},nativeOn:{keyup:function(t){return!t.type.indexOf("key")&&e._k(t.keyCode,"enter",13,t.key,"Enter")?null:e.fuzzySearch(t)}},scopedSlots:e._u([{key:"default",fn:function(t){var r=t.item;return[n("div",{staticClass:"doc-path-suggestion-item"},[e._v(e._s(r.path))])]}}]),model:{value:e.queryString,callback:function(t){e.queryString=t},expression:"queryString"}},[e._v(" "),n("el-button",{attrs:{slot:"append",icon:"el-icon-search",type:"primary"},on:{click:e.fuzzySearch},slot:"append"})],1)],1)};In._withStripped=!0;var Rn={data:function(){return{queryString:ke.searchQuery,shared:ke}},computed:{},methods:{searchOptions:function(e,t){e?function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:50;return de().then((function(){for(var n=[],r=0;r<he.length;r++){if(n.length>=t)return n;var a=he[r];a.indexOf(e)>=0&&n.push(_e(a))}if(n.length<t){le||(le=new Uint8Array(he.length));for(var i=0,o=0;o<he.length;o++)le[o]=255*Object(ae.stringSimilarity)(he[o],e),le[o]>50&&i++;for(var s={},l=0;n.length<t&&i>0;){for(var c=0,u=void 0,h=0;h<le.length;h++)le[h]>c&&!s[h]&&(u=h,c=le[h]);if(c>50&&(s[u]=!0,n.push(_e(he[u])),i--),++l>200)break}}return n}))}(e,100).then((function(e){t(e)})):t([])},selectPath:function(e){this.shared.currentPath=e.path},fuzzySearch:function(){this.shared.searchQuery=this.queryString,Re("/search/"+this.shared.searchQuery)}}},An=(n(45),Pe(Rn,In,[],!1,null,null,null));An.options.__file="src/components/Search.vue";var Ln=An.exports,Dn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"doc-search-result"},[n("h3",[e._v(e._s(e.$t("search.resultTitle")))]),e._v(" "),n("el-input",{attrs:{"prefix-icon":"el-icon-search"},model:{value:e.shared.searchQuery,callback:function(t){e.$set(e.shared,"searchQuery",t)},expression:"shared.searchQuery"}}),e._v(" "),n("div",{staticClass:"result-summary"},[e._v("\n        "+e._s(e.$t("search.foundCountBrief").replace("${searchResultCount}",e.searchResultCount))+",\n        "),e.searchToken?n("span",{staticClass:"searching"},[e._v("\n            搜索中"),n("i",{staticClass:"el-icon-loading"})]):n("span",[e._v("\n            "+e._s(e.$t("search.displayCountBrief").replace("${displayResultCount}",e.displayResultCount))+"\n        ")])]),e._v(" "),e._l(e.searchResult,(function(t){return n("SearchResultItemCard",{key:t.path,attrs:{"item-data":t,"search-query":e.shared.searchQuery}})}))],2)};Dn._withStripped=!0;var $n=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:{"doc-search-result-item-card":!0,"needs-show-more":e.needsShowMoreDesc}},[n("h4",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}]},[n("a",{staticClass:"path",attrs:{href:"#"+e.itemData.path}},[e._v(e._s(e.itemData.path))])]),e._v(" "),e.itemData.similarPaths.length>0?n("div",{staticClass:"other-result"},e._l(e.itemData.similarPaths,(function(t){return n("div",{key:t},[n("a",{attrs:{href:"#"+t}},[e._v(e._s(t))])])})),0):e._e(),e._v(" "),n("div",{staticClass:"item-description"},[n("div",{directives:[{name:"mark",rawName:"v-mark",value:e.searchQuery,expression:"searchQuery"}],domProps:{innerHTML:e._s(e.itemData.content)}})]),e._v(" "),n("div",{staticClass:"show-more-button"},[n("el-button",{attrs:{icon:"el-icon-more",size:"mini"},on:{click:e.showMore}},[e._v(e._s(e.$t("search.showMore")))])],1)])};$n._withStripped=!0;var Pn={props:["itemData","searchQuery"],data:function(){return{needsShowMoreDesc:!0}},methods:{showMore:function(){this.needsShowMoreDesc=!1}},mounted:function(){var e=this;a.a.nextTick((function(){var t=e.$el.querySelector(".item-description");e.needsShowMoreDesc=t.scrollHeight!==t.clientHeight}))}},Vn=(n(46),Pe(Pn,$n,[],!1,null,null,null));function jn(e){var t=this;console.log("Searching, ",e),this.searchResult=[],this.searchResultCount=0,this.displayResultCount=0,this.static.searchResult.cache={},this.searchToken=Date.now()+"";var n,r,a=this.searchToken;(n=e,r=function(e){if(a===t.searchToken){if(!t.noLimit&&t.displayResultCount<=t.limitedResultCount){for(var n=0;n<e.length;n++){var r=e[n].text,i=t.static.searchResult.cache[r];if(i)i.similarPaths.push(e[n].path);else{var o=Object.freeze({path:e[n].path,content:e[n].content,similarPaths:[]});t.searchResult.push(o),t.static.searchResult.cache[r]=o}}t.displayResultCount+=e.length}t.searchResultCount+=e.length}},de().then((function(){return new Promise((function(e){var t=0;function a(){--t||e()}function i(e){var i=ve(e);i.indexer?r(i.indexer.search(n)):(t++,i.fetcher.then((function(){r(i.indexer.search(n)),a()})).catch((function(e){a()})))}for(var o in i(""),se)i(o);t||e()}))}))).then((function(){t.searchToken=""})).catch((function(){t.searchToken=""}))}Vn.options.__file="src/components/SearchResultItemCard.vue";var Fn={components:{SearchResultItemCard:Vn.exports},data:function(){return{searchResult:[],searchResultCount:0,displayResultCount:0,noLimit:!1,limitedResultCount:200,searchToken:"",static:Object.freeze({searchResult:{cache:null}}),shared:ke}},created:function(){this.updateSearchResultsImmediate(this.shared.searchQuery)},methods:{updateSearchResultsImmediate:jn,updateSearchResults:gn()(jn,500,{leading:!1})},watch:{"shared.searchQuery":function(e){this.updateSearchResults(e),Re("/search/"+this.shared.searchQuery)}}},zn=(n(47),Pe(Fn,Dn,[],!1,null,null,null));zn.options.__file="src/components/SearchResult.vue";var Bn=zn.exports,Wn=function(){var e=this.$createElement;return(this._self._c||e)("div")};Wn._withStripped=!0;var Un=Pe({},Wn,[],!1,null,null,null);Un.options.__file="src/components/Home.vue";var Hn=Un.exports,qn={props:["docType"],data:function(){return{shared:ke}},computed:{pagePath:function(){return Oe()}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,LiveExample:On,Home:Hn}},Gn=(n(48),Pe(qn,Z,[],!1,null,null,null));Gn.options.__file="src/App.vue";var Kn=Gn.exports,Jn=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{class:["ec-doc-mobile","ec-doc-"+e.shared.docType]},[n("div",{staticClass:"top-bar"},[n("div",{staticClass:"doc-type-nav"},[n("a",{class:{selected:"option"===e.shared.docType},attrs:{href:"option.html#title"}},[e._v(e._s(e.$t("nav.option")))]),e._v(" "),n("a",{class:{selected:"api"===e.shared.docType},attrs:{href:"api.html#echarts"}},[e._v(e._s(e.$t("nav.API")))]),e._v(" "),n("a",{class:{selected:"tutorial"===e.shared.docType},attrs:{href:"tutorial.html"}},[e._v(e._s(e.$t("nav.tutorial")))]),e._v(" "),n("a",{class:{selected:"option-gl"===e.shared.docType},attrs:{href:"option-gl.html"}},[e._v(e._s(e.$t("nav.optionGL")))])]),e._v(" "),n("div",{staticClass:"doc-mobile-toolbar"},[n("el-button",{staticClass:"open-nav",attrs:{icon:"el-icon-menu",size:"mini"},on:{click:e.showNav}}),e._v(" "),n("Search")],1)]),e._v(" "),n("el-drawer",{attrs:{direction:"ltr",size:"80%",visible:e.navShown,"show-close":!1},on:{"update:visible":function(t){e.navShown=t}}},[n("DocNav")],1),e._v(" "),n("transition",[e.shared.fuzzySearch?n("SearchResult"):n("DocContent",{key:e.pagePath})],1),e._v(" "),e.pagePathParts.length>1?n("div",{staticClass:"doc-breadcrumb"},e._l(e.pagePathParts,(function(t){return n("a",{key:t.link,attrs:{href:"#"+t.link}},[e._v(e._s(t.text))])})),0):e._e()],1)};Jn._withStripped=!0;var Qn={props:["docType"],data:function(){return{navShown:!1,shared:ke}},computed:{pagePath:function(){return Oe()},pagePathParts:function(){for(var e=this.pagePath.split("."),t=[],n="",r=0;r<e.length;r++)n+=n?"."+e[r]:e[r],t.push({text:e[r]+(r===e.length-1?"":"."),link:n});return t}},methods:{showNav:function(){this.navShown=!0}},watch:{"shared.currentPath":function(e){this.navShown=!1}},components:{DocNav:je,DocContent:Tn,Search:Ln,SearchResult:Bn,Home:Hn}},Xn=(n(49),Pe(Qn,Jn,[],!1,null,null,null));Xn.options.__file="src/AppMobile.vue";var Zn=Xn.exports,Yn=n(20),er=n.n(Yn),tr=n(27),nr=n.n(tr),rr=n(28),ar=n.n(rr);n(50);function ir(e){e.querySelectorAll("pre code").forEach((function(e){e.classList.contains("hljs")||er.a.highlightBlock(e)}))}er.a.registerLanguage("javascript",nr.a),er.a.registerLanguage("xml",ar.a),a.a.directive("highlight",{inserted:function(e){ir(e)},update:function(e){ir(e)}});var or=n(29),sr=n.n(or),lr=n(30),cr=n.n(lr);function ur(e,t){function n(){e.__markInstance.mark(t,{diacritics:!0,separateWordSearch:!0})}e.__markInstance?e.__markInstance.unmark({done:function(){n()}}):(e.__markInstance=new sr.a(e),n())}function hr(){window.innerWidth<600?ke.isMobile=!0:ke.isMobile=!1}a.a.directive("mark",{inserted:function(e,t){e.__doMarkDebounced=cr()(ur,500,{trailing:!0,leading:!1}),e.__doMarkDebounced(e,t.value)},update:function(e,t){e.__doMarkDebounced(e,t.value)}});var pr={en:{nav:{option:"Option",API:"API",tutorial:"Tutorial",optionGL:"GL",collapseAll:"Collapse All"},search:{placeholder:"Search document",resultTitle:"Search Result",showMore:"Show more",foundCountBrief:"Found ${searchResultCount} items",displayCountBrief:"${displayResultCount} displayed"},content:{properties:"Properties"},example:{title:"Preview",titleShort:"Preview",intro:"Try different values of the option and preview!",noExample:"No example available for current component.",tryDesc:"Try It",defaultColor:"Default Color",booleanDesc:"Enable",vectorSetSeparate:"SEPARATE",absoluteMode:"ABSOLUTE",percentMode:"PERCENT",inputPlaceholder:"Input to change the text content",builtin:"Builtin",upload:"Upload SVG or PNG",setOptionError:"Something Unexpected Happerns. Click refresh to try again!",refresh:"Refresh",close:"Close",changeLayout:"Change Layout",layout:{auto:"Auto",right:"Right",top:"Top",bottom:"Bottom"}}},zh:{nav:{option:"配置项",API:"API",tutorial:"教程",optionGL:"GL配置",collapseAll:"收起所有"},search:{placeholder:"搜索文档,回车查看更多结果",resultTitle:"文档搜索结果",showMore:"显示更多",foundCountBrief:"找到 ${searchResultCount} 条配置项",displayCountBrief:"显示 ${displayResultCount} 条"},content:{properties:"所有属性"},example:{title:"配置项效果预览",titleShort:"预览",intro:"调节控件可预览配置项不同取值的效果",noExample:"当前组件暂无可用示例",tryDesc:"试一试",defaultColor:"默认颜色",booleanDesc:"开启",vectorSetSeparate:"分别设置",absoluteMode:"绝对值",percentMode:"百分比",inputPlaceholder:"输入改变文本",builtin:"内置",upload:"上传 SVG 或 PNG",setOptionError:"发生了一些意料之外的错误,点击刷新再试试!",refresh:"刷新",close:"关闭",changeLayout:"切换布局",layout:{auto:"自动",right:"右侧",top:"顶部",bottom:"底部"}}}};function fr(e,t){window.addEventListener("resize",hr),hr();var n=t.cdnRoot||t.baseUrl;me(t.baseUrl,n,t.docType,t.version).then((function(){if(window.addEventListener("hashchange",(function(e){Ie()})),Ie(),ke.docType=t.docType,ke.locale=t.locale,"string"==typeof e&&(e=document.querySelector(e)),!e)throw new Error("Can't find el.");var n=document.createElement("div");e.appendChild(n);var r=new X({locale:t.locale,fallbackLocale:"en",messages:pr});new a.a({i18n:r,el:n,render:function(e){return console.log("iMobile: ",ke.isMobile),ke.isMobile?e(Zn):e(Kn)}})}))}}])}));
\ No newline at end of file
diff --git a/zh/js/spreadsheet/spreadsheet.js b/zh/js/spreadsheet/spreadsheet.js
index a83c139..e5dc9e3 100644
--- a/zh/js/spreadsheet/spreadsheet.js
+++ b/zh/js/spreadsheet/spreadsheet.js
@@ -91,7 +91,7 @@
 return n?a.length:a?t.error(e):V(e,l).slice(0)},T=t.compile=function(e,t){var n,o=[],i=[],r=z[e+" "];if(!r){for(t||(t=S(e)),n=t.length;n--;)r=m(t[n]),r[I]?o.push(r):i.push(r);r=z(e,v(i,o)),r.selector=e}return r},E=t.select=function(e,t,n,o){var i,r,s,a,u,d="function"==typeof e&&e,h=!o&&S(e=d.selector||e);if(n=n||[],1===h.length){if(r=h[0]=h[0].slice(0),r.length>2&&"ID"===(s=r[0]).type&&y.getById&&9===t.nodeType&&A&&b.relative[r[1].type]){if(!(t=(b.find.ID(s.matches[0].replace(ye,be),t)||[])[0]))return n;d&&(t=t.parentNode),e=e.slice(r.shift().value.length)}for(i=he.needsContext.test(e)?0:r.length;i--&&(s=r[i],!b.relative[a=s.type]);)if((u=b.find[a])&&(o=u(s.matches[0].replace(ye,be),ve.test(r[0].type)&&l(t.parentNode)||t))){if(r.splice(i,1),!(e=o.length&&c(r)))return X.apply(n,o),n;break}}return(d||T(e,h))(o,t,!A,n,ve.test(e)&&l(t.parentNode)||t),n},y.sortStable=I.split("").sort(Y).join("")===I,y.detectDuplicates=!!O,k(),y.sortDetached=i(function(e){return 1&e.compareDocumentPosition(x.createElement("div"))}),i(function(e){return e.innerHTML="<a href='#'></a>","#"===e.firstChild.getAttribute("href")})||r("type|href|height|width",function(e,t,n){return n?void 0:e.getAttribute(t,"type"===t.toLowerCase()?1:2)}),y.attributes&&i(function(e){return e.innerHTML="<input/>",e.firstChild.setAttribute("value",""),""===e.firstChild.getAttribute("value")})||r("value",function(e,t,n){return n||"input"!==e.nodeName.toLowerCase()?void 0:e.defaultValue}),i(function(e){return null==e.getAttribute("disabled")})||r(Q,function(e,t,n){var o;return n?void 0:!0===e[t]?t.toLowerCase():(o=e.getAttributeNode(t))&&o.specified?o.value:null}),t}(e);ie.find=ue,ie.expr=ue.selectors,ie.expr[":"]=ie.expr.pseudos,ie.unique=ue.uniqueSort,ie.text=ue.getText,ie.isXMLDoc=ue.isXML,ie.contains=ue.contains;var ce=ie.expr.match.needsContext,de=/^<(\w+)\s*\/?>(?:<\/\1>|)$/,he=/^.[^:#\[\.,]*$/;ie.filter=function(e,t,n){var o=t[0];return n&&(e=":not("+e+")"),1===t.length&&1===o.nodeType?ie.find.matchesSelector(o,e)?[o]:[]:ie.find.matches(e,ie.grep(t,function(e){return 1===e.nodeType}))},ie.fn.extend({find:function(e){var t,n=[],o=this,i=o.length;if("string"!=typeof e)return this.pushStack(ie(e).filter(function(){for(t=0;i>t;t++)if(ie.contains(o[t],this))return!0}));for(t=0;i>t;t++)ie.find(e,o[t],n);return n=this.pushStack(i>1?ie.unique(n):n),n.selector=this.selector?this.selector+" "+e:e,n},filter:function(e){return this.pushStack(o(this,e||[],!1))},not:function(e){return this.pushStack(o(this,e||[],!0))},is:function(e){return!!o(this,"string"==typeof e&&ce.test(e)?ie(e):e||[],!1).length}});var fe,pe=e.document,ge=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/;(ie.fn.init=function(e,t){var n,o;if(!e)return this;if("string"==typeof e){if(!(n="<"===e.charAt(0)&&">"===e.charAt(e.length-1)&&e.length>=3?[null,e,null]:ge.exec(e))||!n[1]&&t)return!t||t.jquery?(t||fe).find(e):this.constructor(t).find(e);if(n[1]){if(t=t instanceof ie?t[0]:t,ie.merge(this,ie.parseHTML(n[1],t&&t.nodeType?t.ownerDocument||t:pe,!0)),de.test(n[1])&&ie.isPlainObject(t))for(n in t)ie.isFunction(this[n])?this[n](t[n]):this.attr(n,t[n]);return this}if((o=pe.getElementById(n[2]))&&o.parentNode){if(o.id!==n[2])return fe.find(e);this.length=1,this[0]=o}return this.context=pe,this.selector=e,this}return e.nodeType?(this.context=this[0]=e,this.length=1,this):ie.isFunction(e)?void 0!==fe.ready?fe.ready(e):e(ie):(void 0!==e.selector&&(this.selector=e.selector,this.context=e.context),ie.makeArray(e,this))}).prototype=ie.fn,fe=ie(pe);var me=/^(?:parents|prev(?:Until|All))/,ve={children:!0,contents:!0,next:!0,prev:!0};ie.extend({dir:function(e,t,n){for(var o=[],i=e[t];i&&9!==i.nodeType&&(void 0===n||1!==i.nodeType||!ie(i).is(n));)1===i.nodeType&&o.push(i),i=i[t];return o},sibling:function(e,t){for(var n=[];e;e=e.nextSibling)1===e.nodeType&&e!==t&&n.push(e);return n}}),ie.fn.extend({has:function(e){var t,n=ie(e,this),o=n.length;return this.filter(function(){for(t=0;o>t;t++)if(ie.contains(this,n[t]))return!0})},closest:function(e,t){for(var n,o=0,i=this.length,r=[],s=ce.test(e)||"string"!=typeof e?ie(e,t||this.context):0;i>o;o++)for(n=this[o];n&&n!==t;n=n.parentNode)if(n.nodeType<11&&(s?s.index(n)>-1:1===n.nodeType&&ie.find.matchesSelector(n,e))){r.push(n);break}return this.pushStack(r.length>1?ie.unique(r):r)},index:function(e){return e?"string"==typeof e?ie.inArray(this[0],ie(e)):ie.inArray(e.jquery?e[0]:e,this):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(e,t){return this.pushStack(ie.unique(ie.merge(this.get(),ie(e,t))))},addBack:function(e){return this.add(null==e?this.prevObject:this.prevObject.filter(e))}}),ie.each({parent:function(e){var t=e.parentNode;return t&&11!==t.nodeType?t:null},parents:function(e){return ie.dir(e,"parentNode")},parentsUntil:function(e,t,n){return ie.dir(e,"parentNode",n)},next:function(e){return i(e,"nextSibling")},prev:function(e){return i(e,"previousSibling")},nextAll:function(e){return ie.dir(e,"nextSibling")},prevAll:function(e){return ie.dir(e,"previousSibling")},nextUntil:function(e,t,n){return ie.dir(e,"nextSibling",n)},prevUntil:function(e,t,n){return ie.dir(e,"previousSibling",n)},siblings:function(e){return ie.sibling((e.parentNode||{}).firstChild,e)},children:function(e){return ie.sibling(e.firstChild)},contents:function(e){return ie.nodeName(e,"iframe")?e.contentDocument||e.contentWindow.document:ie.merge([],e.childNodes)}},function(e,t){ie.fn[e]=function(n,o){var i=ie.map(this,t,n);return"Until"!==e.slice(-5)&&(o=n),o&&"string"==typeof o&&(i=ie.filter(o,i)),this.length>1&&(ve[e]||(i=ie.unique(i)),me.test(e)&&(i=i.reverse())),this.pushStack(i)}});var we=/\S+/g,ye={};ie.Callbacks=function(e){e="string"==typeof e?ye[e]||r(e):ie.extend({},e);var t,n,o,i,s,a,l=[],u=!e.once&&[],c=function(r){for(n=e.memory&&r,o=!0,s=a||0,a=0,i=l.length,t=!0;l&&i>s;s++)if(!1===l[s].apply(r[0],r[1])&&e.stopOnFalse){n=!1;break}t=!1,l&&(u?u.length&&c(u.shift()):n?l=[]:d.disable())},d={add:function(){if(l){var o=l.length;!function t(n){ie.each(n,function(n,o){var i=ie.type(o);"function"===i?e.unique&&d.has(o)||l.push(o):o&&o.length&&"string"!==i&&t(o)})}(arguments),t?i=l.length:n&&(a=o,c(n))}return this},remove:function(){return l&&ie.each(arguments,function(e,n){for(var o;(o=ie.inArray(n,l,o))>-1;)l.splice(o,1),t&&(i>=o&&i--,s>=o&&s--)}),this},has:function(e){return e?ie.inArray(e,l)>-1:!(!l||!l.length)},empty:function(){return l=[],i=0,this},disable:function(){return l=u=n=void 0,this},disabled:function(){return!l},lock:function(){return u=void 0,n||d.disable(),this},locked:function(){return!u},fireWith:function(e,n){return!l||o&&!u||(n=n||[],n=[e,n.slice?n.slice():n],t?u.push(n):c(n)),this},fire:function(){return d.fireWith(this,arguments),this},fired:function(){return!!o}};return d},ie.extend({Deferred:function(e){var t=[["resolve","done",ie.Callbacks("once memory"),"resolved"],["reject","fail",ie.Callbacks("once memory"),"rejected"],["notify","progress",ie.Callbacks("memory")]],n="pending",o={state:function(){return n},always:function(){return i.done(arguments).fail(arguments),this},then:function(){var e=arguments;return ie.Deferred(function(n){ie.each(t,function(t,r){var s=ie.isFunction(e[t])&&e[t];i[r[1]](function(){var e=s&&s.apply(this,arguments);e&&ie.isFunction(e.promise)?e.promise().done(n.resolve).fail(n.reject).progress(n.notify):n[r[0]+"With"](this===o?n.promise():this,s?[e]:arguments)})}),e=null}).promise()},promise:function(e){return null!=e?ie.extend(e,o):o}},i={};return o.pipe=o.then,ie.each(t,function(e,r){var s=r[2],a=r[3];o[r[1]]=s.add,a&&s.add(function(){n=a},t[1^e][2].disable,t[2][2].lock),i[r[0]]=function(){return i[r[0]+"With"](this===i?o:this,arguments),this},i[r[0]+"With"]=s.fireWith}),o.promise(i),e&&e.call(i,i),i},when:function(e){var t,n,o,i=0,r=K.call(arguments),s=r.length,a=1!==s||e&&ie.isFunction(e.promise)?s:0,l=1===a?e:ie.Deferred(),u=function(e,n,o){return function(i){n[e]=this,o[e]=arguments.length>1?K.call(arguments):i,o===t?l.notifyWith(n,o):--a||l.resolveWith(n,o)}};if(s>1)for(t=new Array(s),n=new Array(s),o=new Array(s);s>i;i++)r[i]&&ie.isFunction(r[i].promise)?r[i].promise().done(u(i,o,r)).fail(l.reject).progress(u(i,n,t)):--a;return a||l.resolveWith(o,r),l.promise()}});var be;ie.fn.ready=function(e){return ie.ready.promise().done(e),this},ie.extend({isReady:!1,readyWait:1,holdReady:function(e){e?ie.readyWait++:ie.ready(!0)},ready:function(e){if(!0===e?!--ie.readyWait:!ie.isReady){if(!pe.body)return setTimeout(ie.ready);ie.isReady=!0,!0!==e&&--ie.readyWait>0||(be.resolveWith(pe,[ie]),ie.fn.triggerHandler&&(ie(pe).triggerHandler("ready"),ie(pe).off("ready")))}}}),ie.ready.promise=function(t){if(!be)if(be=ie.Deferred(),"complete"===pe.readyState)setTimeout(ie.ready);else if(pe.addEventListener)pe.addEventListener("DOMContentLoaded",a,!1),e.addEventListener("load",a,!1);else{pe.attachEvent("onreadystatechange",a),e.attachEvent("onload",a);var n=!1;try{n=null==e.frameElement&&pe.documentElement}catch(e){}n&&n.doScroll&&function e(){if(!ie.isReady){try{n.doScroll("left")}catch(t){return setTimeout(e,50)}s(),ie.ready()}}()}return be.promise(t)};var Ce,_e="undefined";for(Ce in ie(ne))break;ne.ownLast="0"!==Ce,ne.inlineBlockNeedsLayout=!1,ie(function(){var e,t,n,o;(n=pe.getElementsByTagName("body")[0])&&n.style&&(t=pe.createElement("div"),o=pe.createElement("div"),o.style.cssText="position:absolute;border:0;width:0;height:0;top:0;left:-9999px",n.appendChild(o).appendChild(t),typeof t.style.zoom!==_e&&(t.style.cssText="display:inline;margin:0;border:0;padding:1px;width:1px;zoom:1",ne.inlineBlockNeedsLayout=e=3===t.offsetWidth,e&&(n.style.zoom=1)),n.removeChild(o))}),function(){var e=pe.createElement("div");if(null==ne.deleteExpando){ne.deleteExpando=!0;try{delete e.test}catch(e){ne.deleteExpando=!1}}e=null}(),ie.acceptData=function(e){var t=ie.noData[(e.nodeName+" ").toLowerCase()],n=+e.nodeType||1;return(1===n||9===n)&&(!t||!0!==t&&e.getAttribute("classid")===t)};var Se=/^(?:\{[\w\W]*\}|\[[\w\W]*\])$/,Te=/([A-Z])/g;ie.extend({cache:{},noData:{"applet ":!0,"embed ":!0,"object ":"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"},hasData:function(e){return!!(e=e.nodeType?ie.cache[e[ie.expando]]:e[ie.expando])&&!u(e)},data:function(e,t,n){return c(e,t,n)},removeData:function(e,t){return d(e,t)},_data:function(e,t,n){return c(e,t,n,!0)},_removeData:function(e,t){return d(e,t,!0)}}),ie.fn.extend({data:function(e,t){var n,o,i,r=this[0],s=r&&r.attributes;if(void 0===e){if(this.length&&(i=ie.data(r),1===r.nodeType&&!ie._data(r,"parsedAttrs"))){for(n=s.length;n--;)s[n]&&(o=s[n].name,0===o.indexOf("data-")&&(o=ie.camelCase(o.slice(5)),l(r,o,i[o])));ie._data(r,"parsedAttrs",!0)}return i}return"object"==typeof e?this.each(function(){ie.data(this,e)}):arguments.length>1?this.each(function(){ie.data(this,e,t)}):r?l(r,e,ie.data(r,e)):void 0},removeData:function(e){return this.each(function(){ie.removeData(this,e)})}}),ie.extend({queue:function(e,t,n){var o;return e?(t=(t||"fx")+"queue",o=ie._data(e,t),n&&(!o||ie.isArray(n)?o=ie._data(e,t,ie.makeArray(n)):o.push(n)),o||[]):void 0},dequeue:function(e,t){t=t||"fx";var n=ie.queue(e,t),o=n.length,i=n.shift(),r=ie._queueHooks(e,t),s=function(){ie.dequeue(e,t)};"inprogress"===i&&(i=n.shift(),o--),i&&("fx"===t&&n.unshift("inprogress"),delete r.stop,i.call(e,s,r)),!o&&r&&r.empty.fire()},_queueHooks:function(e,t){var n=t+"queueHooks";return ie._data(e,n)||ie._data(e,n,{empty:ie.Callbacks("once memory").add(function(){ie._removeData(e,t+"queue"),ie._removeData(e,n)})})}}),ie.fn.extend({queue:function(e,t){var n=2;return"string"!=typeof e&&(t=e,e="fx",n--),arguments.length<n?ie.queue(this[0],e):void 0===t?this:this.each(function(){var n=ie.queue(this,e,t);ie._queueHooks(this,e),"fx"===e&&"inprogress"!==n[0]&&ie.dequeue(this,e)})},dequeue:function(e){return this.each(function(){ie.dequeue(this,e)})},clearQueue:function(e){return this.queue(e||"fx",[])},promise:function(e,t){var n,o=1,i=ie.Deferred(),r=this,s=this.length,a=function(){--o||i.resolveWith(r,[r])};for("string"!=typeof e&&(t=e,e=void 0),e=e||"fx";s--;)(n=ie._data(r[s],e+"queueHooks"))&&n.empty&&(o++,n.empty.add(a));return a(),i.promise(t)}});var Ee=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,Re=["Top","Right","Bottom","Left"],Me=function(e,t){return e=t||e,"none"===ie.css(e,"display")||!ie.contains(e.ownerDocument,e)},Oe=ie.access=function(e,t,n,o,i,r,s){var a=0,l=e.length,u=null==n;if("object"===ie.type(n)){i=!0;for(a in n)ie.access(e,t,a,n[a],!0,r,s)}else if(void 0!==o&&(i=!0,ie.isFunction(o)||(s=!0),u&&(s?(t.call(e,o),t=null):(u=t,t=function(e,t,n){return u.call(ie(e),n)})),t))for(;l>a;a++)t(e[a],n,s?o:o.call(e[a],a,t(e[a],n)));return i?e:u?t.call(e):l?t(e[0],n):r},ke=/^(?:checkbox|radio)$/i;!function(){var e=pe.createElement("input"),t=pe.createElement("div"),n=pe.createDocumentFragment();if(t.innerHTML="  <link/><table></table><a href='/a'>a</a><input type='checkbox'/>",ne.leadingWhitespace=3===t.firstChild.nodeType,ne.tbody=!t.getElementsByTagName("tbody").length,ne.htmlSerialize=!!t.getElementsByTagName("link").length,ne.html5Clone="<:nav></:nav>"!==pe.createElement("nav").cloneNode(!0).outerHTML,e.type="checkbox",e.checked=!0,n.appendChild(e),ne.appendChecked=e.checked,t.innerHTML="<textarea>x</textarea>",ne.noCloneChecked=!!t.cloneNode(!0).lastChild.defaultValue,n.appendChild(t),t.innerHTML="<input type='radio' checked='checked' name='t'/>",ne.checkClone=t.cloneNode(!0).cloneNode(!0).lastChild.checked,ne.noCloneEvent=!0,t.attachEvent&&(t.attachEvent("onclick",function(){ne.noCloneEvent=!1}),t.cloneNode(!0).click()),null==ne.deleteExpando){ne.deleteExpando=!0;try{delete t.test}catch(e){ne.deleteExpando=!1}}}(),function(){var t,n,o=pe.createElement("div");for(t in{submit:!0,change:!0,focusin:!0})n="on"+t,(ne[t+"Bubbles"]=n in e)||(o.setAttribute(n,"t"),ne[t+"Bubbles"]=!1===o.attributes[n].expando);o=null}();var xe=/^(?:input|select|textarea)$/i,De=/^key/,Ae=/^(?:mouse|pointer|contextmenu)|click/,Pe=/^(?:focusinfocus|focusoutblur)$/,He=/^([^.]*)(?:\.(.+)|)$/;ie.event={global:{},add:function(e,t,n,o,i){var r,s,a,l,u,c,d,h,f,p,g,m=ie._data(e);if(m){for(n.handler&&(l=n,n=l.handler,i=l.selector),n.guid||(n.guid=ie.guid++),(s=m.events)||(s=m.events={}),(c=m.handle)||(c=m.handle=function(e){return typeof ie===_e||e&&ie.event.triggered===e.type?void 0:ie.event.dispatch.apply(c.elem,arguments)},c.elem=e),t=(t||"").match(we)||[""],a=t.length;a--;)r=He.exec(t[a])||[],f=g=r[1],p=(r[2]||"").split(".").sort(),f&&(u=ie.event.special[f]||{},f=(i?u.delegateType:u.bindType)||f,u=ie.event.special[f]||{},d=ie.extend({type:f,origType:g,data:o,handler:n,guid:n.guid,selector:i,needsContext:i&&ie.expr.match.needsContext.test(i),namespace:p.join(".")},l),(h=s[f])||(h=s[f]=[],h.delegateCount=0,u.setup&&!1!==u.setup.call(e,o,p,c)||(e.addEventListener?e.addEventListener(f,c,!1):e.attachEvent&&e.attachEvent("on"+f,c))),u.add&&(u.add.call(e,d),d.handler.guid||(d.handler.guid=n.guid)),i?h.splice(h.delegateCount++,0,d):h.push(d),ie.event.global[f]=!0);e=null}},remove:function(e,t,n,o,i){var r,s,a,l,u,c,d,h,f,p,g,m=ie.hasData(e)&&ie._data(e);if(m&&(c=m.events)){for(t=(t||"").match(we)||[""],u=t.length;u--;)if(a=He.exec(t[u])||[],f=g=a[1],p=(a[2]||"").split(".").sort(),f){for(d=ie.event.special[f]||{},f=(o?d.delegateType:d.bindType)||f,h=c[f]||[],a=a[2]&&new RegExp("(^|\\.)"+p.join("\\.(?:.*\\.|)")+"(\\.|$)"),l=r=h.length;r--;)s=h[r],!i&&g!==s.origType||n&&n.guid!==s.guid||a&&!a.test(s.namespace)||o&&o!==s.selector&&("**"!==o||!s.selector)||(h.splice(r,1),s.selector&&h.delegateCount--,d.remove&&d.remove.call(e,s));l&&!h.length&&(d.teardown&&!1!==d.teardown.call(e,p,m.handle)||ie.removeEvent(e,f,m.handle),delete c[f])}else for(f in c)ie.event.remove(e,f+t[u],n,o,!0);ie.isEmptyObject(c)&&(delete m.handle,ie._removeData(e,"events"))}},trigger:function(t,n,o,i){var r,s,a,l,u,c,d,h=[o||pe],f=te.call(t,"type")?t.type:t,p=te.call(t,"namespace")?t.namespace.split("."):[];if(a=c=o=o||pe,3!==o.nodeType&&8!==o.nodeType&&!Pe.test(f+ie.event.triggered)&&(f.indexOf(".")>=0&&(p=f.split("."),f=p.shift(),p.sort()),s=f.indexOf(":")<0&&"on"+f,t=t[ie.expando]?t:new ie.Event(f,"object"==typeof t&&t),t.isTrigger=i?2:3,t.namespace=p.join("."),t.namespace_re=t.namespace?new RegExp("(^|\\.)"+p.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,t.result=void 0,t.target||(t.target=o),n=null==n?[t]:ie.makeArray(n,[t]),u=ie.event.special[f]||{},i||!u.trigger||!1!==u.trigger.apply(o,n))){if(!i&&!u.noBubble&&!ie.isWindow(o)){for(l=u.delegateType||f,Pe.test(l+f)||(a=a.parentNode);a;a=a.parentNode)h.push(a),c=a;c===(o.ownerDocument||pe)&&h.push(c.defaultView||c.parentWindow||e)}for(d=0;(a=h[d++])&&!t.isPropagationStopped();)t.type=d>1?l:u.bindType||f,r=(ie._data(a,"events")||{})[t.type]&&ie._data(a,"handle"),r&&r.apply(a,n),(r=s&&a[s])&&r.apply&&ie.acceptData(a)&&(t.result=r.apply(a,n),!1===t.result&&t.preventDefault());if(t.type=f,!i&&!t.isDefaultPrevented()&&(!u._default||!1===u._default.apply(h.pop(),n))&&ie.acceptData(o)&&s&&o[f]&&!ie.isWindow(o)){c=o[s],c&&(o[s]=null),ie.event.triggered=f;try{o[f]()}catch(e){}ie.event.triggered=void 0,c&&(o[s]=c)}return t.result}},dispatch:function(e){e=ie.event.fix(e);var t,n,o,i,r,s=[],a=K.call(arguments),l=(ie._data(this,"events")||{})[e.type]||[],u=ie.event.special[e.type]||{};if(a[0]=e,e.delegateTarget=this,!u.preDispatch||!1!==u.preDispatch.call(this,e)){for(s=ie.event.handlers.call(this,e,l),t=0;(i=s[t++])&&!e.isPropagationStopped();)for(e.currentTarget=i.elem,r=0;(o=i.handlers[r++])&&!e.isImmediatePropagationStopped();)(!e.namespace_re||e.namespace_re.test(o.namespace))&&(e.handleObj=o,e.data=o.data,void 0!==(n=((ie.event.special[o.origType]||{}).handle||o.handler).apply(i.elem,a))&&!1===(e.result=n)&&(e.preventDefault(),e.stopPropagation()));return u.postDispatch&&u.postDispatch.call(this,e),e.result}},handlers:function(e,t){var n,o,i,r,s=[],a=t.delegateCount,l=e.target;if(a&&l.nodeType&&(!e.button||"click"!==e.type))for(;l!=this;l=l.parentNode||this)if(1===l.nodeType&&(!0!==l.disabled||"click"!==e.type)){for(i=[],r=0;a>r;r++)o=t[r],n=o.selector+" ",void 0===i[n]&&(i[n]=o.needsContext?ie(n,this).index(l)>=0:ie.find(n,this,null,[l]).length),i[n]&&i.push(o);i.length&&s.push({elem:l,handlers:i})}return a<t.length&&s.push({elem:this,handlers:t.slice(a)}),s},fix:function(e){if(e[ie.expando])return e;var t,n,o,i=e.type,r=e,s=this.fixHooks[i];for(s||(this.fixHooks[i]=s=Ae.test(i)?this.mouseHooks:De.test(i)?this.keyHooks:{}),o=s.props?this.props.concat(s.props):this.props,e=new ie.Event(r),t=o.length;t--;)n=o[t],e[n]=r[n];return e.target||(e.target=r.srcElement||pe),3===e.target.nodeType&&(e.target=e.target.parentNode),e.metaKey=!!e.metaKey,s.filter?s.filter(e,r):e},props:"altKey bubbles cancelable ctrlKey currentTarget eventPhase metaKey relatedTarget shiftKey target timeStamp view which".split(" "),fixHooks:{},keyHooks:{props:"char charCode key keyCode".split(" "),filter:function(e,t){return null==e.which&&(e.which=null!=t.charCode?t.charCode:t.keyCode),e}},mouseHooks:{props:"button buttons clientX clientY fromElement offsetX offsetY pageX pageY screenX screenY toElement".split(" "),filter:function(e,t){var n,o,i,r=t.button,s=t.fromElement;return null==e.pageX&&null!=t.clientX&&(o=e.target.ownerDocument||pe,i=o.documentElement,n=o.body,e.pageX=t.clientX+(i&&i.scrollLeft||n&&n.scrollLeft||0)-(i&&i.clientLeft||n&&n.clientLeft||0),e.pageY=t.clientY+(i&&i.scrollTop||n&&n.scrollTop||0)-(i&&i.clientTop||n&&n.clientTop||0)),!e.relatedTarget&&s&&(e.relatedTarget=s===e.target?t.toElement:s),e.which||void 0===r||(e.which=1&r?1:2&r?3:4&r?2:0),e}},special:{load:{noBubble:!0},focus:{trigger:function(){if(this!==p()&&this.focus)try{return this.focus(),!1}catch(e){}},delegateType:"focusin"},blur:{trigger:function(){return this===p()&&this.blur?(this.blur(),!1):void 0},delegateType:"focusout"},click:{trigger:function(){return ie.nodeName(this,"input")&&"checkbox"===this.type&&this.click?(this.click(),!1):void 0},_default:function(e){return ie.nodeName(e.target,"a")}},beforeunload:{postDispatch:function(e){void 0!==e.result&&e.originalEvent&&(e.originalEvent.returnValue=e.result)}}},simulate:function(e,t,n,o){var i=ie.extend(new ie.Event,n,{type:e,isSimulated:!0,originalEvent:{}});o?ie.event.trigger(i,null,t):ie.event.dispatch.call(t,i),i.isDefaultPrevented()&&n.preventDefault()}},ie.removeEvent=pe.removeEventListener?function(e,t,n){e.removeEventListener&&e.removeEventListener(t,n,!1)}:function(e,t,n){var o="on"+t;e.detachEvent&&(typeof e[o]===_e&&(e[o]=null),e.detachEvent(o,n))},ie.Event=function(e,t){return this instanceof ie.Event?(e&&e.type?(this.originalEvent=e,this.type=e.type,this.isDefaultPrevented=e.defaultPrevented||void 0===e.defaultPrevented&&!1===e.returnValue?h:f):this.type=e,t&&ie.extend(this,t),this.timeStamp=e&&e.timeStamp||ie.now(),void(this[ie.expando]=!0)):new ie.Event(e,t)},ie.Event.prototype={isDefaultPrevented:f,isPropagationStopped:f,isImmediatePropagationStopped:f,preventDefault:function(){var e=this.originalEvent;this.isDefaultPrevented=h,e&&(e.preventDefault?e.preventDefault():e.returnValue=!1)},stopPropagation:function(){var e=this.originalEvent;this.isPropagationStopped=h,e&&(e.stopPropagation&&e.stopPropagation(),e.cancelBubble=!0)},stopImmediatePropagation:function(){var e=this.originalEvent;this.isImmediatePropagationStopped=h,e&&e.stopImmediatePropagation&&e.stopImmediatePropagation(),this.stopPropagation()}},ie.each({mouseenter:"mouseover",mouseleave:"mouseout",pointerenter:"pointerover",pointerleave:"pointerout"},function(e,t){ie.event.special[e]={delegateType:t,bindType:t,handle:function(e){var n,o=this,i=e.relatedTarget,r=e.handleObj;return(!i||i!==o&&!ie.contains(o,i))&&(e.type=r.origType,n=r.handler.apply(this,arguments),e.type=t),n}}}),ne.submitBubbles||(ie.event.special.submit={setup:function(){return!ie.nodeName(this,"form")&&void ie.event.add(this,"click._submit keypress._submit",function(e){var t=e.target,n=ie.nodeName(t,"input")||ie.nodeName(t,"button")?t.form:void 0;n&&!ie._data(n,"submitBubbles")&&(ie.event.add(n,"submit._submit",function(e){e._submit_bubble=!0}),ie._data(n,"submitBubbles",!0))})},postDispatch:function(e){e._submit_bubble&&(delete e._submit_bubble,this.parentNode&&!e.isTrigger&&ie.event.simulate("submit",this.parentNode,e,!0))},teardown:function(){return!ie.nodeName(this,"form")&&void ie.event.remove(this,"._submit")}}),ne.changeBubbles||(ie.event.special.change={setup:function(){return xe.test(this.nodeName)?(("checkbox"===this.type||"radio"===this.type)&&(ie.event.add(this,"propertychange._change",function(e){"checked"===e.originalEvent.propertyName&&(this._just_changed=!0)}),ie.event.add(this,"click._change",function(e){this._just_changed&&!e.isTrigger&&(this._just_changed=!1),ie.event.simulate("change",this,e,!0)})),!1):void ie.event.add(this,"beforeactivate._change",function(e){var t=e.target;xe.test(t.nodeName)&&!ie._data(t,"changeBubbles")&&(ie.event.add(t,"change._change",function(e){!this.parentNode||e.isSimulated||e.isTrigger||ie.event.simulate("change",this.parentNode,e,!0)}),ie._data(t,"changeBubbles",!0))})},handle:function(e){var t=e.target;return this!==t||e.isSimulated||e.isTrigger||"radio"!==t.type&&"checkbox"!==t.type?e.handleObj.handler.apply(this,arguments):void 0},teardown:function(){return ie.event.remove(this,"._change"),!xe.test(this.nodeName)}}),ne.focusinBubbles||ie.each({focus:"focusin",blur:"focusout"},function(e,t){var n=function(e){ie.event.simulate(t,e.target,ie.event.fix(e),!0)};ie.event.special[t]={setup:function(){var o=this.ownerDocument||this,i=ie._data(o,t);i||o.addEventListener(e,n,!0),ie._data(o,t,(i||0)+1)},teardown:function(){var o=this.ownerDocument||this,i=ie._data(o,t)-1;i?ie._data(o,t,i):(o.removeEventListener(e,n,!0),ie._removeData(o,t))}}}),ie.fn.extend({on:function(e,t,n,o,i){var r,s;if("object"==typeof e){"string"!=typeof t&&(n=n||t,t=void 0);for(r in e)this.on(r,t,n,e[r],i);return this}if(null==n&&null==o?(o=t,n=t=void 0):null==o&&("string"==typeof t?(o=n,n=void 0):(o=n,n=t,t=void 0)),!1===o)o=f;else if(!o)return this;return 1===i&&(s=o,o=function(e){return ie().off(e),s.apply(this,arguments)},o.guid=s.guid||(s.guid=ie.guid++)),this.each(function(){ie.event.add(this,e,o,n,t)})},one:function(e,t,n,o){return this.on(e,t,n,o,1)},off:function(e,t,n){var o,i;if(e&&e.preventDefault&&e.handleObj)return o=e.handleObj,ie(e.delegateTarget).off(o.namespace?o.origType+"."+o.namespace:o.origType,o.selector,o.handler),this;if("object"==typeof e){for(i in e)this.off(i,t,e[i]);return this}return(!1===t||"function"==typeof t)&&(n=t,t=void 0),!1===n&&(n=f),this.each(function(){ie.event.remove(this,e,n,t)})},trigger:function(e,t){return this.each(function(){ie.event.trigger(e,t,this)})},triggerHandler:function(e,t){var n=this[0];return n?ie.event.trigger(e,t,n,!0):void 0}});var Ne="abbr|article|aside|audio|bdi|canvas|data|datalist|details|figcaption|figure|footer|header|hgroup|mark|meter|nav|output|progress|section|summary|time|video",Le=/ jQuery\d+="(?:null|\d+)"/g,Ie=new RegExp("<(?:"+Ne+")[\\s/>]","i"),We=/^\s+/,je=/<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/gi,Be=/<([\w:]+)/,Fe=/<tbody/i,Ve=/<|&#?\w+;/,ze=/<(?:script|style|link)/i,Ye=/checked\s*(?:[^=]|=\s*.checked.)/i,Ue=/^$|\/(?:java|ecma)script/i,Ge=/^true\/(.*)/,$e=/^\s*<!(?:\[CDATA\[|--)|(?:\]\]|--)>\s*$/g,qe={option:[1,"<select multiple='multiple'>","</select>"],legend:[1,"<fieldset>","</fieldset>"],area:[1,"<map>","</map>"],param:[1,"<object>","</object>"],thead:[1,"<table>","</table>"],tr:[2,"<table><tbody>","</tbody></table>"],col:[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"],td:[3,"<table><tbody><tr>","</tr></tbody></table>"],_default:ne.htmlSerialize?[0,"",""]:[1,"X<div>","</div>"]},Ke=g(pe),Xe=Ke.appendChild(pe.createElement("div"));qe.optgroup=qe.option,qe.tbody=qe.tfoot=qe.colgroup=qe.caption=qe.thead,qe.th=qe.td,ie.extend({clone:function(e,t,n){var o,i,r,s,a,l=ie.contains(e.ownerDocument,e);if(ne.html5Clone||ie.isXMLDoc(e)||!Ie.test("<"+e.nodeName+">")?r=e.cloneNode(!0):(Xe.innerHTML=e.outerHTML,Xe.removeChild(r=Xe.firstChild)),!(ne.noCloneEvent&&ne.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||ie.isXMLDoc(e)))for(o=m(r),a=m(e),s=0;null!=(i=a[s]);++s)o[s]&&S(i,o[s]);if(t)if(n)for(a=a||m(e),o=o||m(r),s=0;null!=(i=a[s]);s++)_(i,o[s]);else _(e,r);return o=m(r,"script"),o.length>0&&C(o,!l&&m(e,"script")),o=a=i=null,r},buildFragment:function(e,t,n,o){for(var i,r,s,a,l,u,c,d=e.length,h=g(t),f=[],p=0;d>p;p++)if((r=e[p])||0===r)if("object"===ie.type(r))ie.merge(f,r.nodeType?[r]:r);else if(Ve.test(r)){for(a=a||h.appendChild(t.createElement("div")),l=(Be.exec(r)||["",""])[1].toLowerCase(),c=qe[l]||qe._default,a.innerHTML=c[1]+r.replace(je,"<$1></$2>")+c[2],i=c[0];i--;)a=a.lastChild;if(!ne.leadingWhitespace&&We.test(r)&&f.push(t.createTextNode(We.exec(r)[0])),!ne.tbody)for(r="table"!==l||Fe.test(r)?"<table>"!==c[1]||Fe.test(r)?0:a:a.firstChild,i=r&&r.childNodes.length;i--;)ie.nodeName(u=r.childNodes[i],"tbody")&&!u.childNodes.length&&r.removeChild(u);for(ie.merge(f,a.childNodes),a.textContent="";a.firstChild;)a.removeChild(a.firstChild);a=h.lastChild}else f.push(t.createTextNode(r));for(a&&h.removeChild(a),ne.appendChecked||ie.grep(m(f,"input"),v),p=0;r=f[p++];)if((!o||-1===ie.inArray(r,o))&&(s=ie.contains(r.ownerDocument,r),a=m(h.appendChild(r),"script"),s&&C(a),n))for(i=0;r=a[i++];)Ue.test(r.type||"")&&n.push(r);return a=null,h},cleanData:function(e,t){for(var n,o,i,r,s=0,a=ie.expando,l=ie.cache,u=ne.deleteExpando,c=ie.event.special;null!=(n=e[s]);s++)if((t||ie.acceptData(n))&&(i=n[a],r=i&&l[i])){if(r.events)for(o in r.events)c[o]?ie.event.remove(n,o):ie.removeEvent(n,o,r.handle);l[i]&&(delete l[i],u?delete n[a]:typeof n.removeAttribute!==_e?n.removeAttribute(a):n[a]=null,q.push(i))}}}),ie.fn.extend({text:function(e){return Oe(this,function(e){return void 0===e?ie.text(this):this.empty().append((this[0]&&this[0].ownerDocument||pe).createTextNode(e))},null,e,arguments.length)},append:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){w(this,e).appendChild(e)}})},prepend:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var t=w(this,e);t.insertBefore(e,t.firstChild)}})},before:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this)})},after:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this.nextSibling)})},remove:function(e,t){for(var n,o=e?ie.filter(e,this):this,i=0;null!=(n=o[i]);i++)t||1!==n.nodeType||ie.cleanData(m(n)),n.parentNode&&(t&&ie.contains(n.ownerDocument,n)&&C(m(n,"script")),n.parentNode.removeChild(n));return this},empty:function(){for(var e,t=0;null!=(e=this[t]);t++){for(1===e.nodeType&&ie.cleanData(m(e,!1));e.firstChild;)e.removeChild(e.firstChild);e.options&&ie.nodeName(e,"select")&&(e.options.length=0)}return this},clone:function(e,t){return e=null!=e&&e,t=null==t?e:t,this.map(function(){return ie.clone(this,e,t)})},html:function(e){return Oe(this,function(e){var t=this[0]||{},n=0,o=this.length;if(void 0===e)return 1===t.nodeType?t.innerHTML.replace(Le,""):void 0;if(!("string"!=typeof e||ze.test(e)||!ne.htmlSerialize&&Ie.test(e)||!ne.leadingWhitespace&&We.test(e)||qe[(Be.exec(e)||["",""])[1].toLowerCase()])){e=e.replace(je,"<$1></$2>");try{for(;o>n;n++)t=this[n]||{},1===t.nodeType&&(ie.cleanData(m(t,!1)),t.innerHTML=e);t=0}catch(e){}}t&&this.empty().append(e)},null,e,arguments.length)},replaceWith:function(){var e=arguments[0];return this.domManip(arguments,function(t){e=this.parentNode,ie.cleanData(m(this)),e&&e.replaceChild(t,this)}),e&&(e.length||e.nodeType)?this:this.remove()},detach:function(e){return this.remove(e,!0)},domManip:function(e,t){e=X.apply([],e);var n,o,i,r,s,a,l=0,u=this.length,c=this,d=u-1,h=e[0],f=ie.isFunction(h);if(f||u>1&&"string"==typeof h&&!ne.checkClone&&Ye.test(h))return this.each(function(n){var o=c.eq(n);f&&(e[0]=h.call(this,n,o.html())),o.domManip(e,t)});if(u&&(a=ie.buildFragment(e,this[0].ownerDocument,!1,this),n=a.firstChild,1===a.childNodes.length&&(a=n),n)){for(r=ie.map(m(a,"script"),y),i=r.length;u>l;l++)o=a,l!==d&&(o=ie.clone(o,!0,!0),i&&ie.merge(r,m(o,"script"))),t.call(this[l],o,l);if(i)for(s=r[r.length-1].ownerDocument,ie.map(r,b),l=0;i>l;l++)o=r[l],Ue.test(o.type||"")&&!ie._data(o,"globalEval")&&ie.contains(s,o)&&(o.src?ie._evalUrl&&ie._evalUrl(o.src):ie.globalEval((o.text||o.textContent||o.innerHTML||"").replace($e,"")));a=n=null}return this}}),ie.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(e,t){ie.fn[e]=function(e){for(var n,o=0,i=[],r=ie(e),s=r.length-1;s>=o;o++)n=o===s?this:this.clone(!0),ie(r[o])[t](n),J.apply(i,n.get());return this.pushStack(i)}});var Je,Ze={};!function(){var e;ne.shrinkWrapBlocks=function(){if(null!=e)return e;e=!1;var t,n,o;return n=pe.getElementsByTagName("body")[0],n&&n.style?(t=pe.createElement("div"),o=pe.createElement("div"),o.style.cssText="position:absolute;border:0;width:0;height:0;top:0;left:-9999px",n.appendChild(o).appendChild(t),typeof t.style.zoom!==_e&&(t.style.cssText="-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;display:block;margin:0;border:0;padding:1px;width:1px;zoom:1",t.appendChild(pe.createElement("div")).style.width="5px",e=3!==t.offsetWidth),n.removeChild(o),e):void 0}}();var Qe,et,tt=/^margin/,nt=new RegExp("^("+Ee+")(?!px)[a-z%]+$","i"),ot=/^(top|right|bottom|left)$/;e.getComputedStyle?(Qe=function(t){return t.ownerDocument.defaultView.opener?t.ownerDocument.defaultView.getComputedStyle(t,null):e.getComputedStyle(t,null)},et=function(e,t,n){var o,i,r,s,a=e.style;return n=n||Qe(e),s=n?n.getPropertyValue(t)||n[t]:void 0,n&&(""!==s||ie.contains(e.ownerDocument,e)||(s=ie.style(e,t)),nt.test(s)&&tt.test(t)&&(o=a.width,i=a.minWidth,r=a.maxWidth,a.minWidth=a.maxWidth=a.width=s,s=n.width,a.width=o,a.minWidth=i,
 a.maxWidth=r)),void 0===s?s:s+""}):pe.documentElement.currentStyle&&(Qe=function(e){return e.currentStyle},et=function(e,t,n){var o,i,r,s,a=e.style;return n=n||Qe(e),s=n?n[t]:void 0,null==s&&a&&a[t]&&(s=a[t]),nt.test(s)&&!ot.test(t)&&(o=a.left,i=e.runtimeStyle,r=i&&i.left,r&&(i.left=e.currentStyle.left),a.left="fontSize"===t?"1em":s,s=a.pixelLeft+"px",a.left=o,r&&(i.left=r)),void 0===s?s:s+""||"auto"}),!function(){function t(){var t,n,o,i;(n=pe.getElementsByTagName("body")[0])&&n.style&&(t=pe.createElement("div"),o=pe.createElement("div"),o.style.cssText="position:absolute;border:0;width:0;height:0;top:0;left:-9999px",n.appendChild(o).appendChild(t),t.style.cssText="-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:block;margin-top:1%;top:1%;border:1px;padding:1px;width:4px;position:absolute",r=s=!1,l=!0,e.getComputedStyle&&(r="1%"!==(e.getComputedStyle(t,null)||{}).top,s="4px"===(e.getComputedStyle(t,null)||{width:"4px"}).width,i=t.appendChild(pe.createElement("div")),i.style.cssText=t.style.cssText="-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;display:block;margin:0;border:0;padding:0",i.style.marginRight=i.style.width="0",t.style.width="1px",l=!parseFloat((e.getComputedStyle(i,null)||{}).marginRight),t.removeChild(i)),t.innerHTML="<table><tr><td></td><td>t</td></tr></table>",i=t.getElementsByTagName("td"),i[0].style.cssText="margin:0;border:0;padding:0;display:none",a=0===i[0].offsetHeight,a&&(i[0].style.display="",i[1].style.display="none",a=0===i[0].offsetHeight),n.removeChild(o))}var n,o,i,r,s,a,l;n=pe.createElement("div"),n.innerHTML="  <link/><table></table><a href='/a'>a</a><input type='checkbox'/>",i=n.getElementsByTagName("a")[0],(o=i&&i.style)&&(o.cssText="float:left;opacity:.5",ne.opacity="0.5"===o.opacity,ne.cssFloat=!!o.cssFloat,n.style.backgroundClip="content-box",n.cloneNode(!0).style.backgroundClip="",ne.clearCloneStyle="content-box"===n.style.backgroundClip,ne.boxSizing=""===o.boxSizing||""===o.MozBoxSizing||""===o.WebkitBoxSizing,ie.extend(ne,{reliableHiddenOffsets:function(){return null==a&&t(),a},boxSizingReliable:function(){return null==s&&t(),s},pixelPosition:function(){return null==r&&t(),r},reliableMarginRight:function(){return null==l&&t(),l}}))}(),ie.swap=function(e,t,n,o){var i,r,s={};for(r in t)s[r]=e.style[r],e.style[r]=t[r];i=n.apply(e,o||[]);for(r in t)e.style[r]=s[r];return i};var it=/alpha\([^)]*\)/i,rt=/opacity\s*=\s*([^)]*)/,st=/^(none|table(?!-c[ea]).+)/,at=new RegExp("^("+Ee+")(.*)$","i"),lt=new RegExp("^([+-])=("+Ee+")","i"),ut={position:"absolute",visibility:"hidden",display:"block"},ct={letterSpacing:"0",fontWeight:"400"},dt=["Webkit","O","Moz","ms"];ie.extend({cssHooks:{opacity:{get:function(e,t){if(t){var n=et(e,"opacity");return""===n?"1":n}}}},cssNumber:{columnCount:!0,fillOpacity:!0,flexGrow:!0,flexShrink:!0,fontWeight:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,widows:!0,zIndex:!0,zoom:!0},cssProps:{float:ne.cssFloat?"cssFloat":"styleFloat"},style:function(e,t,n,o){if(e&&3!==e.nodeType&&8!==e.nodeType&&e.style){var i,r,s,a=ie.camelCase(t),l=e.style;if(t=ie.cssProps[a]||(ie.cssProps[a]=M(l,a)),s=ie.cssHooks[t]||ie.cssHooks[a],void 0===n)return s&&"get"in s&&void 0!==(i=s.get(e,!1,o))?i:l[t];if(r=typeof n,"string"===r&&(i=lt.exec(n))&&(n=(i[1]+1)*i[2]+parseFloat(ie.css(e,t)),r="number"),null!=n&&n===n&&("number"!==r||ie.cssNumber[a]||(n+="px"),ne.clearCloneStyle||""!==n||0!==t.indexOf("background")||(l[t]="inherit"),!(s&&"set"in s&&void 0===(n=s.set(e,n,o)))))try{l[t]=n}catch(e){}}},css:function(e,t,n,o){var i,r,s,a=ie.camelCase(t);return t=ie.cssProps[a]||(ie.cssProps[a]=M(e.style,a)),s=ie.cssHooks[t]||ie.cssHooks[a],s&&"get"in s&&(r=s.get(e,!0,n)),void 0===r&&(r=et(e,t,o)),"normal"===r&&t in ct&&(r=ct[t]),""===n||n?(i=parseFloat(r),!0===n||ie.isNumeric(i)?i||0:r):r}}),ie.each(["height","width"],function(e,t){ie.cssHooks[t]={get:function(e,n,o){return n?st.test(ie.css(e,"display"))&&0===e.offsetWidth?ie.swap(e,ut,function(){return D(e,t,o)}):D(e,t,o):void 0},set:function(e,n,o){var i=o&&Qe(e);return k(e,n,o?x(e,t,o,ne.boxSizing&&"border-box"===ie.css(e,"boxSizing",!1,i),i):0)}}}),ne.opacity||(ie.cssHooks.opacity={get:function(e,t){return rt.test((t&&e.currentStyle?e.currentStyle.filter:e.style.filter)||"")?.01*parseFloat(RegExp.$1)+"":t?"1":""},set:function(e,t){var n=e.style,o=e.currentStyle,i=ie.isNumeric(t)?"alpha(opacity="+100*t+")":"",r=o&&o.filter||n.filter||"";n.zoom=1,(t>=1||""===t)&&""===ie.trim(r.replace(it,""))&&n.removeAttribute&&(n.removeAttribute("filter"),""===t||o&&!o.filter)||(n.filter=it.test(r)?r.replace(it,i):r+" "+i)}}),ie.cssHooks.marginRight=R(ne.reliableMarginRight,function(e,t){return t?ie.swap(e,{display:"inline-block"},et,[e,"marginRight"]):void 0}),ie.each({margin:"",padding:"",border:"Width"},function(e,t){ie.cssHooks[e+t]={expand:function(n){for(var o=0,i={},r="string"==typeof n?n.split(" "):[n];4>o;o++)i[e+Re[o]+t]=r[o]||r[o-2]||r[0];return i}},tt.test(e)||(ie.cssHooks[e+t].set=k)}),ie.fn.extend({css:function(e,t){return Oe(this,function(e,t,n){var o,i,r={},s=0;if(ie.isArray(t)){for(o=Qe(e),i=t.length;i>s;s++)r[t[s]]=ie.css(e,t[s],!1,o);return r}return void 0!==n?ie.style(e,t,n):ie.css(e,t)},e,t,arguments.length>1)},show:function(){return O(this,!0)},hide:function(){return O(this)},toggle:function(e){return"boolean"==typeof e?e?this.show():this.hide():this.each(function(){Me(this)?ie(this).show():ie(this).hide()})}}),ie.Tween=A,A.prototype={constructor:A,init:function(e,t,n,o,i,r){this.elem=e,this.prop=n,this.easing=i||"swing",this.options=t,this.start=this.now=this.cur(),this.end=o,this.unit=r||(ie.cssNumber[n]?"":"px")},cur:function(){var e=A.propHooks[this.prop];return e&&e.get?e.get(this):A.propHooks._default.get(this)},run:function(e){var t,n=A.propHooks[this.prop];return this.options.duration?this.pos=t=ie.easing[this.easing](e,this.options.duration*e,0,1,this.options.duration):this.pos=t=e,this.now=(this.end-this.start)*t+this.start,this.options.step&&this.options.step.call(this.elem,this.now,this),n&&n.set?n.set(this):A.propHooks._default.set(this),this}},A.prototype.init.prototype=A.prototype,A.propHooks={_default:{get:function(e){var t;return null==e.elem[e.prop]||e.elem.style&&null!=e.elem.style[e.prop]?(t=ie.css(e.elem,e.prop,""),t&&"auto"!==t?t:0):e.elem[e.prop]},set:function(e){ie.fx.step[e.prop]?ie.fx.step[e.prop](e):e.elem.style&&(null!=e.elem.style[ie.cssProps[e.prop]]||ie.cssHooks[e.prop])?ie.style(e.elem,e.prop,e.now+e.unit):e.elem[e.prop]=e.now}}},A.propHooks.scrollTop=A.propHooks.scrollLeft={set:function(e){e.elem.nodeType&&e.elem.parentNode&&(e.elem[e.prop]=e.now)}},ie.easing={linear:function(e){return e},swing:function(e){return.5-Math.cos(e*Math.PI)/2}},ie.fx=A.prototype.init,ie.fx.step={};var ht,ft,pt=/^(?:toggle|show|hide)$/,gt=new RegExp("^(?:([+-])=|)("+Ee+")([a-z%]*)$","i"),mt=/queueHooks$/,vt=[L],wt={"*":[function(e,t){var n=this.createTween(e,t),o=n.cur(),i=gt.exec(t),r=i&&i[3]||(ie.cssNumber[e]?"":"px"),s=(ie.cssNumber[e]||"px"!==r&&+o)&&gt.exec(ie.css(n.elem,e)),a=1,l=20;if(s&&s[3]!==r){r=r||s[3],i=i||[],s=+o||1;do{a=a||".5",s/=a,ie.style(n.elem,e,s+r)}while(a!==(a=n.cur()/o)&&1!==a&&--l)}return i&&(s=n.start=+s||+o||0,n.unit=r,n.end=i[1]?s+(i[1]+1)*i[2]:+i[2]),n}]};ie.Animation=ie.extend(W,{tweener:function(e,t){ie.isFunction(e)?(t=e,e=["*"]):e=e.split(" ");for(var n,o=0,i=e.length;i>o;o++)n=e[o],wt[n]=wt[n]||[],wt[n].unshift(t)},prefilter:function(e,t){t?vt.unshift(e):vt.push(e)}}),ie.speed=function(e,t,n){var o=e&&"object"==typeof e?ie.extend({},e):{complete:n||!n&&t||ie.isFunction(e)&&e,duration:e,easing:n&&t||t&&!ie.isFunction(t)&&t};return o.duration=ie.fx.off?0:"number"==typeof o.duration?o.duration:o.duration in ie.fx.speeds?ie.fx.speeds[o.duration]:ie.fx.speeds._default,(null==o.queue||!0===o.queue)&&(o.queue="fx"),o.old=o.complete,o.complete=function(){ie.isFunction(o.old)&&o.old.call(this),o.queue&&ie.dequeue(this,o.queue)},o},ie.fn.extend({fadeTo:function(e,t,n,o){return this.filter(Me).css("opacity",0).show().end().animate({opacity:t},e,n,o)},animate:function(e,t,n,o){var i=ie.isEmptyObject(e),r=ie.speed(t,n,o),s=function(){var t=W(this,ie.extend({},e),r);(i||ie._data(this,"finish"))&&t.stop(!0)};return s.finish=s,i||!1===r.queue?this.each(s):this.queue(r.queue,s)},stop:function(e,t,n){var o=function(e){var t=e.stop;delete e.stop,t(n)};return"string"!=typeof e&&(n=t,t=e,e=void 0),t&&!1!==e&&this.queue(e||"fx",[]),this.each(function(){var t=!0,i=null!=e&&e+"queueHooks",r=ie.timers,s=ie._data(this);if(i)s[i]&&s[i].stop&&o(s[i]);else for(i in s)s[i]&&s[i].stop&&mt.test(i)&&o(s[i]);for(i=r.length;i--;)r[i].elem!==this||null!=e&&r[i].queue!==e||(r[i].anim.stop(n),t=!1,r.splice(i,1));(t||!n)&&ie.dequeue(this,e)})},finish:function(e){return!1!==e&&(e=e||"fx"),this.each(function(){var t,n=ie._data(this),o=n[e+"queue"],i=n[e+"queueHooks"],r=ie.timers,s=o?o.length:0;for(n.finish=!0,ie.queue(this,e,[]),i&&i.stop&&i.stop.call(this,!0),t=r.length;t--;)r[t].elem===this&&r[t].queue===e&&(r[t].anim.stop(!0),r.splice(t,1));for(t=0;s>t;t++)o[t]&&o[t].finish&&o[t].finish.call(this);delete n.finish})}}),ie.each(["toggle","show","hide"],function(e,t){var n=ie.fn[t];ie.fn[t]=function(e,o,i){return null==e||"boolean"==typeof e?n.apply(this,arguments):this.animate(H(t,!0),e,o,i)}}),ie.each({slideDown:H("show"),slideUp:H("hide"),slideToggle:H("toggle"),fadeIn:{opacity:"show"},fadeOut:{opacity:"hide"},fadeToggle:{opacity:"toggle"}},function(e,t){ie.fn[e]=function(e,n,o){return this.animate(t,e,n,o)}}),ie.timers=[],ie.fx.tick=function(){var e,t=ie.timers,n=0;for(ht=ie.now();n<t.length;n++)(e=t[n])()||t[n]!==e||t.splice(n--,1);t.length||ie.fx.stop(),ht=void 0},ie.fx.timer=function(e){ie.timers.push(e),e()?ie.fx.start():ie.timers.pop()},ie.fx.interval=13,ie.fx.start=function(){ft||(ft=setInterval(ie.fx.tick,ie.fx.interval))},ie.fx.stop=function(){clearInterval(ft),ft=null},ie.fx.speeds={slow:600,fast:200,_default:400},ie.fn.delay=function(e,t){return e=ie.fx?ie.fx.speeds[e]||e:e,t=t||"fx",this.queue(t,function(t,n){var o=setTimeout(t,e);n.stop=function(){clearTimeout(o)}})},function(){var e,t,n,o,i;t=pe.createElement("div"),t.setAttribute("className","t"),t.innerHTML="  <link/><table></table><a href='/a'>a</a><input type='checkbox'/>",o=t.getElementsByTagName("a")[0],n=pe.createElement("select"),i=n.appendChild(pe.createElement("option")),e=t.getElementsByTagName("input")[0],o.style.cssText="top:1px",ne.getSetAttribute="t"!==t.className,ne.style=/top/.test(o.getAttribute("style")),ne.hrefNormalized="/a"===o.getAttribute("href"),ne.checkOn=!!e.value,ne.optSelected=i.selected,ne.enctype=!!pe.createElement("form").enctype,n.disabled=!0,ne.optDisabled=!i.disabled,e=pe.createElement("input"),e.setAttribute("value",""),ne.input=""===e.getAttribute("value"),e.value="t",e.setAttribute("type","radio"),ne.radioValue="t"===e.value}();var yt=/\r/g;ie.fn.extend({val:function(e){var t,n,o,i=this[0];return arguments.length?(o=ie.isFunction(e),this.each(function(n){var i;1===this.nodeType&&(i=o?e.call(this,n,ie(this).val()):e,null==i?i="":"number"==typeof i?i+="":ie.isArray(i)&&(i=ie.map(i,function(e){return null==e?"":e+""})),(t=ie.valHooks[this.type]||ie.valHooks[this.nodeName.toLowerCase()])&&"set"in t&&void 0!==t.set(this,i,"value")||(this.value=i))})):i?(t=ie.valHooks[i.type]||ie.valHooks[i.nodeName.toLowerCase()],t&&"get"in t&&void 0!==(n=t.get(i,"value"))?n:(n=i.value,"string"==typeof n?n.replace(yt,""):null==n?"":n)):void 0}}),ie.extend({valHooks:{option:{get:function(e){var t=ie.find.attr(e,"value");return null!=t?t:ie.trim(ie.text(e))}},select:{get:function(e){for(var t,n,o=e.options,i=e.selectedIndex,r="select-one"===e.type||0>i,s=r?null:[],a=r?i+1:o.length,l=0>i?a:r?i:0;a>l;l++)if(n=o[l],!(!n.selected&&l!==i||(ne.optDisabled?n.disabled:null!==n.getAttribute("disabled"))||n.parentNode.disabled&&ie.nodeName(n.parentNode,"optgroup"))){if(t=ie(n).val(),r)return t;s.push(t)}return s},set:function(e,t){for(var n,o,i=e.options,r=ie.makeArray(t),s=i.length;s--;)if(o=i[s],ie.inArray(ie.valHooks.option.get(o),r)>=0)try{o.selected=n=!0}catch(e){o.scrollHeight}else o.selected=!1;return n||(e.selectedIndex=-1),i}}}}),ie.each(["radio","checkbox"],function(){ie.valHooks[this]={set:function(e,t){return ie.isArray(t)?e.checked=ie.inArray(ie(e).val(),t)>=0:void 0}},ne.checkOn||(ie.valHooks[this].get=function(e){return null===e.getAttribute("value")?"on":e.value})});var bt,Ct,_t=ie.expr.attrHandle,St=/^(?:checked|selected)$/i,Tt=ne.getSetAttribute,Et=ne.input;ie.fn.extend({attr:function(e,t){return Oe(this,ie.attr,e,t,arguments.length>1)},removeAttr:function(e){return this.each(function(){ie.removeAttr(this,e)})}}),ie.extend({attr:function(e,t,n){var o,i,r=e.nodeType;if(e&&3!==r&&8!==r&&2!==r)return typeof e.getAttribute===_e?ie.prop(e,t,n):(1===r&&ie.isXMLDoc(e)||(t=t.toLowerCase(),o=ie.attrHooks[t]||(ie.expr.match.bool.test(t)?Ct:bt)),void 0===n?o&&"get"in o&&null!==(i=o.get(e,t))?i:(i=ie.find.attr(e,t),null==i?void 0:i):null!==n?o&&"set"in o&&void 0!==(i=o.set(e,n,t))?i:(e.setAttribute(t,n+""),n):void ie.removeAttr(e,t))},removeAttr:function(e,t){var n,o,i=0,r=t&&t.match(we);if(r&&1===e.nodeType)for(;n=r[i++];)o=ie.propFix[n]||n,ie.expr.match.bool.test(n)?Et&&Tt||!St.test(n)?e[o]=!1:e[ie.camelCase("default-"+n)]=e[o]=!1:ie.attr(e,n,""),e.removeAttribute(Tt?n:o)},attrHooks:{type:{set:function(e,t){if(!ne.radioValue&&"radio"===t&&ie.nodeName(e,"input")){var n=e.value;return e.setAttribute("type",t),n&&(e.value=n),t}}}}}),Ct={set:function(e,t,n){return!1===t?ie.removeAttr(e,n):Et&&Tt||!St.test(n)?e.setAttribute(!Tt&&ie.propFix[n]||n,n):e[ie.camelCase("default-"+n)]=e[n]=!0,n}},ie.each(ie.expr.match.bool.source.match(/\w+/g),function(e,t){var n=_t[t]||ie.find.attr;_t[t]=Et&&Tt||!St.test(t)?function(e,t,o){var i,r;return o||(r=_t[t],_t[t]=i,i=null!=n(e,t,o)?t.toLowerCase():null,_t[t]=r),i}:function(e,t,n){return n?void 0:e[ie.camelCase("default-"+t)]?t.toLowerCase():null}}),Et&&Tt||(ie.attrHooks.value={set:function(e,t,n){return ie.nodeName(e,"input")?void(e.defaultValue=t):bt&&bt.set(e,t,n)}}),Tt||(bt={set:function(e,t,n){var o=e.getAttributeNode(n);return o||e.setAttributeNode(o=e.ownerDocument.createAttribute(n)),o.value=t+="","value"===n||t===e.getAttribute(n)?t:void 0}},_t.id=_t.name=_t.coords=function(e,t,n){var o;return n?void 0:(o=e.getAttributeNode(t))&&""!==o.value?o.value:null},ie.valHooks.button={get:function(e,t){var n=e.getAttributeNode(t);return n&&n.specified?n.value:void 0},set:bt.set},ie.attrHooks.contenteditable={set:function(e,t,n){bt.set(e,""!==t&&t,n)}},ie.each(["width","height"],function(e,t){ie.attrHooks[t]={set:function(e,n){return""===n?(e.setAttribute(t,"auto"),n):void 0}}})),ne.style||(ie.attrHooks.style={get:function(e){return e.style.cssText||void 0},set:function(e,t){return e.style.cssText=t+""}});var Rt=/^(?:input|select|textarea|button|object)$/i,Mt=/^(?:a|area)$/i;ie.fn.extend({prop:function(e,t){return Oe(this,ie.prop,e,t,arguments.length>1)},removeProp:function(e){return e=ie.propFix[e]||e,this.each(function(){try{this[e]=void 0,delete this[e]}catch(e){}})}}),ie.extend({propFix:{for:"htmlFor",class:"className"},prop:function(e,t,n){var o,i,r,s=e.nodeType;if(e&&3!==s&&8!==s&&2!==s)return r=1!==s||!ie.isXMLDoc(e),r&&(t=ie.propFix[t]||t,i=ie.propHooks[t]),void 0!==n?i&&"set"in i&&void 0!==(o=i.set(e,n,t))?o:e[t]=n:i&&"get"in i&&null!==(o=i.get(e,t))?o:e[t]},propHooks:{tabIndex:{get:function(e){var t=ie.find.attr(e,"tabindex");return t?parseInt(t,10):Rt.test(e.nodeName)||Mt.test(e.nodeName)&&e.href?0:-1}}}}),ne.hrefNormalized||ie.each(["href","src"],function(e,t){ie.propHooks[t]={get:function(e){return e.getAttribute(t,4)}}}),ne.optSelected||(ie.propHooks.selected={get:function(e){var t=e.parentNode;return t&&(t.selectedIndex,t.parentNode&&t.parentNode.selectedIndex),null}}),ie.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){ie.propFix[this.toLowerCase()]=this}),ne.enctype||(ie.propFix.enctype="encoding");var Ot=/[\t\r\n\f]/g;ie.fn.extend({addClass:function(e){var t,n,o,i,r,s,a=0,l=this.length,u="string"==typeof e&&e;if(ie.isFunction(e))return this.each(function(t){ie(this).addClass(e.call(this,t,this.className))});if(u)for(t=(e||"").match(we)||[];l>a;a++)if(n=this[a],o=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(Ot," "):" ")){for(r=0;i=t[r++];)o.indexOf(" "+i+" ")<0&&(o+=i+" ");s=ie.trim(o),n.className!==s&&(n.className=s)}return this},removeClass:function(e){var t,n,o,i,r,s,a=0,l=this.length,u=0===arguments.length||"string"==typeof e&&e;if(ie.isFunction(e))return this.each(function(t){ie(this).removeClass(e.call(this,t,this.className))});if(u)for(t=(e||"").match(we)||[];l>a;a++)if(n=this[a],o=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(Ot," "):"")){for(r=0;i=t[r++];)for(;o.indexOf(" "+i+" ")>=0;)o=o.replace(" "+i+" "," ");s=e?ie.trim(o):"",n.className!==s&&(n.className=s)}return this},toggleClass:function(e,t){var n=typeof e;return"boolean"==typeof t&&"string"===n?t?this.addClass(e):this.removeClass(e):this.each(ie.isFunction(e)?function(n){ie(this).toggleClass(e.call(this,n,this.className,t),t)}:function(){if("string"===n)for(var t,o=0,i=ie(this),r=e.match(we)||[];t=r[o++];)i.hasClass(t)?i.removeClass(t):i.addClass(t);else(n===_e||"boolean"===n)&&(this.className&&ie._data(this,"__className__",this.className),this.className=this.className||!1===e?"":ie._data(this,"__className__")||"")})},hasClass:function(e){for(var t=" "+e+" ",n=0,o=this.length;o>n;n++)if(1===this[n].nodeType&&(" "+this[n].className+" ").replace(Ot," ").indexOf(t)>=0)return!0;return!1}}),ie.each("blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error contextmenu".split(" "),function(e,t){ie.fn[t]=function(e,n){return arguments.length>0?this.on(t,null,e,n):this.trigger(t)}}),ie.fn.extend({hover:function(e,t){return this.mouseenter(e).mouseleave(t||e)},bind:function(e,t,n){return this.on(e,null,t,n)},unbind:function(e,t){return this.off(e,null,t)},delegate:function(e,t,n,o){return this.on(t,e,n,o)},undelegate:function(e,t,n){return 1===arguments.length?this.off(e,"**"):this.off(t,e||"**",n)}});var kt=ie.now(),xt=/\?/,Dt=/(,)|(\[|{)|(}|])|"(?:[^"\\\r\n]|\\["\\\/bfnrt]|\\u[\da-fA-F]{4})*"\s*:?|true|false|null|-?(?!0\d)\d+(?:\.\d+|)(?:[eE][+-]?\d+|)/g;ie.parseJSON=function(t){if(e.JSON&&e.JSON.parse)return e.JSON.parse(t+"");var n,o=null,i=ie.trim(t+"");return i&&!ie.trim(i.replace(Dt,function(e,t,i,r){return n&&t&&(o=0),0===o?e:(n=i||t,o+=!r-!i,"")}))?Function("return "+i)():ie.error("Invalid JSON: "+t)},ie.parseXML=function(t){var n,o;if(!t||"string"!=typeof t)return null;try{e.DOMParser?(o=new DOMParser,n=o.parseFromString(t,"text/xml")):(n=new ActiveXObject("Microsoft.XMLDOM"),n.async="false",n.loadXML(t))}catch(e){n=void 0}return n&&n.documentElement&&!n.getElementsByTagName("parsererror").length||ie.error("Invalid XML: "+t),n};var At,Pt,Ht=/#.*$/,Nt=/([?&])_=[^&]*/,Lt=/^(.*?):[ \t]*([^\r\n]*)\r?$/gm,It=/^(?:about|app|app-storage|.+-extension|file|res|widget):$/,Wt=/^(?:GET|HEAD)$/,jt=/^\/\//,Bt=/^([\w.+-]+:)(?:\/\/(?:[^\/?#]*@|)([^\/?#:]*)(?::(\d+)|)|)/,Ft={},Vt={},zt="*/".concat("*");try{Pt=location.href}catch(e){Pt=pe.createElement("a"),Pt.href="",Pt=Pt.href}At=Bt.exec(Pt.toLowerCase())||[],ie.extend({active:0,lastModified:{},etag:{},ajaxSettings:{url:Pt,type:"GET",isLocal:It.test(At[1]),global:!0,processData:!0,async:!0,contentType:"application/x-www-form-urlencoded; charset=UTF-8",accepts:{"*":zt,text:"text/plain",html:"text/html",xml:"application/xml, text/xml",json:"application/json, text/javascript"},contents:{xml:/xml/,html:/html/,json:/json/},responseFields:{xml:"responseXML",text:"responseText",json:"responseJSON"},converters:{"* text":String,"text html":!0,"text json":ie.parseJSON,"text xml":ie.parseXML},flatOptions:{url:!0,context:!0}},ajaxSetup:function(e,t){return t?F(F(e,ie.ajaxSettings),t):F(ie.ajaxSettings,e)},ajaxPrefilter:j(Ft),ajaxTransport:j(Vt),ajax:function(e,t){function n(e,t,n,o){var i,c,v,w,b,_=t;2!==y&&(y=2,a&&clearTimeout(a),u=void 0,s=o||"",C.readyState=e>0?4:0,i=e>=200&&300>e||304===e,n&&(w=V(d,C,n)),w=z(d,w,C,i),i?(d.ifModified&&(b=C.getResponseHeader("Last-Modified"),b&&(ie.lastModified[r]=b),(b=C.getResponseHeader("etag"))&&(ie.etag[r]=b)),204===e||"HEAD"===d.type?_="nocontent":304===e?_="notmodified":(_=w.state,c=w.data,v=w.error,i=!v)):(v=_,(e||!_)&&(_="error",0>e&&(e=0))),C.status=e,C.statusText=(t||_)+"",i?p.resolveWith(h,[c,_,C]):p.rejectWith(h,[C,_,v]),C.statusCode(m),m=void 0,l&&f.trigger(i?"ajaxSuccess":"ajaxError",[C,d,i?c:v]),g.fireWith(h,[C,_]),l&&(f.trigger("ajaxComplete",[C,d]),--ie.active||ie.event.trigger("ajaxStop")))}"object"==typeof e&&(t=e,e=void 0),t=t||{};var o,i,r,s,a,l,u,c,d=ie.ajaxSetup({},t),h=d.context||d,f=d.context&&(h.nodeType||h.jquery)?ie(h):ie.event,p=ie.Deferred(),g=ie.Callbacks("once memory"),m=d.statusCode||{},v={},w={},y=0,b="canceled",C={readyState:0,getResponseHeader:function(e){var t;if(2===y){if(!c)for(c={};t=Lt.exec(s);)c[t[1].toLowerCase()]=t[2];t=c[e.toLowerCase()]}return null==t?null:t},getAllResponseHeaders:function(){return 2===y?s:null},setRequestHeader:function(e,t){var n=e.toLowerCase();return y||(e=w[n]=w[n]||e,v[e]=t),this},overrideMimeType:function(e){return y||(d.mimeType=e),this},statusCode:function(e){var t;if(e)if(2>y)for(t in e)m[t]=[m[t],e[t]];else C.always(e[C.status]);return this},abort:function(e){var t=e||b;return u&&u.abort(t),n(0,t),this}};if(p.promise(C).complete=g.add,C.success=C.done,C.error=C.fail,d.url=((e||d.url||Pt)+"").replace(Ht,"").replace(jt,At[1]+"//"),d.type=t.method||t.type||d.method||d.type,d.dataTypes=ie.trim(d.dataType||"*").toLowerCase().match(we)||[""],null==d.crossDomain&&(o=Bt.exec(d.url.toLowerCase()),d.crossDomain=!(!o||o[1]===At[1]&&o[2]===At[2]&&(o[3]||("http:"===o[1]?"80":"443"))===(At[3]||("http:"===At[1]?"80":"443")))),d.data&&d.processData&&"string"!=typeof d.data&&(d.data=ie.param(d.data,d.traditional)),B(Ft,d,t,C),2===y)return C;l=ie.event&&d.global,l&&0==ie.active++&&ie.event.trigger("ajaxStart"),d.type=d.type.toUpperCase(),d.hasContent=!Wt.test(d.type),r=d.url,d.hasContent||(d.data&&(r=d.url+=(xt.test(r)?"&":"?")+d.data,delete d.data),!1===d.cache&&(d.url=Nt.test(r)?r.replace(Nt,"$1_="+kt++):r+(xt.test(r)?"&":"?")+"_="+kt++)),d.ifModified&&(ie.lastModified[r]&&C.setRequestHeader("If-Modified-Since",ie.lastModified[r]),ie.etag[r]&&C.setRequestHeader("If-None-Match",ie.etag[r])),(d.data&&d.hasContent&&!1!==d.contentType||t.contentType)&&C.setRequestHeader("Content-Type",d.contentType),C.setRequestHeader("Accept",d.dataTypes[0]&&d.accepts[d.dataTypes[0]]?d.accepts[d.dataTypes[0]]+("*"!==d.dataTypes[0]?", "+zt+"; q=0.01":""):d.accepts["*"]);for(i in d.headers)C.setRequestHeader(i,d.headers[i]);if(d.beforeSend&&(!1===d.beforeSend.call(h,C,d)||2===y))return C.abort();b="abort";for(i in{success:1,error:1,complete:1})C[i](d[i]);if(u=B(Vt,d,t,C)){C.readyState=1,l&&f.trigger("ajaxSend",[C,d]),d.async&&d.timeout>0&&(a=setTimeout(function(){C.abort("timeout")},d.timeout));try{y=1,u.send(v,n)}catch(e){if(!(2>y))throw e;n(-1,e)}}else n(-1,"No Transport");return C},getJSON:function(e,t,n){return ie.get(e,t,n,"json")},getScript:function(e,t){return ie.get(e,void 0,t,"script")}}),ie.each(["get","post"],function(e,t){ie[t]=function(e,n,o,i){return ie.isFunction(n)&&(i=i||o,o=n,n=void 0),ie.ajax({url:e,type:t,dataType:i,data:n,success:o})}}),ie._evalUrl=function(e){return ie.ajax({url:e,type:"GET",dataType:"script",async:!1,global:!1,throws:!0})},ie.fn.extend({wrapAll:function(e){if(ie.isFunction(e))return this.each(function(t){ie(this).wrapAll(e.call(this,t))});if(this[0]){var t=ie(e,this[0].ownerDocument).eq(0).clone(!0);this[0].parentNode&&t.insertBefore(this[0]),t.map(function(){for(var e=this;e.firstChild&&1===e.firstChild.nodeType;)e=e.firstChild;return e}).append(this)}return this},wrapInner:function(e){return this.each(ie.isFunction(e)?function(t){ie(this).wrapInner(e.call(this,t))}:function(){var t=ie(this),n=t.contents();n.length?n.wrapAll(e):t.append(e)})},wrap:function(e){var t=ie.isFunction(e);return this.each(function(n){ie(this).wrapAll(t?e.call(this,n):e)})},unwrap:function(){return this.parent().each(function(){ie.nodeName(this,"body")||ie(this).replaceWith(this.childNodes)}).end()}}),ie.expr.filters.hidden=function(e){return e.offsetWidth<=0&&e.offsetHeight<=0||!ne.reliableHiddenOffsets()&&"none"===(e.style&&e.style.display||ie.css(e,"display"))},ie.expr.filters.visible=function(e){return!ie.expr.filters.hidden(e)};var Yt=/%20/g,Ut=/\[\]$/,Gt=/\r?\n/g,$t=/^(?:submit|button|image|reset|file)$/i,qt=/^(?:input|select|textarea|keygen)/i;ie.param=function(e,t){var n,o=[],i=function(e,t){t=ie.isFunction(t)?t():null==t?"":t,o[o.length]=encodeURIComponent(e)+"="+encodeURIComponent(t)};if(void 0===t&&(t=ie.ajaxSettings&&ie.ajaxSettings.traditional),ie.isArray(e)||e.jquery&&!ie.isPlainObject(e))ie.each(e,function(){i(this.name,this.value)});else for(n in e)Y(n,e[n],t,i);return o.join("&").replace(Yt,"+")},ie.fn.extend({serialize:function(){return ie.param(this.serializeArray())},serializeArray:function(){return this.map(function(){var e=ie.prop(this,"elements");return e?ie.makeArray(e):this}).filter(function(){var e=this.type;return this.name&&!ie(this).is(":disabled")&&qt.test(this.nodeName)&&!$t.test(e)&&(this.checked||!ke.test(e))}).map(function(e,t){var n=ie(this).val();return null==n?null:ie.isArray(n)?ie.map(n,function(e){return{name:t.name,value:e.replace(Gt,"\r\n")}}):{name:t.name,value:n.replace(Gt,"\r\n")}}).get()}}),ie.ajaxSettings.xhr=void 0!==e.ActiveXObject?function(){return!this.isLocal&&/^(get|post|head|put|delete|options)$/i.test(this.type)&&U()||G()}:U;var Kt=0,Xt={},Jt=ie.ajaxSettings.xhr();e.attachEvent&&e.attachEvent("onunload",function(){for(var e in Xt)Xt[e](void 0,!0)}),ne.cors=!!Jt&&"withCredentials"in Jt,(Jt=ne.ajax=!!Jt)&&ie.ajaxTransport(function(e){if(!e.crossDomain||ne.cors){var t;return{send:function(n,o){var i,r=e.xhr(),s=++Kt;if(r.open(e.type,e.url,e.async,e.username,e.password),e.xhrFields)for(i in e.xhrFields)r[i]=e.xhrFields[i];e.mimeType&&r.overrideMimeType&&r.overrideMimeType(e.mimeType),e.crossDomain||n["X-Requested-With"]||(n["X-Requested-With"]="XMLHttpRequest");for(i in n)void 0!==n[i]&&r.setRequestHeader(i,n[i]+"");r.send(e.hasContent&&e.data||null),t=function(n,i){var a,l,u;if(t&&(i||4===r.readyState))if(delete Xt[s],t=void 0,r.onreadystatechange=ie.noop,i)4!==r.readyState&&r.abort();else{u={},a=r.status,"string"==typeof r.responseText&&(u.text=r.responseText);try{l=r.statusText}catch(e){l=""}a||!e.isLocal||e.crossDomain?1223===a&&(a=204):a=u.text?200:404}u&&o(a,l,u,r.getAllResponseHeaders())},e.async?4===r.readyState?setTimeout(t):r.onreadystatechange=Xt[s]=t:t()},abort:function(){t&&t(void 0,!0)}}}}),ie.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/(?:java|ecma)script/},converters:{"text script":function(e){return ie.globalEval(e),e}}}),ie.ajaxPrefilter("script",function(e){void 0===e.cache&&(e.cache=!1),e.crossDomain&&(e.type="GET",e.global=!1)}),ie.ajaxTransport("script",function(e){if(e.crossDomain){var t,n=pe.head||ie("head")[0]||pe.documentElement;return{send:function(o,i){t=pe.createElement("script"),t.async=!0,e.scriptCharset&&(t.charset=e.scriptCharset),t.src=e.url,t.onload=t.onreadystatechange=function(e,n){(n||!t.readyState||/loaded|complete/.test(t.readyState))&&(t.onload=t.onreadystatechange=null,t.parentNode&&t.parentNode.removeChild(t),t=null,n||i(200,"success"))},n.insertBefore(t,n.firstChild)},abort:function(){t&&t.onload(void 0,!0)}}}});var Zt=[],Qt=/(=)\?(?=&|$)|\?\?/;ie.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Zt.pop()||ie.expando+"_"+kt++;return this[e]=!0,e}}),ie.ajaxPrefilter("json jsonp",function(t,n,o){var i,r,s,a=!1!==t.jsonp&&(Qt.test(t.url)?"url":"string"==typeof t.data&&!(t.contentType||"").indexOf("application/x-www-form-urlencoded")&&Qt.test(t.data)&&"data");return a||"jsonp"===t.dataTypes[0]?(i=t.jsonpCallback=ie.isFunction(t.jsonpCallback)?t.jsonpCallback():t.jsonpCallback,a?t[a]=t[a].replace(Qt,"$1"+i):!1!==t.jsonp&&(t.url+=(xt.test(t.url)?"&":"?")+t.jsonp+"="+i),t.converters["script json"]=function(){return s||ie.error(i+" was not called"),s[0]},t.dataTypes[0]="json",r=e[i],e[i]=function(){s=arguments},o.always(function(){e[i]=r,t[i]&&(t.jsonpCallback=n.jsonpCallback,Zt.push(i)),s&&ie.isFunction(r)&&r(s[0]),s=r=void 0}),"script"):void 0}),ie.parseHTML=function(e,t,n){if(!e||"string"!=typeof e)return null;"boolean"==typeof t&&(n=t,t=!1),t=t||pe;var o=de.exec(e),i=!n&&[];return o?[t.createElement(o[1])]:(o=ie.buildFragment([e],t,i),i&&i.length&&ie(i).remove(),ie.merge([],o.childNodes))};var en=ie.fn.load;ie.fn.load=function(e,t,n){if("string"!=typeof e&&en)return en.apply(this,arguments);var o,i,r,s=this,a=e.indexOf(" ");return a>=0&&(o=ie.trim(e.slice(a,e.length)),e=e.slice(0,a)),ie.isFunction(t)?(n=t,t=void 0):t&&"object"==typeof t&&(r="POST"),s.length>0&&ie.ajax({url:e,type:r,dataType:"html",data:t}).done(function(e){i=arguments,s.html(o?ie("<div>").append(ie.parseHTML(e)).find(o):e)}).complete(n&&function(e,t){s.each(n,i||[e.responseText,t,e])}),this},ie.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){ie.fn[t]=function(e){return this.on(t,e)}}),ie.expr.filters.animated=function(e){return ie.grep(ie.timers,function(t){return e===t.elem}).length};var tn=e.document.documentElement;ie.offset={setOffset:function(e,t,n){var o,i,r,s,a,l,u,c=ie.css(e,"position"),d=ie(e),h={};"static"===c&&(e.style.position="relative"),a=d.offset(),r=ie.css(e,"top"),l=ie.css(e,"left"),u=("absolute"===c||"fixed"===c)&&ie.inArray("auto",[r,l])>-1,u?(o=d.position(),s=o.top,i=o.left):(s=parseFloat(r)||0,i=parseFloat(l)||0),ie.isFunction(t)&&(t=t.call(e,n,a)),null!=t.top&&(h.top=t.top-a.top+s),null!=t.left&&(h.left=t.left-a.left+i),"using"in t?t.using.call(e,h):d.css(h)}},ie.fn.extend({offset:function(e){if(arguments.length)return void 0===e?this:this.each(function(t){ie.offset.setOffset(this,e,t)});var t,n,o={top:0,left:0},i=this[0],r=i&&i.ownerDocument;return r?(t=r.documentElement,ie.contains(t,i)?(typeof i.getBoundingClientRect!==_e&&(o=i.getBoundingClientRect()),n=$(r),{top:o.top+(n.pageYOffset||t.scrollTop)-(t.clientTop||0),left:o.left+(n.pageXOffset||t.scrollLeft)-(t.clientLeft||0)}):o):void 0},position:function(){if(this[0]){var e,t,n={top:0,left:0},o=this[0];return"fixed"===ie.css(o,"position")?t=o.getBoundingClientRect():(e=this.offsetParent(),t=this.offset(),ie.nodeName(e[0],"html")||(n=e.offset()),n.top+=ie.css(e[0],"borderTopWidth",!0),n.left+=ie.css(e[0],"borderLeftWidth",!0)),{top:t.top-n.top-ie.css(o,"marginTop",!0),left:t.left-n.left-ie.css(o,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){for(var e=this.offsetParent||tn;e&&!ie.nodeName(e,"html")&&"static"===ie.css(e,"position");)e=e.offsetParent;return e||tn})}}),ie.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(e,t){var n=/Y/.test(t);ie.fn[e]=function(o){return Oe(this,function(e,o,i){var r=$(e);return void 0===i?r?t in r?r[t]:r.document.documentElement[o]:e[o]:void(r?r.scrollTo(n?ie(r).scrollLeft():i,n?i:ie(r).scrollTop()):e[o]=i)},e,o,arguments.length,null)}}),ie.each(["top","left"],function(e,t){ie.cssHooks[t]=R(ne.pixelPosition,function(e,n){return n?(n=et(e,t),nt.test(n)?ie(e).position()[t]+"px":n):void 0})}),ie.each({Height:"height",Width:"width"},function(e,t){ie.each({padding:"inner"+e,content:t,"":"outer"+e},function(n,o){ie.fn[o]=function(o,i){var r=arguments.length&&(n||"boolean"!=typeof o),s=n||(!0===o||!0===i?"margin":"border");return Oe(this,function(t,n,o){var i
 ;return ie.isWindow(t)?t.document.documentElement["client"+e]:9===t.nodeType?(i=t.documentElement,Math.max(t.body["scroll"+e],i["scroll"+e],t.body["offset"+e],i["offset"+e],i["client"+e])):void 0===o?ie.css(t,n,s):ie.style(t,n,o,s)},t,r?o:void 0,r,null)}})}),ie.fn.size=function(){return this.length},ie.fn.andSelf=ie.fn.addBack,"function"==typeof define&&define.amd&&define("jquery",[],function(){return ie});var nn=e.jQuery,on=e.$;return ie.noConflict=function(t){return e.$===ie&&(e.$=on),t&&e.jQuery===ie&&(e.jQuery=nn),ie},typeof t===_e&&(e.jQuery=e.$=ie),ie}),define("dt/lib/Set",["require","jquery"],function(e){function t(e){return Object(e)===e}var n=e("jquery"),o=function(e){this._valueSet={},this["__isDTLibSet"]=!0,this.reset(e)};return o.getSet=function(e){return o.isSet(e)?e:new o(e)},o.isSet=function(e){return t(e)&&!!e["__isDTLibSet"]},o.prototype={constructor:o,add:function(e){return n.extend(this._valueSet,this._normalize(e)),this},union:function(e){return this.add(e)},reset:function(e){return this._valueSet=this._normalize(e),this},contains:function(e){var t=this._normalize(e);for(var n in t)if(t.hasOwnProperty(n)&&!this._valueSet.hasOwnProperty(n))return!1;return!0},intersects:function(e){var t=this._normalize(e),n=[];for(var i in t)t.hasOwnProperty(i)&&this._valueSet.hasOwnProperty(i)&&n.push(i);return new o(n)},subtracts:function(e){var t=this._normalize(e),n=[];for(var i in this._valueSet)this._valueSet.hasOwnProperty(i)&&!t.hasOwnProperty(i)&&n.push(i);return new o(n)},isEmpty:function(){return 0===this.count()},count:function(){var e=0;for(var t in this._valueSet)this._valueSet.hasOwnProperty(t)&&e++;return e},list:function(){var e=this._valueSet,t=[];for(var n in e)e.hasOwnProperty(n)&&t.push(n);return t},clone:function(){return new o(this)},filter:function(e){var t=this._valueSet,n=[];for(var i in t)t.hasOwnProperty(i)&&e(i)&&n.push(i);return new o(n)},map:function(e){var t=this._valueSet,n=[];for(var i in t)t.hasOwnProperty(i)&&n.push(e(i));return new o(n)},classify:function(e,n){var i=this._valueSet,r={};for(var s in i)if(i.hasOwnProperty(s)){var a=e(s);if(!t(a)){var l={};l[a]=s,a=l}for(var u in a)if(a.hasOwnProperty(u)){var c=r[u]||(r[u]=new o);c.add(a[u])}}for(var d=0,h=(n||[]).length;d<h;d++)r[n[d]]||(r[n[d]]=new o);return r},_normalize:function(e){var t={},i=n.type(e);if(!e)return t;if(o.isSet(e))e=e.list();else if("string"===i){e=e.split(",");for(var r=0,s=e.length;r<s;r++)e[r]=n.trim(e[r])}else if("array"!==i)throw new Error;for(var r=0,s=e.length;r<s;r++)t[e[r]]=1;return t}},o}),define("dt/lib/base",["require","jquery"],function(e){function t(e){var t={},o=n.type(e);if("array"===o)for(var i=0,r=e.length;i<r;i++)t[e[i]]=e[i];else if("object"===o)for(var i in e)e.hasOwnProperty(i)&&(t[e[i]]=i);return t}var n=e("jquery"),o=Array.prototype.slice,i=Array.prototype.indexOf,r=/^[\s\t\xa0\u3000]*$/,s={},a=0,l=s.uncurry=function(e){return function(){return Function.call.apply(e,arguments)}};s.arraySlice=l(o),s.curry=function(e){var t=o.call(arguments,1);return function(){return e.apply(this,t.concat(o.call(arguments)))}},s.ieVersion=/msie (\d+\.\d+)/i.test(navigator.userAgent)?document.documentMode||+RegExp.$1:void 0;var u=/([&<>"'])/g,c={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"};s.encodeHTML=function(e){return null==e?"":(e+"").replace(u,function(e,t){return c[t]})},s.decodeHTML=function(e){return null==e?"":String(e).replace(/&quot;/g,'"').replace(/&lt;/g,"<").replace(/&gt;/g,">").replace(/&amp;/g,"&").replace(/&#([\d]+);/g,function(e,t){return String.fromCharCode(parseInt(t,10))})},s.assert=function(e,t){if(!e)throw new Error(t||"assert fail!")},s.objForEach=function(e,t){var n;for(n in e)e.hasOwnProperty(n)&&t(n,e[n]);if(d)for(var o=0;n=h[o++];)e[n]!==Object.prototype[n]&&t(n,e[n])};var d=!{toString:1}.propertyIsEnumerable("toString"),h=["toString","toLocaleString","valueOf","hasOwnProperty","isPrototypeOf","propertyIsEnumerable","constructor"];s.localUID=function(){return a++},s.makeInner=function(){var e="__private_d_"+s.localUID(),t=function(t){return t[e]||(t[e]={})};return t.attach=function(t){var n="__private_attach_",o=t.prototype;return e=o.hasOwnProperty(n)?o[n]:o[n]?o[n]="__private_s_"+(Number(o[n].split("_s_")[1])+1):o[n]="__private_s_0",t},t},s.isComponent=function(e,t){return Object(e)===e&&(t&&(e["__is__component__"]=1),!!e["__is__component__"])},s.getComponent=function(e){return s.isJQuery(e)&&(e=e[0]),!!e&&e["__component__"]},s.bindComponent=function(e,t){return s.isJQuery(e)&&(e=e[0]),!!e&&(s.isComponent(t)?e["__component__"]=t:!1===t&&(e["__component__"]=null),e["__component__"])},s.isJQuery=function(e){return e instanceof n},s.toInt=function(e){return parseInt(e,10)},s.assign=function(e,n,o,i,r){var s=t(o),a=t(i);for(var l in n)if(n.hasOwnProperty(l)&&!a.hasOwnProperty(l)){var u=null;if(o?s.hasOwnProperty(l)&&(u=s[l]):u=l,null!=u){if(r&&e.hasOwnProperty(u))throw new Error('Target attr "'+u+'" exists!');e[u]=n[l]}}return e};var f=s.isObject=function(e){var t=typeof e;return"function"===t||!!e&&"object"==t};return s.isEmptyObj=function(e){if(!f(e))return!1;for(var t in e)if(e.hasOwnProperty(t))return!1;return!0},s.isNaN=function(e){return e!==e},s.arrayIndexOf=function(e,t,n){if(!e)return-1;if(arguments.length<3&&"function"==typeof i)return i.call(e,t);for(var o=0,r=e.length;o<r;o++)if(arguments.length<3&&e[o]===t||f(e[o])&&e[o][n]===t)return o;return-1},s.arrayRemoveItem=function(e,t){var n=s.arrayIndexOf(e,t);n>0?e.splice(n,1):0===n&&e.shift()},s.arrayMap=function(e,t){for(var n=[],o=0,i=(e||[]).length;o<i;o++)n.push(t(e[o]));return n},s.arrayEquals=function(e,t){if(!n.isArray(e)||!n.isArray(t)||e.length!==t.length)return!1;for(var o=0,i=e.length;o<i;o++)if(e[o]!==t[o])return!1;return!0},s.objectKeys=function(e){var t=[];if(!s.isObject(e))return t;for(var n in e)e.hasOwnProperty(n)&&t.push(n);return t},s.objHasAttr=function(e,t){"string"===n.type(t)&&(t=[t]);for(var o=0,i=t.length;o<i;o++)if(e.hasOwnProperty[t[o]])return!0;return!1},s.diffObjects=function(e,t){function o(){return i.push({path:r.join("."),obj1:e,obj2:t}),i}var i=arguments[2]||[],r=arguments[3]||[],a=n.type(e),l=n.type(t);if(a!==l)return o();if("array"===a){if(e.length!==t.length)return o();for(var u=0,c=e.length;u<c;u++)r.push(u),s.diffObjects(e[u],t[u],i,r),r.pop()}else if("object"===a&&"object"===l){var d=s.objectKeys(e),h=s.objectKeys(t);if(!s.arrayEquals(d,h))return o();for(var u=0,c=d.length;u<c;u++){var f=d[u];r.push(f),s.diffObjects(e[f],t[f],i,r),r.pop()}}else if("date"===a){if(e.getTime()!==t.getTime())return o()}else if("regexp"===a){if(e.toString()!==t.toString())return o()}else if(e!==t)return o();return i},s.isBlank=function(e){return null==e||r.test(e)},s.toEcValue=function(e){return null==e?"-":e},s.fromEcValue=function(e){return"-"===e?null:e},s.toNotEmptyEcName=function(e){return s.isBlank(e)?"-":e},s.isSupportBase64=function(){var e=new Image,t=!0;return e.onload=e.onerror=function(){1===this.width&&1===this.height||(t=!1)},e.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",t}(),s.flashVersion=function(){var e;try{e=navigator.plugins["Shockwave Flash"],e=e.description}catch(t){try{e=new ActiveXObject("ShockwaveFlash.ShockwaveFlash").GetVariable("$version")}catch(t){e="0.0"}}return e=e.match(/\d+/g),parseFloat(e[0]+"."+e[1])}(),s.supportTransition=function(){var e=document.createElement("p").style,t="transition"in e||"WebkitTransition"in e||"MozTransition"in e||"msTransition"in e||"OTransition"in e;return e=null,t}(),s.noop=new Function,s.onlyHasProperty=function(e,t){var o=!0;if(null==t)return!1;n.isArray(t)||(t=[t]);for(var i in e)e.hasOwnProperty(i)&&-1===s.arrayIndexOf(t,i)&&(o=!1);return o},s}),define("dt/lib/json",["require"],function(e){var t={};return t.parseJSONLaxly=function(e,t){return new Function("return ("+e+");").call(t)},t}),define("dt/lib/throttle",["require"],function(e){var t={};return t.throttle=function(e,t,n,o){function i(i){function f(){c=(new Date).getTime(),d=null,(h?e:e[i]).apply(s,a||[])}return function(){l=(new Date).getTime(),s=this,a=arguments,r=l-(o?u:c)-t,clearTimeout(d),o?n?d=setTimeout(f,t):r>=0&&f():r>=0?f():n&&(d=setTimeout(f,-r)),u=l}}var r,s,a,l=(new Date).getTime(),u=0,c=0,d=null,h="function"==typeof e;if(t=t||0,h)return i();for(var f=[],p=0;p<e.length;p++)f[p]=i(p);return f},t.fixedRate=function(e,n){return null!=n?t.throttle(e,n,!0,!1):e},t.debounce=function(e,n){return null!=n?t.throttle(e,n,!0,!0):e},t}),define("dt/lib/dataDriven",["require","./base","jquery","./throttle"],function(e){function t(e,t){return!!(null===e||a.type(e)in f)&&e===t}function n(e,t){var n,o,i=[],r=this[d+"children"];for(n=0;o=r[n];n++)i.push(o.getCallback());for(i=t(i,e),n=0;o=r[n];n++)o.setCallback(i[n])}function o(e,t,n,o){if(!(arguments.length>1))return this()[e];this[d+"currValueInfo"]=n;var i=this();(o&&o.force||this.isDifferent(i[e],t))&&((!o||!o.silent)&&this.valueWillMutate(),i[e]=t,(!o||!o.silent)&&this.valueHasMutated()),r(this,o)}function i(e){return{ob:1,obArray:1,obHash:1}.hasOwnProperty(C(e))}function r(e,t){for(var n=t&&t.volatiles||[],o=e[d+"currValueInfo"],i=0,r=n.length;i<r;i++)delete o[n[i]]}var s=e("./base"),a=e("jquery"),l=e("./throttle"),u=Array.prototype.slice,c={},d="__prop__";c.subscribable=function(e){s.assign(e,h),e._subscriptions={}};var h={subscribe:function(e,t,n){n=n||"change";var o=this._subscriptions[n]||(this._subscriptions[n]=[]),i=new p(e,t,function(){s.arrayRemoveItem(o,i)});return o.push(i),i},notify:function(e,t){if(t=t||"change",this.hasSubscriptionsForEvent(t))for(var n,o=this._subscriptions[t].slice(),i=0;n=o[i];i++)n.callback(e)},hasSubscriptionsForEvent:function(e){return this._subscriptions[e]&&this._subscriptions[e].length},isDifferent:function(e,t){return!this.equalityComparer||!this.equalityComparer(e,t)},equalityComparer:t},f={undefined:1,boolean:1,number:1,string:1},p=function(e,t,n){this[d+"callback"]=e,this[d+"callbackScope"]=t,this[d+"disposeCallback"]=n,this[d+"isDisposed"]=!1},g=p.prototype;g.callback=function(e){return this[d+"isDisposed"]||this[d+"callback"].apply(this[d+"callbackScope"],e||[]),this},g.setCallback=function(e){return this[d+"callback"]=e,this},g.getCallback=function(){return this[d+"callback"]},g.dispose=function(){return this[d+"isDisposed"]=!0,this[d+"disposeCallback"](),this},g.throttle=function(e){return this[d+"callback"]=l.fixedRate(this[d+"callback"],e),this},g.debounce=function(e){return this[d+"callback"]=l.debounce(this[d+"callback"],e),this};var m=function(e){this[d+"children"]=a.extend([],e)},v=m.prototype;v.callback=function(e){for(var t,n=0;t=this[d+"children"][n];n++)t.callback(e)},v.dispose=function(){for(var e,t=0;e=this[d+"children"][t];t++)e.dispose()},v.throttle=function(e){return n.call(this,e,l.fixedRate),this},v.debounce=function(e){return n.call(this,e,l.debounce),this},c.ob=c.observable=function(e,t,n){function o(e,t,n){return arguments.length>0?void o[d+"writer"](e,t,n):o[d+"currValue"]}return C(e)&&(e=e.peek(),t=e.peekValueInfo()),o[d+"currValue"]=e,o[d+"currValueInfo"]=t,o[d+"authKey"]=n?n.authKey:null,c.subscribable(o),s.assign(o,w),o["__ob__type__"]="ob",o[d+"writer"]=function(e,t,n){o.validateAuthKey(n?n.authKey:null),s.assert(null==t||a.isPlainObject(t)),o[d+"currValueInfo"]=t,(n&&n.force||o.isDifferent(o[d+"currValue"],e))&&((!n||!n.silent)&&o.valueWillMutate(),o[d+"currValue"]=e,(!n||!n.silent)&&o.valueHasMutated()),r(this,n)},o};var w={force:function(e,t,n){n=n||{},n.force=!0,this[d+"writer"](e,t,n)},peek:function(){return this[d+"currValue"]},peekValueInfo:function(e){if(0===arguments.length){var t=this[d+"currValueInfo"];return t&&(t=a.extend({},t)),t}if(s.isObject(this[d+"currValueInfo"]))return this[d+"currValueInfo"][e]},extendWriter:function(e){var t=this,n=t[d+"writer"];return this[d+"writer"]=function(o,i,r){t.validateAuthKey(r?r.authKey:null),e.call(t,n,o,i,r)},this},valueHasMutated:function(){this.notify([this[d+"currValue"],this])},valueWillMutate:function(){this.notify([this[d+"currValue"],this],"beforeChange")},validateAuthKey:function(e){var t=this[d+"authKey"];if(null!=t&&e!==t)throw new Error("AuthKey error: "+e)}};c.obHash=function(e){var t=c.ob(e||{});return t["__ob__type__"]="obHash",t.prop=o,t},c.obArray=function(e){s.assert(void 0===e||a.isArray(e));var t=c.ob(e||[]);return s.assign(t,y),t["__ob__type__"]="obArray",t};var y={remove:function(e){for(var t,n=this(),o=[],i=[],r=0,s=n.length;r<s;)("function"==typeof e?e(n[r]):n[r]===e)?(t||(this.valueWillMutate(),t=!0),o.push(n.splice(r,1)),i.push(r),s--):r++;if(o.length){var a={key:b.REMOVE,indexes:i};this.notify([a,this],"arrayChange"),this.valueHasMutated()}return o},removeAll:function(){return this.splice(0,this.count())},indexOf:function(e){return s.arrayIndexOf(this(),e)},pop:function(){return this.splice(this.count()-1,1)},push:function(){return this.splice.apply(this,[this.count(),0].concat(u.call(arguments)))},shift:function(){return this.splice(0,1)},unshift:function(e){return this.splice(0,0,e)},splice:function(e,t){var n=this(),o=n.length,i=arguments.length;if(!i||!(e>=0&&e<=o))return[];1===i?t=o:t>=0?t>o-e&&(t=o-e):t=0,this.valueWillMutate();var r=n.splice.apply(n,arguments),s={key:b.SPLICE,index:e,removeCount:t,added:u.call(arguments,2)};return this.notify([s,this],"arrayChange"),this.valueHasMutated(),r},slice:function(){return u.apply(this(),arguments)},pushArray:function(e){return this.push.apply(this,e||[])},count:function(){return this().length},move:function(e,t){var n=this(),o=n.length;if(!(e<0||e>=o||t<0||t>=o||e===t)){this.valueWillMutate();var i=n.splice(e,1)[0];n.splice(t,0,i);var r={key:b.MOVE,originIndex:e,finalIndex:t};this.notify([r,this],"arrayChange"),this.valueHasMutated()}}},b=c.obArray.ChangeKey={REMOVE:"remove",SPLICE:"splice",MOVE:"move"};c.obSubscribe=function(e,t,n,o){if(C(e))return e.subscribe(t,n,o);if(a.isArray(e)){for(var i=[],r=0,s=e.length;r<s;r++)C(e[r])&&i.push(e[r].subscribe(t,n,o));return new m(i)}},c.value=function(e){return C(e)?e():e},c.peek=function(e){return C(e)?e.peek():e},c.setValue=function(e,t,n){return t=c.peek(t),i(e)?(e(t,n),e):t},c.valueInfo=function(e,t){return s.isObject(e)?s.assign({},e,["type","info"]):{type:e,info:t}},c.valueInfo.CONFIRMED="confirmed",c.valueInfoForConfirmed=function(e,t){var n=c.valueInfo(c.valueInfo.CONFIRMED,e);return t&&s.assign(n,t,null,["type","info"]),n},c.checkValueInfo=function(e,t,n){var o=c.obTypeOf(e)?e.peekValueInfo():e;return s.isObject(o)&&(null==t||o.type===t)&&(null==n||o.info===n)},c.checkValueInfoForConfirmed=function(e,t){return c.checkValueInfo(e,c.valueInfo.CONFIRMED,t)};var C=c.obTypeOf=function(e){return Object(e)===e&&e["__ob__type__"]};return c}),define("dt/lib/model",["require","jquery","./base","./dataDriven"],function(e){var t=e("jquery"),n=e("./base"),o=e("./dataDriven"),i={},r="__atom__",s=i.isAtom=function(e,i){return Object(e)!==e||!i&&e[r]||o.obTypeOf(e)||n.isComponent(e)||!t.isPlainObject(e)};i.isPlain=function(e,n){return t.isArray(e)||!s(e,n)},i.atom=function(e){return Object(e)!==e||e[r]||(e[r]=1),e},i.cloneAtom=function(e,i){var l,u,c=t.type(e);if(!s(e,!0))return e[r]?(e[r]=0,u=a({},e,{clone:!0}),u[r]=e[r]=1,u):void 0;if(l=o.obTypeOf(e))return o[l](a({},e.peek(),{clone:!0}));if(n.isComponent(e))return e.clone();if("date"===c)return new Date(e.getTime());if("regexp"===c)return new RegExp(e);if("array"===c){u=[];for(var d in e)e.hasOwnProperty(d)&&(u[d]=a({},e[d],{clone:!0}));return u}return c in{function:1,undefined:1,null:1,boolean:1,number:1,string:1}||i&&i.assignWhenCannotClone?e:void 0};var a=i.merge=function(e,t,n){if(void 0===t)return e;if(s(t))return n&&n.clone?i.cloneAtom(t,n):t;s(e)&&(e={});var o=n&&n.levelOneNeedMerge;n&&(n.levelOneNeedMerge=null);for(var r in t)!t.hasOwnProperty(r)||n&&n.onlyMergeOwnPropertyInTarget&&!e.hasOwnProperty(r)||(e[r]=!o||o[r]?a(e[r],t[r],n):t[r]);return e};return i.clone=function(e,t){if(void 0!==e)return a({},e,{clone:!0,assignWhenCannotClone:t})},i}),define("dt/lib/objectAccess",["require","./model"],function(e){function t(e){return e===Object(e)}function n(e){return"[object Array]"===Object.prototype.toString.call(e)}var o={},i=e("./model"),r=/[\.\[]/,s=/\[/g,a=/\]/g,l=o.getByPath=function(e,t,o){if(null==e)return t;var i=n(e)?e:l.parsePath(e),o=o||d;t={k:t},i.unshift("k");for(var r=0,s=i.length;r<s;r++){var a=i[r];switch(r?o(t,a):u.DRILL_DOWN){case u.DRILL_DOWN:t=t[a];break;case u.RETURN:return;default:throw new Error("path: "+a)}}return t},u=l.Action={DRILL_DOWN:"drillDown",THROW:"throw",RETURN:"return"},c=l.actionChoice={notObjectThrow:function(e){return t(e)?u.DRILL_DOWN:u.THROW},notObjectReturn:function(e){return t(e)?u.DRILL_DOWN:u.RETURN},atomThrow:function(e){return t(e)&&!i.isAtom(e)?u.DRILL_DOWN:u.THROW},notPlainThrow:function(e){return t(e)&&i.isPlain(e)?u.DRILL_DOWN:u.THROW},notPlainReturn:function(e){return t(e)&&i.isPlain(e)?u.DRILL_DOWN:u.RETURN}},d=c.notObjectThrow;l.normalizePath=function(e){return e.replace(s,".").replace(a,"")},l.parsePath=function(e){return e.replace(a,"").split(r)};var h=o.setByPath=function(e,t,n,o,i){if(null!=e){var s,a,l=e.split(r),o=o||g;n={k:n},l.unshift("k");for(var u,c=0,d=l.length;c<d;c++){a=l[c];var h=a.length;u=0,a.indexOf("]")===h-1&&(l[c]=a=a.slice(0,h-1),u=1);switch(c?o(n,a):f.DRILL_DOWN){case f.OVERLAP:s[l[c-1]]=n=u?[]:{};break;case f.DELETE:return void delete s[l[c-1]];case f.DRILL_DOWN:break;case f.RETURN:return;default:throw new Error("path: "+a)}s=n,n=n[a]}return"function"==typeof i?t=i(s,a,t):s[a]=t,t}},f=h.Action={DRILL_DOWN:"drillDown",THROW:"throw",RETURN:"return",OVERLAP:"overlap",DELETE:"delete"},p=h.actionChoice={notObjectOverlap:function(e){return t(e)?f.DRILL_DOWN:f.OVERLAP},notObjectThrow:function(e){return t(e)?f.DRILL_DOWN:void 0!==e?f.THROW:f.OVERLAP},notObjectReturn:function(e){return t(e)?f.DRILL_DOWN:void 0!==e?f.RETURN:f.OVERLAP},atomThrow:function(e){return t(e)&&!i.isAtom(e)?f.DRILL_DOWN:void 0!==e?f.THROW:f.OVERLAP},notPlainThrow:function(e){return t(e)&&i.isPlain(e)?f.DRILL_DOWN:void 0!==e?f.THROW:f.OVERLAP},notPlainOverlap:function(e){return t(e)&&i.isPlain(e)?f.DRILL_DOWN:f.OVERLAP}},g=p.notObjectThrow;return o.deleteByPath=function(e,t,n,o){function i(e,t){r=e[t],delete e[t]}var r;return h(e,void 0,t,n,i),r},o.reducePath=function(e,t){for(var n=e.split(r),o=[],i=0,s=n.length;i<s;i++){var a=n[i],l=a.length,u=!1;if(a.indexOf("]")===l-1&&(u=!0,a=a.slice(0,l-1)),a!==t[i])break;o.push((0===i?"":u?"[":".")+n[i])}return o.join("")},o}),define("dt/lib/objectOriented",["require","exports","module","./base"],function(e,t){function n(e,t){for(var n,o=this.constructor,i=this[e];(o=o.prototype._superClass)&&(n=o.prototype[e])&&n===i;);if(n)return n.apply(this,t||[]);throw new Error("parent Class has no method named "+e)}function o(e,t){var n=this[u]||(this[u]={});return arguments.length>1?n[e]=t:n[e]}function i(e){var o=this,i=t.newClass({_define:o.defineProperties}),r=function(){};r.prototype=o.prototype;var a=i.prototype=new r;return s(i.defineProperties,e._define),e._define=null,i.implement(e),a._applySuper=n,a._superClass=o,a.constructor=i,i}function r(e){return s(this.prototype,e)}function s(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e}function a(e){return"[object Function]"===Object.prototype.toString.call(e)}var l=e("./base"),u="privateProps";return t.newClass=function(e){var t=function(){return a(this._construct)?this._construct.apply(this,arguments):this};return t.extend=i,t.implement=r,s(t.defineProperties={},e._define),e._define=null,t.implement(e),t.uid="Class_"+l.localUID(),t.prototype._prop=o,t},t.simpleInherit=function(e,t){var o=e.prototype,i=new Function;i.prototype=t.prototype;var r=e.prototype=new i;return s(r,o),r._applySuper=n,r._superClass=t,r.constructor=e,e},t}),define("dt/lib/event",["require","jquery"],function(e){function t(e){return n.extend(e,r)}var n=e("jquery"),o=n.isFunction,i=n.inArray,r={addEventListener:function(e,t){o(e)&&(t=e,e="*"),this.__listeners=this.__listeners||{};var n=this.__listeners[e]||(this.__listeners[e]=[]);return i(n,t)<0&&n.push(t),this},removeEventListener:function(e,t){o(e)&&(t=e,e="*"),this.__listeners=this.__listeners||{};var n=this.__listeners[e];if(n)if(t){var r=i(n,t);~r&&delete n[r]}else n.length=0,delete this.__listeners[e];return this},removeAllEventListener:function(){return this.__listeners=[],this},fire:function(e,t){this.__listeners=this.__listeners||{};var o=this.__listeners[e],i=this;return o&&n.each(o,function(n,o){t=t||{},t.type=e,o.call(i,t)}),"*"!==e&&this.fire("*",t),this}};return{enableEvent:t}}),define("dt/lib/enumeration",["require","jquery"],function(e){function t(e){var t;if("array"===o.type(e)){t={};for(var n=0,i=e.length;n<i;n++)t[e[n]]=e[n]}else t=e;return t}function n(e){for(var t in e)if(e.hasOwnProperty(t)&&!r.test(t))throw new Error('Key must be spelled like "AAAA_BBB".')}var o=e("jquery"),i={},r=/^[A-Z][A-Z_]*$/;i.makeEnum=function(e,i){function r(){}return i=i||{},e=t(e),n(e),o.extend(r.prototype,s,i),o.extend(new r,e)};var s={has:function(e){return this.hasOwnProperty(e)},hasValue:function(e){return null!=this.getKeyByValue(e)},get:function(e){return this.hasOwnProperty(e)?this[e]:null},getKeyByValue:function(e){for(var t in this)if(this.hasOwnProperty(t)&&this[t]===e)return t;return null},contains:function(e,t){t&&!o.isArray(t)&&(t=[t]);for(var n=0,i=t.length;n<i;n++){for(var r=!1,s=0,a=e.length;s<a;s++)this[e[s]]===t[n]&&(r=!0);if(!r)return!1}return!0},forEachEnum:function(e,t){for(var n in this)this.hasOwnProperty(n)&&r.test(n)&&e.call(t,n,this[n])}};return i}),define("dt/lib/disable",["require","jquery"],function(e){function t(e,t,o){e=null!=e?e:"";var s=r[e];if(!s&&o){var a=null!=t?i+"-"+t:"";s=r[e]=n('<div class="'+i+" "+a+'"></div>').appendTo(document.body)}return s}var n=e("jquery"),o={},i="dt-global-mask",r={};return o.globalDisable=function(e){o.globalMask(!!e&&0)},o.globalMask=function(e,n,o,i){var r;if(!1===e)(r=t(n))&&r.hide().off(".dtGlobalMask");else{null==e&&(e=.5),r=t(n,o,!0),r.css({opacity:e}).show();for(var s in i)i.hasOwnProperty(s)&&r.on(s+".dtGlobalMask",i[s])}},o.disposeGlobalMask=function(e){var n=t(e);n&&n.off().remove()},o}),define("dt/lib/number",["require"],function(e){var t={},n=/^(\d+)px$/,o=/^(\d+|\d+\.\d+)%$/;t.ordinalSuffix=function(e){return 1==e?"st":2==e?"nd":3==e?"rd":"th"},t.pad=function(e,t){var n="",o=e<0,i=String(Math.abs(e));return i.length<t&&(n=new Array(t-i.length+1).join("0")),(o?"-":"")+n+i},t.formatNumber=function(e,n,o,i,r){if(!n)return e;r&&/[ID]%/.test(n)&&(e*=100);var s=/D+/.exec(n),a=s&&s.length>0?s[0].length:0;e=t.fixNumber(e,a,i);var l,u=e.toString(),c=u.split("."),d=c[0],h=c.length>1?c[1]:"";return l=n.replace(/I+,*I*/g,function(){var e,t,n=arguments[0],i=n.lastIndexOf(","),r=[];if(i>=0&&i!==d.length-1){t=n.length-1-i;for(var s;(s=d.length-t)>0&&t>0;)r.push(d.substr(s,t)),d=d.substring(0,s);r.push(d),r.reverse(),"-"===r[0]?(r.shift(),e="-"+r.join(",")):e=r.join(",")}else e=d;return o&&e&&e.indexOf("-")<0&&(e="+"+e),e}),l=l.replace(/D+/g,function(){var e=arguments[0],t=h;return t.length>e.length?t=t.substr(0,e.length):t+=new Array(e.length-t.length).join("0"),t})},t.fixNumber=function(e,t,n){if(e=i(e),null==t||null==e)return e;if(n)return 2==n?Number(e).toFixed(t):Number(e);var o=Math.pow(10,t);return Math.round(e*o)/o};var i=t.getNumber=function(e){var t=parseFloat(e);return e-t>=0?t:null};return t.refineNumber=function(e){for(var t=[],n=0,o=e.length;n<o;n++){var r=i(e[n]);null!=r&&t.push(r)}return t},t.validateNumeric=function(e){return e-parseFloat(e)>=0},t.isInteger=function(e){return t.validateNumeric(e)&&e%1==0},t.isPxStr=function(e){return n.test(e)},t.parsePxStr=function(e){return n.test(e)?parseFloat(RegExp.$1):null},t.isPercentStr=function(e){return o.test(e)},t.parsePercentStr=function(e){return o.test(e)?parseFloat(RegExp.$1):null},t}),define("dt/lib/htmlCleaner",["require"],function(e){function t(e,n){switch(e.nodeType){case 1:var o=e.tagName,r=e.attributes,s=n[o.toLowerCase()];if(!s)return i;for(var a=document.createElement(o),l=0,u=r.length;l<u;l++)~s.indexOf(r[l].name)&&a.setAttribute(r[l].name,r[l].value);for(var c=e.childNodes,l=0,u=c.length;l<u;l++){var d=t(c[l],n);d!==i&&a.appendChild(d)}return a;case 3:return document.createTextNode(e.nodeValue);default:return i}}function n(e){try{return(new DOMParser).parseFromString(e,"text/html")}catch(n){var t=new ActiveXObject("MSXML2.DOMDocument");return t.loadXML(e)}}function o(e,o){o=o||{};var s=n(e),a=o.htmlAllow||r.BASE,l=o.targetEl||document.createElement("div"),u=s.body.childNodes;l.innerHTML="";for(var c=0,d=u.length;c<d;c++){var h=t(u[c],a);h!==i&&l.appendChild(h)}return l.innerHTML}var i,r={BASE:{a:["title","alt","href","class","style"],b:["class","style"],em:["class","style"],strong:["class","style"],i:["class","style"],img:["src","class","style"],div:["class","style"],p:["class","style"],br:[]},EC_FORMATTER:{a:["title","alt","href","class","style"],b:["class","style"],em:["class","style"],strong:["class","style"],i:["class","style"],img:["src","class","style"],div:["class","style"],p:["class","style"],br:[]}};return{htmlClean:o,HTMLCleanAllow:r}}),define("dt/lib/codeStringify",["require","jquery"],function(e){function t(e,r,a,l){var u,d=l.singleLineDepth,h=null!=d?d<=a?"single":"multiple":"auto",f=l.quotationMark,p=l.indentBase,g=l.lineBreak,m=l.inlineDelimiterSpace,v=s.type(e),w=new Array(a*p+1).join(" "),y=new Array((a+1)*p+1).join(" "),b=!1,C=null!=r?n(r,f)+": ":"";switch(v){case"function":b="single"!==h,u=C+c.printFunction(e,a,p);break;case"regexp":u=C+f+e+f;break;case"date":u=C+i(e,f);break;case"array":for(var _=[],S=0,T=e.length;S<T;S++){var E=t(e[S],null,a+1,l);_.push(E.str),E.hasLineBreak&&(b=!0)}"multiple"===h&&(b=!0);var R=b?g:"",M=","+(b?g+y:m),O=b?y:"",k=b?w:"";u=C+"["+R+O+_.join(M)+R+k+"]";break;case"object":var _=[];for(var S in e)if(e.hasOwnProperty(S)){var E=t(e[S],S,a+1,l);_.push(E.str)}b="single"!==h;var R=b?g:"",M=","+(b?g+y:m),O=b?y:"",k=b?w:"";u=C+"{"+R+O+_.join(M)+R+k+"}";break;case"boolean":case"null":case"undefined":u=C+String(e);break;case"number":u=C+(isFinite(e)?String(e):"null");break;case"string":u=C+o(e,f);break;default:throw new Error('Illegal type "'+v+'" at "'+e+'"')}return{str:u,hasLineBreak:b}}function n(e,t){return c.jsReservedWordsMap[e]?t+e+t:/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(e)?e:o(e,t)}function o(e,t){var n=a[t];n.lastIndex=0;var o=u[t];return t+(n.test(e)?e.replace(n,function(e){var t=o[e];return"string"==typeof t?t:"\\u"+("0000"+e.charCodeAt(0).toString(16)).slice(-4)}):e)+t}function i(e,t){return isFinite(e.valueOf())?o(e.getUTCFullYear()+"-"+r(e.getUTCMonth()+1)+"-"+r(e.getUTCDate())+"T"+r(e.getUTCHours())+":"+r(e.getUTCMinutes())+":"+r(e.getUTCSeconds())+"Z",t):"null"}function r(e){return e<10?"0"+e:e}var s=e("jquery"),a={'"':/[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,"'":/[\\\'\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g},l={"\b":"\\b","\t":"\\t","\n":"\\n","\f":"\\f","\r":"\\r","\\":"\\\\"},u={'"':s.extend({},l,{'"':'\\"'}),"'":s.extend({},l,{"'":"\\'"})},c={};return c.jsReservedWords=["break","delete","function","return","typeof","case","do","if","switch","var","catch","else","in","this","void","continue","false","instanceof","throw","while","debugger","finally","new","true","with","default","for","null","try","abstract","double","goto","native","static","boolean","enum","implements","package","super","byte","export","import","private","synchronized","char","extends","int","protected","throws","class","final","interface","public","transient","const","float","long","short","volatile"],c.jsReservedWordsMap=function(e){for(var t={},n=0,o=e.length;n<o;n++)t[e[n]]=1;return t}(c.jsReservedWords),c.stringifyJSObject=function(e,n){if(n=n||{},null==n.indentBase&&(n.indentBase=4),null==n.lineBreak&&(n.lineBreak="\n"),null==n.quotationMark&&(n.quotationMark='"'),'"'!==n.quotationMark&&"'"!==n.quotationMark)throw new Error("Illegal quotation mark: "+n.quotationMark);n.compress&&(n.indentBase=0,n.lineBreak=""),n.inlineDelimiterSpace=n.compress?"":" ";try{return t(e,null,0,n).str}catch(e){return n.errorMessage||""}},c.stringifyJSObject2HTML=function(e,t,n){return"<pre>"+c.stringifyJSObject(e,t,n)+"</pre>"},c.printFunction=function(e,t,n){var o=new Array((t+1)*n).join(" "),i=(e+"").split("\n"),r="";return i.length>1&&"}"===s.trim(i[i.length-1])&&(i.pop(),r="\n"+new Array(t*n).join(" ")+"}"),i.join("\n"+o)+r},c}),define("dt/lib/others",["require","jquery","./base"],function(e){var t=e("jquery"),n=e("./base"),o={},i=/#\{(.+?)\}/g;o.parseURL=function(e){var t=[];if(!e)return t;var n=document.createElement("a");n.href=e;for(var o=(n.search||"").replace(/^\?/,"").split("&"),i=0,r=o.length;i<r;i++){var s=(o[i]||"").split("=");s.length>1&&s[0]&&t.push({name:s[0],value:s[1]})}return t},o.loadLazyImg=function(e,n){!n&&(n="src-origin"),e.each(function(e,o){o=t(o);var i=o.data(n);i&&(o.attr("src",i),o.data(n,""))})},o.parseInlineCss=function(e){e=e||"";for(var n={},o=e.split(";"),i=0,r=o.length;i<r;i++){var s=o[i].split(":");n[t.trim(s[0])]=t.trim(s[1])}return n},o.showBalloonTip=function(){var e,n,i="BAIDUHUI_BALLOON_TIP_SHOWN",r="DNOT_SHOW_WHEN_CLOSE";return function(s,a,l,u){function c(){e&&e.hide(),n===r&&o.cookie(i,1),n=null}if(!1===s)c();else{if((n=u)===r&&o.cookie(i))return;e||(e=t(['<div class="balloon-tip">','<div class="content"></div>','<div class="triangle"><i></i><em></em></div>','<div class="close-btn">X</div>',"</div>"].join("")).hide().appendTo(document.body),t(".close-btn",e).click(c)),t(".content",e).html(s),e.css({position:"absolute",left:a,top:l}).show()}}}(),o.cookie=function(e,t){if(null!=t)return document.cookie=e+"="+encodeURIComponent(t),t;var n=new RegExp("(^| )"+e+"=([^;]*)(;|$)"),o=n.exec(document.cookie);return o?decodeURIComponent(o[2]):null},function(){var e=!1;o.enableWindowScroll=function(t){e=!t},t(window).scroll(function(t){e&&(t.preventDefault(),t.stopPropagation())})}(),o.linkTargetBlank=function(e){var t=document,n=t.body,o=t.createElement("a");o.style.display="none",o.href=e||"#",o.target="_blank",n.appendChild(o),o.click(),n.removeChild(o)};var r=o.appendParam=function(e,t){return e+(e.indexOf("?")<0?"?":"&")+t};return o.replaceIntoParam=function(e,t,o){if(!e||n.isBlank(e))return e;o=null!=o?encodeURIComponent(o):"";var i=new RegExp("([&~?])"+t+"=[^&]*"),s=t+"="+o;return e=i.test(e)?e.replace(i,"$1"+s):r(e,s)},o.strTemplate=function(e,o){e=String(e);var r=Array.prototype.slice.call(arguments,1);return r.length?(r=1===r.length&&n.isObject(o)?o:r,e.replace(i,function(e,n){var o=r[n];return t.isFunction(o)&&(o=o(n)),null==o?"":o})):e},o.enhanceContentEditable=function(e){e.keypress(function(e){13===(e.keyCode||e.witch)&&e.preventDefault()})},o.getOpposite=function(e){var n=["top","right","bottom","left"],o=t.inArray(e,n);return o<0?null:o+2<n.length?n[o+2]:n[n.length-o-2]},function(){var e=[],t=!1;o.enableBeforeUnloadCheck=function(){t||(t=!0,window.onbeforeunload=function(){for(var t,n,o,i=0;n=e[i];i++)(o=n())&&(t=o);t&&(window.event.returnValue=t)})},o.addBeforeUnloadChecker=function(t){e.push(t)},o.removeBeforeUnloadChecker=function(t){var o=n.arrayIndexOf(e,t);return~o&&e.splice(o,1),!!~o}}(),o}),define("dt/lib/liteHashMap",["require","./base"],function(e){function t(e){var o=this;if(e instanceof t)e.each(function(e,t){o.set(t,e)});else if($.isArray(e))for(var i=0;i<e.length;i++)o.set(e[i],i);else e&&n.objForEach(e,function(e,t){o.set(e,t)})}var n=e("./base");return t.prototype={constructor:t,get:function(e){return this.hasOwnProperty(e)?this[e]:null},set:function(e,t){return this[e]=t},each:function(e,t){void 0!==t&&(e=$.proxy(e,t));for(var n in this)this.hasOwnProperty(n)&&e(this[n],n)},removeKey:function(e){delete this[e]}},{createLiteHashMap:function(e){return new t(e)}}}),
-define("dt/ui/tooltip",["require","jquery","../lib/base","../lib/model"],function(e){function t(e){var t=n(),o=e.x,i=e.y;null==o&&(o=0),null==i&&(i=0);var r=e.xAnchor||"center",s=e.yAnchor||"top",a="left"===r?0:t.outerWidth(),l="top"===s?0:t.outerHeight();t.css({left:Math.round("left"===r?o:"center"===r?o-a/2:o-a)+"px",top:Math.round("top"===s?i:"center"===s?i-l/2:i-l)+"px"})}function n(){return f||(f=o('<div class="'+u+'" style="display:none;"></div>').appendTo(document.body)),f}var o=e("jquery"),i=e("../lib/base"),r=e("../lib/model"),s=o.isFunction,a=o.extend,l=".dtui-global-tooltip-namespace",u="dtui-global-tooltip",c={x:0,y:-5,xAnchor:"center",yAnchor:"bottom"},d={x:0,y:-15,xAnchor:"center",yAnchor:"bottom"},h={},f=null,p=!1;return h.showTooltip=function(e){if(!p){e=e||{};var o=e.text;if(null==o)return void h.hideTooltip();o=!1!==e.encodeHTML?i.encodeHTML(o):o,n().html(o).show(),t(e.location)}},h.hideTooltip=function(){n().hide()},h.disableTooltip=function(){h.hideTooltip(),p=!0},h.enableTooltip=function(){p=!1},h.bindTooltip=function(e){function n(e){m={currentTarget:e.currentTarget,pageX:e.pageX,pageY:e.pageY}}function u(t){var n=e.text;return s(n)?n(t.currentTarget):n}function f(e){var t=s(p)?p(e.currentTarget):a({},p||(g?d:c));if(g)t.x+=e.pageX,t.y+=e.pageY;else if(!p){var n=o(e.currentTarget),i=n.offset();t.x+=i.left+n.outerWidth()/2,t.y+=i.top}return t}e=r.merge({},e,{clone:!0,assignWhenCannotClone:!0});var p=e.location,g=e.followMouse;i.assert(!i.isJQuery(e.bindEl));var m,v=o(e.bindEl),w=["mouseenter"+l,function(t){n(t),h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})}],y=["mouseleave"+l,function(){m=null,h.hideTooltip()}],b=["mousemove"+l,function(e){n(e),t(f(m))}],C=e.selector;return C&&(w.splice(1,0,C),y.splice(1,0,C),b.splice(1,0,C)),v.on.apply(v,w).on.apply(v,y),g&&v.on.apply(v,b),{refresh:function(){m&&h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})},setText:function(t){m&&h.showTooltip({text:t,encodeHTML:e.encodeHTML,location:f(m)})},hide:function(){m&&h.hideTooltip()},dispose:function(){m&&(h.hideTooltip(),m=null),v.off(l)}}},h}),define("dt/lib",["require","./lib/Set","./lib/base","./lib/json","./lib/dataDriven","./lib/objectAccess","./lib/objectOriented","./lib/model","./lib/event","./lib/enumeration","./lib/disable","./lib/number","./lib/throttle","./lib/htmlCleaner","./lib/codeStringify","./lib/others","./lib/liteHashMap","./ui/tooltip"],function(e){var t={Set:e("./lib/Set")};return function(e){for(var t=1,n=arguments.length;t<n;t++){var o=arguments[t];for(var i in o)if(o.hasOwnProperty(i)){if(e[i])throw new Error("Duplicate key: "+i);e[i]=o[i]}}}(t,e("./lib/base"),e("./lib/json"),e("./lib/dataDriven"),e("./lib/objectAccess"),e("./lib/objectOriented"),e("./lib/model"),e("./lib/event"),e("./lib/enumeration"),e("./lib/disable"),e("./lib/number"),e("./lib/throttle"),e("./lib/htmlCleaner"),e("./lib/codeStringify"),e("./lib/others"),e("./lib/liteHashMap"),e("./ui/tooltip")),t}),function(e){function t(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e}function n(){this.raw=[],this.length=0}function o(){return"___"+k++}function i(e,t){var n=new Function;n.prototype=t.prototype,e.prototype=new n,e.prototype.constructor=e}function r(e){return x[e]}function s(e){return'"'+e.replace(/\x5C/g,"\\\\").replace(/"/g,'\\"').replace(/\x0A/g,"\\n").replace(/\x09/g,"\\t").replace(/\x0D/g,"\\r")+'"'}function a(e){return e.replace(/[\^\[\]\$\(\)\{\}\?\*\.\+]/g,function(e){return"\\"+e})}function l(e){var t=arguments;return e.replace(/\{([0-9]+)\}/g,function(e,n){return t[n-0+1]})}function u(e){return e=e.replace(/^\s*\*/,""),l('gv({0},["{1}"])',s(e),e.replace(/\[['"]?([^'"]+)['"]?\]/g,function(e,t){return"."+t}).split(".").join('","'))}function c(e,t,n,o,i,r){for(var s=n.length,a=e.split(t),l=0,u=[],c=0,d=a.length;d>c;c++){var h=a[c];if(c){var f=1;for(l++;;){var p=h.indexOf(n);if(0>p){u.push(l>1&&f?t:"",h);break}if(l=o?l-1:0,u.push(l>0&&f?t:"",h.slice(0,p),l>0?n:""),h=h.slice(p+s),f=0,0===l)break}0===l&&(i(u.join("")),r(h),u=[])}else h&&r(h)}l>0&&u.length>0&&(r(t),r(u.join("")))}function d(e,t,n){var o,i=[],r=t.options,a="",l="",h="",f="";return n&&(a="ts(",l=")",h=P,f=H,o=r.defaultFilter),c(e,r.variableOpen,r.variableClose,1,function(e){n&&e.indexOf("|")<0&&o&&(e+="|"+o);var r=e.indexOf("|"),s=(r>0?e.slice(0,r):e).replace(/^\s+/,"").replace(/\s+$/,""),c=r>0?e.slice(r+1):"",p=0===s.indexOf("*"),g=[p?"":a,u(s),p?"":l];if(c){c=d(c,t);for(var m=c.split("|"),v=0,w=m.length;w>v;v++){/^\s*([a-z0-9_-]+)(\((.*)\))?\s*$/i.test(m[v])&&(g.unshift('fs["'+RegExp.$1+'"]('),RegExp.$3&&g.push(",",RegExp.$3),g.push(")"))}}i.push(h,g.join(""),f)},function(e){i.push(h,n?s(e):e,f)}),i.join("")}function h(e,t){this.value=e,this.engine=t}function f(e,t){this.value=e,this.engine=t,this.children=[],this.cloneProps=[]}function p(e,t){var n=e.stack,o=t?n.find(function(e){return e instanceof t}):n.bottom();if(o){for(var i;(i=n.top())!==o;){if(!i.autoClose)throw new Error(i.type+" must be closed manually: "+i.value);i.autoClose(e)}o.close(e)}return o}function g(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(\s*master\s*=\s*([a-z0-9\/_-]+)\s*\))?\s*/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.master=RegExp.$3,this.name=RegExp.$1,f.call(this,e,t),this.blocks={}}function m(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name"]}function v(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name","state","blocks"],this.blocks={}}function w(e,t){if(!/^\s*([a-z0-9_]+)\s*=([\s\S]*)$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.expr=RegExp.$2,f.call(this,e,t),this.cloneProps=["name","expr"]}function y(e,t){if(!/^\s*([a-z0-9_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function b(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function C(e,t){if(!new RegExp(l("^\\s*({0}[\\s\\S]+{1})\\s+as\\s+{0}([0-9a-z_]+){1}\\s*(,\\s*{0}([0-9a-z_]+){1})?\\s*$",a(t.options.variableOpen),a(t.options.variableClose)),"i").test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.list=RegExp.$1,this.item=RegExp.$2,this.index=RegExp.$4,f.call(this,e,t),this.cloneProps=["list","item","index"]}function _(e,t){f.call(this,e,t)}function S(e,t){_.call(this,e,t)}function T(e,t){f.call(this,e,t)}function E(e,t){t.target=e;var n=t.engine,o=e.name;if(n.targets[o])switch(n.options.namingConflict){case"override":n.targets[o]=e,t.targets.push(o);case"ignore":break;default:throw new Error("Target exists: "+o)}else n.targets[o]=e,t.targets.push(o)}function R(e,t){I[e]=t,t.prototype.type=e}function M(e){this.options={commandOpen:"\x3c!--",commandClose:"--\x3e",commandSyntax:/^\s*(\/)?([a-z]+)\s*(?::([\s\S]*))?$/,variableOpen:"${",variableClose:"}",defaultFilter:"html"},this.config(e),this.targets={},this.filters=t({},D)}function O(e,t){function o(){var e;if(d.length>0&&(e=d.join(""))){var n=new h(e,t);n.beforeAdd(u),l.top().addChild(n),d=[],t.options.strip&&u.current instanceof f&&(n.value=e.replace(/^[\x20\t\r]*\n/,"")),u.current=n}}var i,r=t.options.commandOpen,s=t.options.commandClose,a=t.options.commandSyntax,l=new n,u={engine:t,targets:[],stack:l,target:null},d=[];return c(e,r,s,0,function(e){var n=a.exec(e);if(n&&(i=I[n[2].toLowerCase()])&&"function"==typeof i){o();var l=u.current;t.options.strip&&l instanceof h&&(l.value=l.value.replace(/\r?\n[\x20\t]*$/,"\n")),n[1]?l=p(u,i):(l=new i(n[3],t),"function"==typeof l.beforeOpen&&l.beforeOpen(u),l.open(u)),u.current=l}else/^\s*\/\//.test(e)||d.push(r,e,s);i=null},function(e){d.push(e)}),o(),p(u),u.targets}n.prototype={push:function(e){this.raw[this.length++]=e},pop:function(){if(this.length>0){var e=this.raw[--this.length];return this.raw.length=this.length,e}},top:function(){return this.raw[this.length-1]},bottom:function(){return this.raw[0]},find:function(e){for(var t=this.length;t--;){var n=this.raw[t];if(e(n))return n}}};var k=178245,x={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},D={html:function(e){return e.replace(/[&<>"']/g,r)},url:encodeURIComponent,raw:function(e){return e}},A='var r="";',P="r+=",H=";",N="return r;";"undefined"!=typeof navigator&&/msie\s*([0-9]+)/i.test(navigator.userAgent)&&RegExp.$1-0<8&&(A="var r=[],ri=0;",P="r[ri++]=",N='return r.join("");'),h.prototype={getRendererBody:function(){var e=this.value,t=this.engine.options;return!e||t.strip&&/^\s*$/.test(e)?"":d(e,this.engine,1)},clone:function(){return this}},f.prototype={addChild:function(e){this.children.push(e)},open:function(e){var t=e.stack.top();t&&t.addChild(this),e.stack.push(this)},close:function(e){e.stack.top()===this&&e.stack.pop()},getRendererBody:function(){for(var e=[],t=this.children,n=0;n<t.length;n++)e.push(t[n].getRendererBody());return e.join("")},clone:function(){for(var e=new this.constructor(this.value,this.engine),t=0,n=this.children.length;n>t;t++)e.addChild(this.children[t].clone());for(var t=0,n=this.cloneProps.length;n>t;t++){var o=this.cloneProps[t];e[o]=this[o]}return e}};i(g,f),i(m,f),i(v,f),i(w,f),i(y,f),i(b,f),i(C,f),i(_,f),i(S,_),i(T,_);var L={READING:1,READED:2,APPLIED:3,READY:4};v.prototype.applyMaster=g.prototype.applyMaster=function(e){function t(e){var o=e.children;if(o instanceof Array)for(var i=0,r=o.length;r>i;i++){var s=o[i];s instanceof m&&n[s.name]&&(s=o[i]=n[s.name]),t(s)}}if(this.state>=L.APPLIED)return 1;var n=this.blocks,o=this.engine.targets[e];return o&&o.applyMaster(o.master)?(this.children=o.clone().children,t(this),this.state=L.APPLIED,1):void 0},g.prototype.isReady=function(){function e(o){for(var i=0,r=o.children.length;r>i;i++){var s=o.children[i];if(s instanceof v){var a=t.targets[s.name];n=n&&a&&a.isReady(t)}else s instanceof f&&e(s)}}if(this.state>=L.READY)return 1;var t=this.engine,n=1;return this.applyMaster(this.master)?(e(this),n&&(this.state=L.READY),n):void 0},g.prototype.getRenderer=function(){if(this.renderer)return this.renderer;if(this.isReady()){var e=new Function("data","engine",['data=data||{};var v={},fs=engine.filters,hg=typeof data.get=="function",gv=function(n,ps){var p=ps[0],d=v[p];if(d==null){if(hg){return data.get(n);}d=data[p];}for(var i=1,l=ps.length;i<l;i++)if(d!=null)d = d[ps[i]];return d;},ts=function(s){if(typeof s==="string"){return s;}if(s==null){s="";}return ""+s;};',A,this.getRendererBody(),N].join("\n")),t=this.engine;return this.renderer=function(n){return e(n,t)},this.renderer}return null},g.prototype.open=function(e){p(e),f.prototype.open.call(this,e),this.state=L.READING,E(this,e)},w.prototype.open=b.prototype.open=function(e){e.stack.top().addChild(this)},m.prototype.open=function(e){f.prototype.open.call(this,e),(e.imp||e.target).blocks[this.name]=this},S.prototype.open=function(e){(new T).open(e),p(e,_).addChild(this),e.stack.push(this)},T.prototype.open=function(e){p(e,_).addChild(this),e.stack.push(this)},v.prototype.open=function(e){this.parent=e.stack.top(),this.target=e.target,f.prototype.open.call(this,e),this.state=L.READING,e.imp=this},b.prototype.close=w.prototype.close=function(){},v.prototype.close=function(e){f.prototype.close.call(this,e),this.state=L.READED,e.imp=null},g.prototype.close=function(e){f.prototype.close.call(this,e),this.state=this.master?L.READED:L.APPLIED,e.target=null},v.prototype.autoClose=function(e){var t=this.parent.children;t.push.apply(t,this.children),this.children.length=0;for(var n in this.blocks)this.target.blocks[n]=this.blocks[n];this.blocks={},this.close(e)},b.prototype.beforeOpen=v.prototype.beforeOpen=w.prototype.beforeOpen=C.prototype.beforeOpen=y.prototype.beforeOpen=m.prototype.beforeOpen=_.prototype.beforeOpen=h.prototype.beforeAdd=function(e){if(!e.stack.bottom()){new g(o(),e.engine).open(e)}},v.prototype.getRendererBody=function(){return this.applyMaster(this.name),f.prototype.getRendererBody.call(this)},b.prototype.getRendererBody=function(){return l("{0}engine.render({2},{{3}}){1}",P,H,s(this.name),d(this.args,this.engine).replace(/(^|,)\s*([a-z0-9_]+)\s*=/gi,function(e,t,n){return(t||"")+s(n)+":"}))},w.prototype.getRendererBody=function(){return this.expr?l("v[{0}]={1};",s(this.name),d(this.expr,this.engine)):""},_.prototype.getRendererBody=function(){return l("if({0}){{1}}",d(this.value,this.engine),f.prototype.getRendererBody.call(this))},T.prototype.getRendererBody=function(){return l("}else{{0}",f.prototype.getRendererBody.call(this))},C.prototype.getRendererBody=function(){return l('var {0}={1};if({0} instanceof Array)for (var {4}=0,{5}={0}.length;{4}<{5};{4}++){v[{2}]={4};v[{3}]={0}[{4}];{6}}else if(typeof {0}==="object")for(var {4} in {0}){v[{2}]={4};v[{3}]={0}[{4}];{6}}',o(),d(this.list,this.engine),s(this.index||o()),s(this.item),o(),o(),f.prototype.getRendererBody.call(this))},y.prototype.getRendererBody=function(){var e=this.args;return l("{2}fs[{5}]((function(){{0}{4}{1}})(){6}){3}",A,N,P,H,f.prototype.getRendererBody.call(this),s(this.name),e?","+d(e,this.engine):"")};var I={};R("target",g),R("block",m),R("import",v),R("use",b),R("var",w),R("for",C),R("if",_),R("elif",S),R("else",T),R("filter",y),M.prototype.config=function(e){t(this.options,e)},M.prototype.compile=M.prototype.parse=function(e){if(e){var t=O(e,this);if(t.length)return this.targets[t[0]].getRenderer()}return new Function('return ""')},M.prototype.getRenderer=function(e){var t=this.targets[e];return t?t.getRenderer():void 0},M.prototype.render=function(e,t){var n=this.getRenderer(e);return n?n(t):""},M.prototype.addFilter=function(e,t){"function"==typeof t&&(this.filters[e]=t)};var W=new M;W.Engine=M,"object"==typeof exports&&"object"==typeof module?exports=module.exports=W:"function"==typeof define&&define.amd?define("etpl",W):e.etpl=W}(this),define("dt/tpl",["require","etpl","./lib"],function(e){function t(e){for(var t=!1,n=!1,o=1;o<arguments.length;o++)"raw"===arguments[o]&&(t=!0),"null"===arguments[o]&&(n=!0);return null!=e||n||(e=""),i.obTypeOf(e)&&(e=e()),e=String(e),t?e:i.encodeHTML(e)}function n(e){return null==e&&(e=""),String(e).replace(/^option\./,"")}var o=e("etpl"),i=e("./lib"),r={};return o.config({commandOpen:"{{",commandClose:"}}",defaultFilter:"ob"}),o.addFilter("ob",t),o.addFilter("dsp",n),r.render=function(e,t,n){return!o.getRenderer(e)&&n&&o.compile(n),o.render(e,t||{})},r}),define("dt/ui/Component",["require","jquery","dt/lib","dt/tpl"],function(e){function t(){function e(e){t.disabled(e)}var t=this._viewModel();t.visible=m.ob(!0);var n=t.disabled;t.disabled=m.ob(!1),null!=n&&this._disposable(n.subscribe(e,this))}function n(e){if(e){var t=b(this);e=t.$el=g(e),t.el=e[0],m.bindComponent(e,this),e.addClass(this.getFullCss().join(" "));var n=this._viewModel(),r=n.disabled,s=n.visible;this._disposable(r.subscribe(o,this)),this._disposable(s.subscribe(i,this)),o.call(this,r()),s("none"!==e[0].style.display)}}function o(e){this.$el()[e?"addClass":"removeClass"](this.getFullCss("-disabled").join(" "))}function i(e){this.$el()[e?"show":"hide"]()}function r(){var e=b(this).cptDef.tplTarget||this._getDefineProperty("tplTarget"),t=this.$el();e&&t&&t.length&&this._renderTpl(e,null,t),!this._getDefineProperty("suppressConstructSub")&&t&&t.length&&this._constructSub(t)}function s(){var e=this.$el(),t=b(this);e.off(t.eventNamespace),e.removeClass(this.getFullCss().join(" ")),t.viewModel=null,t.el=null,t.$el=null,t.subComponents=null,t.sub$Els=null,m.bindComponent(e,!1)}function a(e,t,n){if(!n&&m.isComponent(e)||n&&m.isJQuery(e))t(e);else if("object"===g.type(e)&&!m.isAtom(e))for(var o in e)e.hasOwnProperty(o)&&null!=e[o]&&a(e[o],t,n)}function l(e){var t=b(this),n=t.viewModel={},o=this;return this._traverseFromAncestor(function(e){n=m.merge(n,e.defineProperties.viewModel.call(o),{onlyMergeOwnPropertyInTarget:!1,levelOneNeedMerge:null,clone:!1})}),n=m.merge(n,e,{onlyMergeOwnPropertyInTarget:!!this._getDefineProperty("viewModelOnlyAccessDeclaredProperties"),levelOneNeedMerge:t.viewModelMergeMap||{}}),t.viewModel=n,n}function u(){var e=b(this),t=e.viewModelPublicMap={},n=e.viewModelMergeMap={};this._traverseFromAncestor(function(e){for(var o=e.defineProperties.viewModelPublic||[],i=0,r=o.length;i<r;i++)t[o[i]]=1;for(var s=e.defineProperties.viewModelMerge||[],i=0,r=s.length;i<r;i++)n[s[i]]=1})}function c(){var e=this._viewModel(),t=b(this),n=[];this._traverseFromAncestor(function(e){var t=e.defineProperties.css;g.isArray(t)?n.push.apply(n,t):t&&n.push(t)}),t.basicCss=n;var o=e&&e.css||[];g.isArray(o)||(o=[o]),t.extraCss=o}function d(e){return e=w.normalizePath(e),!!b(this).viewModelPublicMap[e]}function h(e){if(e&&g.isFunction(e.dispose))try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}else e&&m.isJQuery(e)&&e.off(this._event())}function f(e){if(e=e||b(this).subComponents,a(e,function(e){try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}}),!m.isAtom(e))for(var t in e)e.hasOwnProperty(t)&&(e[t]=null)}function p(e){e=e||b(this).sub$els;var t=this._event();if(a(e,function(e){e.off(t)},!0),!m.isAtom(e))for(var n in e)e.hasOwnProperty(n)&&(e[n]=null)}var g=e("jquery"),m=e("dt/lib"),v=e("dt/tpl"),w=m.getByPath,y=m.setByPath,b=m.makeInner(),C=b.attach(m.newClass(m.enableEvent({_define:{tpl:"",tplTarget:"",css:"",viewModel:function(){return{disabled:null,visible:null,css:"",tplTarget:null,tplRenderMode:"html"}},viewModelPublic:["disabled","visible"],viewModelMerge:[],viewModelOnlyAccessDeclaredProperties:!0,suppressConstructSub:!1},_prepare:g.noop,_init:g.noop,_dispose:g.noop,_disposeFinally:g.noop,_run:g.noop,_event:function(e){var t=b(this).eventNamespace;return(null!=e?e:"")+t},_parseViewModel:function(e,t){return e},_parseCptDef:function(e){return e},_construct:function(e,o,i){arguments.length>0&&m.assert(null!=e),!e||g.isPlainObject(e)?(i=o,o=e,e=null):e=g(e),i=g.extend({},i),m.isComponent(this,!0);var s=b(this);s.cptDef=i,s.eventNamespace=".namespace"+m.localUID(),s.subComponents={},s.sub$Els={},s.disposed=!1,s.cptDisposableArea={},s.cptInstanceUID="cpt-instance-"+m.localUID(),u.call(this),o=this._parseViewModel(o||{},i)||{},l.call(this,o),c.call(this),t.call(this),n.call(this,e),this._prepare(),r.call(this),this._init()},dispose:function(){var e=b(this);if(!e.disposed){var t=this.el(),n=this["__originalHTML"]||"";this._dispose(),f.call(this),p.call(this),this._disposable(!1),s.call(this),this._disposeFinally(),t.innerHTML=n,e.disposed=!0}},isDisposed:function(){return!!b(this).disposed},isFrozen:function(){return this._viewModel().disabled()||this.isDisposed()},_disposable:function(e,t){m.assert(null!=e);var n=b(this).cptDisposableArea;if(null==e)return e;if(!1===e)for(var o in n)n.hasOwnProperty(o)&&(h.call(this,n[o]),n[o]=null);else"string"===g.type(e)?(h.call(this,n[e]),n[e]=null):(m.assert(g.isFunction(e.dispose)||m.isJQuery(e),"No dispose method nor not jQuery!"),t=t||"-component-anonymouse-disposable"+m.localUID(),n[t]=e);return e},resize:g.noop,_manuInitView:function(e){n.call(this,e),this._constructSub(e)},_applyTpl:function(e,t){t&&(this._renderTpl(t,null,e),this._constructSub(e))},_renderTpl:function(e,t,n){var o={viewModel:t||this._viewModel(),lang:this.getLang(),constant:this.getConstant()},i=v.render(e,o,this._getDefineProperty("tpl"))||"";return n&&g(n)[this._viewModel().tplRenderMode](i),i},_constructSub:function(e,t){var n=g(e);m.assert(n.length),t&&n.data("cpt")&&this._constructSubCpt.call(this,e);var o=this;g("*[data-cpt]",n).each(function(e,t){o._constructSubCpt(t)})},_constructSubCpt:function(e){var t=g(e),n=e.innerHTML,o=this._viewModel(),i=this._parseCptDef(new Function("viewModel","lib","lang","constant","return {"+t.data("cpt")+"};").call(this,o,m,this.getLang(),this.getConstant())),r=this.getCptClass(i.type),s=i.viewModelGet?w(i.viewModelGet,o):i.viewModel,a=new r(e,s,i);return a["__originalHTML"]=n,this._sub(i.name||"-sub-cpt-name-"+m.localUID(),a)},recreateSubCpt:function(e){var t=this._sub(e);if(t){var n=t.el();t.dispose(),this._sub(e,null),this._constructSubCpt(n)}},traversalRun:function(e){a(b(this).subComponents,function(t){t.traversalRun(e)}),this._run(e)},_sub:function(e,t,n){var o=b(this).subComponents;return arguments.length<2?w(e,o,w.actionChoice.notPlainReturn):(y(e,t,o,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},_getDefineProperty:function(e){return this.constructor.defineProperties[e]},el:function(){return b(this).el},$el:function(e,t,n){var o=b(this);return 0===arguments.length?o.$el:1===arguments.length?w(e,o.sub$Els,w.actionChoice.notPlainReturn):(y(e,t,o.sub$Els,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},css:function(){return this._getDefineProperty("css")||""},viewModel:function(e){if(d.call(this,e))return w(e,b(this).viewModel);throw new Error(e+" is private!")},_viewModel:function(){return b(this).viewModel},getCptClass:function(e){return C.cptClasses[e]},getCptDef:function(e){return b(this).cptDef[e]},uid:function(){return b(this).cptInstanceUID},getFullCss:function(e){var t=["dtui-cpt"],n=b(this);return t.push.apply(t,n.basicCss||[]),t.push.apply(t,n.extraCss||[]),g.map(t,function(t){return t+(e||"")})},isDisabled:function(){return!!m.peek(this._viewModel().disabled)},getLang:function(){return C.defaultLanguageSet},getConstant:function(){return C.defaultConstant},clone:g.noop,_traverseFromAncestor:function(e){for(var t=[],n=this.constructor;n;n=n.prototype._superClass)t.push(n);for(var o=t.length;o--;)e.call(this,t[o])},localOb:function(e,t){var n,o=b(this),i=o.localObRepo||(o.localObRepo={});return arguments.length>1?!1===t?(n=i[e],delete i[e]):(m.assert(null==i[e]),n=i[e]=t):n=i[e],n},getAncestorLocalOb:function(e){for(var t,n,o=this.$el();(o=o&&o.parent())[0]&&!(n=(t=m.getComponent(o))&&t.localOb(e))&&o[0]!==document.body;);return n}})));return C.cptClasses={},C.defaultLanguageSet={},C.defaultConstant={},C.consoleLog=function(e){var t=window.console;m.isObject(t)&&"function"==typeof t.log&&t.log(m.stringifyJSON(e))},C}),define("spreadsheet/lang",["require","jquery"],function(e){var t=e("jquery"),n={langCode:"zh",pageTitle:"表格数据转换工具",pageDescHTML:"使用说明:在<strong>左侧</strong>贴入数据&nbsp;&nbsp;<strong>右下方</strong>立刻产生结果",typeSetting:"结果类型:",emptyValueSetting:"空值设置:",quotationMarkSetting:"引号设置:",quotationMarks:{singleQuotes:"单引号",doubleQuotes:"双引号"},dimensionSetting:"维度设置:",attributeSetting:"属性设置:",codeFormatSetting:"格式化:",codeFormat:{compressed:"压缩",expanded2Indent:"展开(2空格缩进)",expanded4Indent:"展开(4空格缩进)"},convertResult:"转换结果:",dimDesc:{dimallto2:"整体转换成一个二维数组",dim1to1:"每一列转换为一个一维数组",dim1to2:"每一列转换成一个二维数组",dim2to2:"每二列转换成一个二维数组",dim3to2:"每三列转换成一个二维数组",dim4to2:"每四列转换成一个二维数组",dim5to2:"每五列转换成一个二维数组",dim6to2:"每六列转换成一个二维数组"},codeInputTitle:"#{rangeDesc} 列转换结果:",attrInfoTitle:"列 #{colName} ",attrInfoAttrName:"属性名:",attrInfoType:"类型:",ecEmptyValue:"ECharts标准空值(中划线:'-')",jsDataTypeDimArray:"纯数组",jsDataTypeArrayObject:"数组+对象",jsDataTypeGEO:"地理坐标",outputFormat:"结果格式:",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"在第一列贴入国家或地区名称,然后点击:",geoConvertBtn:"转换成坐标",geoDesc:"结果解释:B 列:经度,C 列:纬度,D 列:2位简称",dataTableControl:{clear:"清空",lt:"⇱",rb:"⇲",l:"⇇",r:"⇉",t:"⇈",b:"⇊"}},o={langCode:"en",pageTitle:"Spreadsheet Data Converter",pageDescHTML:"Tip: Paste data on the <strong>left</strong>, and get result <strong>below</strong> immediately.",typeSetting:"Type: ",emptyValueSetting:"Empty Value: ",quotationMarkSetting:"Quotation Mark: ",quotationMarks:{singleQuotes:"single qutation mark",doubleQuotes:"double qutation mark"},dimensionSetting:"Dimension: ",dimDesc:{dim1to1:"Convert to a 1-dimension array every column.",dimallto2:"Convert all of the data to a 2-dimension array.",dim1to2:"Convert to a 2-dimension array every column.",dim2to2:"Convert to a 2-dimension array every 2 columns.",dim3to2:"Convert to a 2-dimension array every 3 columns.",dim4to2:"Convert to a 2-dimension array every 4 columns.",dim5to2:"Convert to a 2-dimension array every 5 columns."},attributeSetting:"Attributes: ",codeFormatSetting:"Formatting Result: ",codeFormat:{compressed:"compress",expanded2Indent:"expand and indent with 2 spaces",expanded4Indent:"expand and indent with 4 spaces"},convertResult:"Result: ",codeInputTitle:"Result from Column #{rangeDesc}:",attrInfoTitle:"Column #{colName} ",attrInfoAttrName:"Attr name: ",attrInfoType:"Type: ",ecEmptyValue:"ECharts Empty Value ('-')",jsDataTypeDimArray:"Array",jsDataTypeArrayObject:"Array + Object",jsDataTypeGEO:"GEO Coordinate",outputFormat:"Result Format: ",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"Paste names of countries or regions, and then click: ",geoConvertBtn:"Convert",geoDesc:"Explanation:B: longitude, C: latitude, D: alpha-2",dataTableControl:{clear:"Clear",lt:"⇱",rb:"⇲",l:"⇦",r:"⇨",t:"⇧",b:"⇩"}};return(window.EC_WWW_LANG||t("html").attr("lang")||"").toLowerCase().indexOf("zh")>-1?n:o}),define("spreadsheet/constant",["require"],function(e){var t={};return t.EC_EMPTY_VALUE="-",t.JSDATA_UPDATE_DELAY=700,t.JSDATA_DIM_ARRAY="dimArray",t.JSDATA_ARRAY_OBJECT="arrayObject",t.JSDATA_GEO="geo",t.UI_DATA_TABLE="dataTable",t.UI_CODE_INPUTS="codeInputs",t}),define("spreadsheet/helper",["require","jquery"],function(e){var t=e("jquery"),n={};return n.formatJSDataToEditorData=function(e,t,n){return e===t.getEmptyValue()?n.getEmptyValue():e},n.formatEditorDataToJSData=function(e,t,n){return e===n.getEmptyValue()?t.getEmptyValue():e},n.objectPropertyCount=function(e){e=e||{};var t=0;for(var n in e)e.hasOwnProperty(n)&&t++;return t},n.parseToArray=function(e){var n;try{n=new Function("return ("+e+")")()}catch(e){}return t.isArray(n)||(n=null),n},n}),function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define("handsontable",[],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.Handsontable=e()}}(function(){var e;return function e(t,n,o){function i(a,l){if(!n[a]){if(!t[a]){var u="function"==typeof require&&require;if(!l&&u)return u(a,!0);if(r)return r(a,!0);if(s[a]&&void 0!==window[s[a]])return window[s[a]];var c=new Error("Cannot find module '"+a+"'");throw c.code="MODULE_NOT_FOUND",c}var d=n[a]={exports:{}};t[a][0].call(d.exports,function(e){var n=t[a][1][e];return i(n||e)},d,d.exports,e,t,n,o)}return n[a].exports}for(var r="function"==typeof require&&require,s=JSON.parse('{"zeroclipboard":"ZeroClipboard","moment":"moment","numbro":"numbro","pikaday":"Pikaday"}')||{},a=0;a<o.length;a++)i(o[a]);return i}({1:[function(e,t,n){},{}],2:[function(e,t,n){window.jQuery&&function(e){e.fn.handsontable=function(e){var t,n,o,i,r,s=this.first(),a=s.data("handsontable");if("string"!=typeof e)return r=e||{},a?a.updateSettings(r):(a=new Handsontable.Core(s[0],r),s.data("handsontable",a),a.init()),s;if(o=[],arguments.length>1)for(t=1,n=arguments.length;t<n;t++)o.push(arguments[t]);if(a){if(void 0===a[e])throw new Error("Handsontable do not provide action: "+e);i=a[e].apply(a,o),"destroy"===e&&s.removeData()}return i}}(window.jQuery)},{}],3:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableBorder:{get:function(){return C}},__esModule:{value:!0}});var o,i,r,s,a,l,u=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},c=u.getComputedStyle,d=u.getTrimmingContainer,h=u.innerWidth,f=u.innerHeight,p=u.offset,g=u.outerHeight,m=u.outerWidth,v=((i=e("helpers/dom/event"))&&i.__esModule&&i||{default:i}).stopImmediatePropagation,w=((r=e("helpers/browser"))&&r.__esModule&&r||{default:r}).isMobileBrowser,y=((s=e("eventManager"))&&s.__esModule&&s||{default:s}).EventManager,b=((a=e("cell/coords"))&&a.__esModule&&a||{default:a}).WalkontableCellCoords,C=((l=e("overlay/_base.js"))&&l.__esModule,function(e,t){t&&(this.eventManager=new y(e),this.instance=e,this.wot=e,this.settings=t,this.mouseDown=!1,this.main=null,this.top=null,this.left=null,this.bottom=null,this.right=null,this.topStyle=null,this.leftStyle=null,this.bottomStyle=null,this.rightStyle=null,this.cornerDefaultStyle={width:"5px",height:"5px",borderWidth:"2px",borderStyle:"solid",borderColor:"#FFF"},this.corner=null,this.cornerStyle=null,this.createBorders(t),this.registerListeners())});$traceurRuntime.createClass(C,{registerListeners:function(){var e=this;this.eventManager.addEventListener(document.body,"mousedown",function(){return e.onMouseDown()}),this.eventManager.addEventListener(document.body,"mouseup",function(){return e.onMouseUp()});for(var t=this,n=0,o=this.main.childNodes.length;n<o;n++)!function(n,o){t.eventManager.addEventListener(t.main.childNodes[n],"mouseenter",function(t){return e.onMouseEnter(t,e.main.childNodes[n])})}(n)},onMouseDown:function(){this.mouseDown=!0},onMouseUp:function(){this.mouseDown=!1},onMouseEnter:function(e,t){function n(e){return e.clientY<Math.floor(r.top)||e.clientY>Math.ceil(r.top+r.height)||e.clientX<Math.floor(r.left)||e.clientX>Math.ceil(r.left+r.width)||void 0}function o(e){n(e)&&(i.eventManager.removeEventListener(document.body,"mousemove",o),t.style.display="block")}if(this.mouseDown&&this.wot.getSetting("hideBorderOnMouseDownOver")){e.preventDefault(),v(e);var i=this,r=t.getBoundingClientRect();t.style.display="none",this.eventManager.addEventListener(document.body,"mousemove",o)}},createBorders:function(e){this.main=document.createElement("div");var t=["top","left","bottom","right","corner"],n=this.main.style;n.position="absolute",n.top=0,n.left=0;for(var o=0;o<5;o++){var i=t[o],r=document.createElement("div");r.className="wtBorder "+(this.settings.className||""),this.settings[i]&&this.settings[i].hide&&(r.className+=" hidden"),n=r.style,n.backgroundColor=this.settings[i]&&this.settings[i].color?this.settings[i].color:e.border.color,n.height=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",n.width=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",this.main.appendChild(r)}this.top=this.main.childNodes[0],this.left=this.main.childNodes[1],this.bottom=this.main.childNodes[2],this.right=this.main.childNodes[3],this.topStyle=this.top.style,this.leftStyle=this.left.style,this.bottomStyle=this.bottom.style,this.rightStyle=this.right.style,this.corner=this.main.childNodes[4],this.corner.className+=" corner",this.cornerStyle=this.corner.style,this.cornerStyle.width=this.cornerDefaultStyle.width,this.cornerStyle.height=this.cornerDefaultStyle.height,this.cornerStyle.border=[this.cornerDefaultStyle.borderWidth,this.cornerDefaultStyle.borderStyle,this.cornerDefaultStyle.borderColor].join(" "),w()&&this.createMultipleSelectorHandles(),this.disappear(),this.wot.wtTable.bordersHolder||(this.wot.wtTable.bordersHolder=document.createElement("div"),this.wot.wtTable.bordersHolder.className="htBorders",this.wot.wtTable.spreader.appendChild(this.wot.wtTable.bordersHolder)),this.wot.wtTable.bordersHolder.insertBefore(this.main,this.wot.wtTable.bordersHolder.firstChild)},createMultipleSelectorHandles:function(){this.selectionHandles={topLeft:document.createElement("DIV"),topLeftHitArea:document.createElement("DIV"),bottomRight:document.createElement("DIV"),bottomRightHitArea:document.createElement("DIV")};this.selectionHandles.topLeft.className="topLeftSelectionHandle",this.selectionHandles.topLeftHitArea.className="topLeftSelectionHandle-HitArea",this.selectionHandles.bottomRight.className="bottomRightSelectionHandle",this.selectionHandles.bottomRightHitArea.className="bottomRightSelectionHandle-HitArea",this.selectionHandles.styles={topLeft:this.selectionHandles.topLeft.style,topLeftHitArea:this.selectionHandles.topLeftHitArea.style,bottomRight:this.selectionHandles.bottomRight.style,
+define("dt/ui/tooltip",["require","jquery","../lib/base","../lib/model"],function(e){function t(e){var t=n(),o=e.x,i=e.y;null==o&&(o=0),null==i&&(i=0);var r=e.xAnchor||"center",s=e.yAnchor||"top",a="left"===r?0:t.outerWidth(),l="top"===s?0:t.outerHeight();t.css({left:Math.round("left"===r?o:"center"===r?o-a/2:o-a)+"px",top:Math.round("top"===s?i:"center"===s?i-l/2:i-l)+"px"})}function n(){return f||(f=o('<div class="'+u+'" style="display:none;"></div>').appendTo(document.body)),f}var o=e("jquery"),i=e("../lib/base"),r=e("../lib/model"),s=o.isFunction,a=o.extend,l=".dtui-global-tooltip-namespace",u="dtui-global-tooltip",c={x:0,y:-5,xAnchor:"center",yAnchor:"bottom"},d={x:0,y:-15,xAnchor:"center",yAnchor:"bottom"},h={},f=null,p=!1;return h.showTooltip=function(e){if(!p){e=e||{};var o=e.text;if(null==o)return void h.hideTooltip();o=!1!==e.encodeHTML?i.encodeHTML(o):o,n().html(o).show(),t(e.location)}},h.hideTooltip=function(){n().hide()},h.disableTooltip=function(){h.hideTooltip(),p=!0},h.enableTooltip=function(){p=!1},h.bindTooltip=function(e){function n(e){m={currentTarget:e.currentTarget,pageX:e.pageX,pageY:e.pageY}}function u(t){var n=e.text;return s(n)?n(t.currentTarget):n}function f(e){var t=s(p)?p(e.currentTarget):a({},p||(g?d:c));if(g)t.x+=e.pageX,t.y+=e.pageY;else if(!p){var n=o(e.currentTarget),i=n.offset();t.x+=i.left+n.outerWidth()/2,t.y+=i.top}return t}e=r.merge({},e,{clone:!0,assignWhenCannotClone:!0});var p=e.location,g=e.followMouse;i.assert(!i.isJQuery(e.bindEl));var m,v=o(e.bindEl),w=["mouseenter"+l,function(t){n(t),h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})}],y=["mouseleave"+l,function(){m=null,h.hideTooltip()}],b=["mousemove"+l,function(e){n(e),t(f(m))}],C=e.selector;return C&&(w.splice(1,0,C),y.splice(1,0,C),b.splice(1,0,C)),v.on.apply(v,w).on.apply(v,y),g&&v.on.apply(v,b),{refresh:function(){m&&h.showTooltip({text:u(m),encodeHTML:e.encodeHTML,location:f(m)})},setText:function(t){m&&h.showTooltip({text:t,encodeHTML:e.encodeHTML,location:f(m)})},hide:function(){m&&h.hideTooltip()},dispose:function(){m&&(h.hideTooltip(),m=null),v.off(l)}}},h}),define("dt/lib",["require","./lib/Set","./lib/base","./lib/json","./lib/dataDriven","./lib/objectAccess","./lib/objectOriented","./lib/model","./lib/event","./lib/enumeration","./lib/disable","./lib/number","./lib/throttle","./lib/htmlCleaner","./lib/codeStringify","./lib/others","./lib/liteHashMap","./ui/tooltip"],function(e){var t={Set:e("./lib/Set")};return function(e){for(var t=1,n=arguments.length;t<n;t++){var o=arguments[t];for(var i in o)if(o.hasOwnProperty(i)){if(e[i])throw new Error("Duplicate key: "+i);e[i]=o[i]}}}(t,e("./lib/base"),e("./lib/json"),e("./lib/dataDriven"),e("./lib/objectAccess"),e("./lib/objectOriented"),e("./lib/model"),e("./lib/event"),e("./lib/enumeration"),e("./lib/disable"),e("./lib/number"),e("./lib/throttle"),e("./lib/htmlCleaner"),e("./lib/codeStringify"),e("./lib/others"),e("./lib/liteHashMap"),e("./ui/tooltip")),t}),function(e){function t(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e}function n(){this.raw=[],this.length=0}function o(){return"___"+k++}function i(e,t){var n=new Function;n.prototype=t.prototype,e.prototype=new n,e.prototype.constructor=e}function r(e){return x[e]}function s(e){return'"'+e.replace(/\x5C/g,"\\\\").replace(/"/g,'\\"').replace(/\x0A/g,"\\n").replace(/\x09/g,"\\t").replace(/\x0D/g,"\\r")+'"'}function a(e){return e.replace(/[\^\[\]\$\(\)\{\}\?\*\.\+]/g,function(e){return"\\"+e})}function l(e){var t=arguments;return e.replace(/\{([0-9]+)\}/g,function(e,n){return t[n-0+1]})}function u(e){return e=e.replace(/^\s*\*/,""),l('gv({0},["{1}"])',s(e),e.replace(/\[['"]?([^'"]+)['"]?\]/g,function(e,t){return"."+t}).split(".").join('","'))}function c(e,t,n,o,i,r){for(var s=n.length,a=e.split(t),l=0,u=[],c=0,d=a.length;d>c;c++){var h=a[c];if(c){var f=1;for(l++;;){var p=h.indexOf(n);if(0>p){u.push(l>1&&f?t:"",h);break}if(l=o?l-1:0,u.push(l>0&&f?t:"",h.slice(0,p),l>0?n:""),h=h.slice(p+s),f=0,0===l)break}0===l&&(i(u.join("")),r(h),u=[])}else h&&r(h)}l>0&&u.length>0&&(r(t),r(u.join("")))}function d(e,t,n){var o,i=[],r=t.options,a="",l="",h="",f="";return n&&(a="ts(",l=")",h=P,f=H,o=r.defaultFilter),c(e,r.variableOpen,r.variableClose,1,function(e){n&&e.indexOf("|")<0&&o&&(e+="|"+o);var r=e.indexOf("|"),s=(r>0?e.slice(0,r):e).replace(/^\s+/,"").replace(/\s+$/,""),c=r>0?e.slice(r+1):"",p=0===s.indexOf("*"),g=[p?"":a,u(s),p?"":l];if(c){c=d(c,t);for(var m=c.split("|"),v=0,w=m.length;w>v;v++){/^\s*([a-z0-9_-]+)(\((.*)\))?\s*$/i.test(m[v])&&(g.unshift('fs["'+RegExp.$1+'"]('),RegExp.$3&&g.push(",",RegExp.$3),g.push(")"))}}i.push(h,g.join(""),f)},function(e){i.push(h,n?s(e):e,f)}),i.join("")}function h(e,t){this.value=e,this.engine=t}function f(e,t){this.value=e,this.engine=t,this.children=[],this.cloneProps=[]}function p(e,t){var n=e.stack,o=t?n.find(function(e){return e instanceof t}):n.bottom();if(o){for(var i;(i=n.top())!==o;){if(!i.autoClose)throw new Error(i.type+" must be closed manually: "+i.value);i.autoClose(e)}o.close(e)}return o}function g(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(\s*master\s*=\s*([a-z0-9\/_-]+)\s*\))?\s*/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.master=RegExp.$3,this.name=RegExp.$1,f.call(this,e,t),this.blocks={}}function m(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name"]}function v(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,f.call(this,e,t),this.cloneProps=["name","state","blocks"],this.blocks={}}function w(e,t){if(!/^\s*([a-z0-9_]+)\s*=([\s\S]*)$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.expr=RegExp.$2,f.call(this,e,t),this.cloneProps=["name","expr"]}function y(e,t){if(!/^\s*([a-z0-9_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function b(e,t){if(!/^\s*([a-z0-9\/_-]+)\s*(\(([\s\S]*)\))?\s*$/i.test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.name=RegExp.$1,this.args=RegExp.$3,f.call(this,e,t),this.cloneProps=["name","args"]}function C(e,t){if(!new RegExp(l("^\\s*({0}[\\s\\S]+{1})\\s+as\\s+{0}([0-9a-z_]+){1}\\s*(,\\s*{0}([0-9a-z_]+){1})?\\s*$",a(t.options.variableOpen),a(t.options.variableClose)),"i").test(e))throw new Error("Invalid "+this.type+" syntax: "+e);this.list=RegExp.$1,this.item=RegExp.$2,this.index=RegExp.$4,f.call(this,e,t),this.cloneProps=["list","item","index"]}function _(e,t){f.call(this,e,t)}function S(e,t){_.call(this,e,t)}function T(e,t){f.call(this,e,t)}function E(e,t){t.target=e;var n=t.engine,o=e.name;if(n.targets[o])switch(n.options.namingConflict){case"override":n.targets[o]=e,t.targets.push(o);case"ignore":break;default:throw new Error("Target exists: "+o)}else n.targets[o]=e,t.targets.push(o)}function R(e,t){I[e]=t,t.prototype.type=e}function M(e){this.options={commandOpen:"\x3c!--",commandClose:"--\x3e",commandSyntax:/^\s*(\/)?([a-z]+)\s*(?::([\s\S]*))?$/,variableOpen:"${",variableClose:"}",defaultFilter:"html"},this.config(e),this.targets={},this.filters=t({},D)}function O(e,t){function o(){var e;if(d.length>0&&(e=d.join(""))){var n=new h(e,t);n.beforeAdd(u),l.top().addChild(n),d=[],t.options.strip&&u.current instanceof f&&(n.value=e.replace(/^[\x20\t\r]*\n/,"")),u.current=n}}var i,r=t.options.commandOpen,s=t.options.commandClose,a=t.options.commandSyntax,l=new n,u={engine:t,targets:[],stack:l,target:null},d=[];return c(e,r,s,0,function(e){var n=a.exec(e);if(n&&(i=I[n[2].toLowerCase()])&&"function"==typeof i){o();var l=u.current;t.options.strip&&l instanceof h&&(l.value=l.value.replace(/\r?\n[\x20\t]*$/,"\n")),n[1]?l=p(u,i):(l=new i(n[3],t),"function"==typeof l.beforeOpen&&l.beforeOpen(u),l.open(u)),u.current=l}else/^\s*\/\//.test(e)||d.push(r,e,s);i=null},function(e){d.push(e)}),o(),p(u),u.targets}n.prototype={push:function(e){this.raw[this.length++]=e},pop:function(){if(this.length>0){var e=this.raw[--this.length];return this.raw.length=this.length,e}},top:function(){return this.raw[this.length-1]},bottom:function(){return this.raw[0]},find:function(e){for(var t=this.length;t--;){var n=this.raw[t];if(e(n))return n}}};var k=178245,x={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"},D={html:function(e){return e.replace(/[&<>"']/g,r)},url:encodeURIComponent,raw:function(e){return e}},A='var r="";',P="r+=",H=";",N="return r;";"undefined"!=typeof navigator&&/msie\s*([0-9]+)/i.test(navigator.userAgent)&&RegExp.$1-0<8&&(A="var r=[],ri=0;",P="r[ri++]=",N='return r.join("");'),h.prototype={getRendererBody:function(){var e=this.value,t=this.engine.options;return!e||t.strip&&/^\s*$/.test(e)?"":d(e,this.engine,1)},clone:function(){return this}},f.prototype={addChild:function(e){this.children.push(e)},open:function(e){var t=e.stack.top();t&&t.addChild(this),e.stack.push(this)},close:function(e){e.stack.top()===this&&e.stack.pop()},getRendererBody:function(){for(var e=[],t=this.children,n=0;n<t.length;n++)e.push(t[n].getRendererBody());return e.join("")},clone:function(){for(var e=new this.constructor(this.value,this.engine),t=0,n=this.children.length;n>t;t++)e.addChild(this.children[t].clone());for(var t=0,n=this.cloneProps.length;n>t;t++){var o=this.cloneProps[t];e[o]=this[o]}return e}};i(g,f),i(m,f),i(v,f),i(w,f),i(y,f),i(b,f),i(C,f),i(_,f),i(S,_),i(T,_);var L={READING:1,READED:2,APPLIED:3,READY:4};v.prototype.applyMaster=g.prototype.applyMaster=function(e){function t(e){var o=e.children;if(o instanceof Array)for(var i=0,r=o.length;r>i;i++){var s=o[i];s instanceof m&&n[s.name]&&(s=o[i]=n[s.name]),t(s)}}if(this.state>=L.APPLIED)return 1;var n=this.blocks,o=this.engine.targets[e];return o&&o.applyMaster(o.master)?(this.children=o.clone().children,t(this),this.state=L.APPLIED,1):void 0},g.prototype.isReady=function(){function e(o){for(var i=0,r=o.children.length;r>i;i++){var s=o.children[i];if(s instanceof v){var a=t.targets[s.name];n=n&&a&&a.isReady(t)}else s instanceof f&&e(s)}}if(this.state>=L.READY)return 1;var t=this.engine,n=1;return this.applyMaster(this.master)?(e(this),n&&(this.state=L.READY),n):void 0},g.prototype.getRenderer=function(){if(this.renderer)return this.renderer;if(this.isReady()){var e=new Function("data","engine",['data=data||{};var v={},fs=engine.filters,hg=typeof data.get=="function",gv=function(n,ps){var p=ps[0],d=v[p];if(d==null){if(hg){return data.get(n);}d=data[p];}for(var i=1,l=ps.length;i<l;i++)if(d!=null)d = d[ps[i]];return d;},ts=function(s){if(typeof s==="string"){return s;}if(s==null){s="";}return ""+s;};',A,this.getRendererBody(),N].join("\n")),t=this.engine;return this.renderer=function(n){return e(n,t)},this.renderer}return null},g.prototype.open=function(e){p(e),f.prototype.open.call(this,e),this.state=L.READING,E(this,e)},w.prototype.open=b.prototype.open=function(e){e.stack.top().addChild(this)},m.prototype.open=function(e){f.prototype.open.call(this,e),(e.imp||e.target).blocks[this.name]=this},S.prototype.open=function(e){(new T).open(e),p(e,_).addChild(this),e.stack.push(this)},T.prototype.open=function(e){p(e,_).addChild(this),e.stack.push(this)},v.prototype.open=function(e){this.parent=e.stack.top(),this.target=e.target,f.prototype.open.call(this,e),this.state=L.READING,e.imp=this},b.prototype.close=w.prototype.close=function(){},v.prototype.close=function(e){f.prototype.close.call(this,e),this.state=L.READED,e.imp=null},g.prototype.close=function(e){f.prototype.close.call(this,e),this.state=this.master?L.READED:L.APPLIED,e.target=null},v.prototype.autoClose=function(e){var t=this.parent.children;t.push.apply(t,this.children),this.children.length=0;for(var n in this.blocks)this.target.blocks[n]=this.blocks[n];this.blocks={},this.close(e)},b.prototype.beforeOpen=v.prototype.beforeOpen=w.prototype.beforeOpen=C.prototype.beforeOpen=y.prototype.beforeOpen=m.prototype.beforeOpen=_.prototype.beforeOpen=h.prototype.beforeAdd=function(e){if(!e.stack.bottom()){new g(o(),e.engine).open(e)}},v.prototype.getRendererBody=function(){return this.applyMaster(this.name),f.prototype.getRendererBody.call(this)},b.prototype.getRendererBody=function(){return l("{0}engine.render({2},{{3}}){1}",P,H,s(this.name),d(this.args,this.engine).replace(/(^|,)\s*([a-z0-9_]+)\s*=/gi,function(e,t,n){return(t||"")+s(n)+":"}))},w.prototype.getRendererBody=function(){return this.expr?l("v[{0}]={1};",s(this.name),d(this.expr,this.engine)):""},_.prototype.getRendererBody=function(){return l("if({0}){{1}}",d(this.value,this.engine),f.prototype.getRendererBody.call(this))},T.prototype.getRendererBody=function(){return l("}else{{0}",f.prototype.getRendererBody.call(this))},C.prototype.getRendererBody=function(){return l('var {0}={1};if({0} instanceof Array)for (var {4}=0,{5}={0}.length;{4}<{5};{4}++){v[{2}]={4};v[{3}]={0}[{4}];{6}}else if(typeof {0}==="object")for(var {4} in {0}){v[{2}]={4};v[{3}]={0}[{4}];{6}}',o(),d(this.list,this.engine),s(this.index||o()),s(this.item),o(),o(),f.prototype.getRendererBody.call(this))},y.prototype.getRendererBody=function(){var e=this.args;return l("{2}fs[{5}]((function(){{0}{4}{1}})(){6}){3}",A,N,P,H,f.prototype.getRendererBody.call(this),s(this.name),e?","+d(e,this.engine):"")};var I={};R("target",g),R("block",m),R("import",v),R("use",b),R("var",w),R("for",C),R("if",_),R("elif",S),R("else",T),R("filter",y),M.prototype.config=function(e){t(this.options,e)},M.prototype.compile=M.prototype.parse=function(e){if(e){var t=O(e,this);if(t.length)return this.targets[t[0]].getRenderer()}return new Function('return ""')},M.prototype.getRenderer=function(e){var t=this.targets[e];return t?t.getRenderer():void 0},M.prototype.render=function(e,t){var n=this.getRenderer(e);return n?n(t):""},M.prototype.addFilter=function(e,t){"function"==typeof t&&(this.filters[e]=t)};var W=new M;W.Engine=M,"object"==typeof exports&&"object"==typeof module?exports=module.exports=W:"function"==typeof define&&define.amd?define("etpl",W):e.etpl=W}(this),define("dt/tpl",["require","etpl","./lib"],function(e){function t(e){for(var t=!1,n=!1,o=1;o<arguments.length;o++)"raw"===arguments[o]&&(t=!0),"null"===arguments[o]&&(n=!0);return null!=e||n||(e=""),i.obTypeOf(e)&&(e=e()),e=String(e),t?e:i.encodeHTML(e)}function n(e){return null==e&&(e=""),String(e).replace(/^option\./,"")}var o=e("etpl"),i=e("./lib"),r={};return o.config({commandOpen:"{{",commandClose:"}}",defaultFilter:"ob"}),o.addFilter("ob",t),o.addFilter("dsp",n),r.render=function(e,t,n){return!o.getRenderer(e)&&n&&o.compile(n),o.render(e,t||{})},r}),define("dt/ui/Component",["require","jquery","dt/lib","dt/tpl"],function(e){function t(){function e(e){t.disabled(e)}var t=this._viewModel();t.visible=m.ob(!0);var n=t.disabled;t.disabled=m.ob(!1),null!=n&&this._disposable(n.subscribe(e,this))}function n(e){if(e){var t=b(this);e=t.$el=g(e),t.el=e[0],m.bindComponent(e,this),e.addClass(this.getFullCss().join(" "));var n=this._viewModel(),r=n.disabled,s=n.visible;this._disposable(r.subscribe(o,this)),this._disposable(s.subscribe(i,this)),o.call(this,r()),s("none"!==e[0].style.display)}}function o(e){this.$el()[e?"addClass":"removeClass"](this.getFullCss("-disabled").join(" "))}function i(e){this.$el()[e?"show":"hide"]()}function r(){var e=b(this).cptDef.tplTarget||this._getDefineProperty("tplTarget"),t=this.$el();e&&t&&t.length&&this._renderTpl(e,null,t),!this._getDefineProperty("suppressConstructSub")&&t&&t.length&&this._constructSub(t)}function s(){var e=this.$el(),t=b(this);e.off(t.eventNamespace),e.removeClass(this.getFullCss().join(" ")),t.viewModel=null,t.el=null,t.$el=null,t.subComponents=null,t.sub$Els=null,m.bindComponent(e,!1)}function a(e,t,n){if(!n&&m.isComponent(e)||n&&m.isJQuery(e))t(e);else if("object"===g.type(e)&&!m.isAtom(e))for(var o in e)e.hasOwnProperty(o)&&null!=e[o]&&a(e[o],t,n)}function l(e){var t=b(this),n=t.viewModel={},o=this;return this._traverseFromAncestor(function(e){n=m.merge(n,e.defineProperties.viewModel.call(o),{onlyMergeOwnPropertyInTarget:!1,levelOneNeedMerge:null,clone:!1})}),n=m.merge(n,e,{onlyMergeOwnPropertyInTarget:!!this._getDefineProperty("viewModelOnlyAccessDeclaredProperties"),levelOneNeedMerge:t.viewModelMergeMap||{}}),t.viewModel=n,n}function u(){var e=b(this),t=e.viewModelPublicMap={},n=e.viewModelMergeMap={};this._traverseFromAncestor(function(e){for(var o=e.defineProperties.viewModelPublic||[],i=0,r=o.length;i<r;i++)t[o[i]]=1;for(var s=e.defineProperties.viewModelMerge||[],i=0,r=s.length;i<r;i++)n[s[i]]=1})}function c(){var e=this._viewModel(),t=b(this),n=[];this._traverseFromAncestor(function(e){var t=e.defineProperties.css;g.isArray(t)?n.push.apply(n,t):t&&n.push(t)}),t.basicCss=n;var o=e&&e.css||[];g.isArray(o)||(o=[o]),t.extraCss=o}function d(e){return e=w.normalizePath(e),!!b(this).viewModelPublicMap[e]}function h(e){if(e&&g.isFunction(e.dispose))try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}else e&&m.isJQuery(e)&&e.off(this._event())}function f(e){if(e=e||b(this).subComponents,a(e,function(e){try{e.dispose()}catch(e){if(C.debug)throw e;C.printLog&&C.printLog.error(e)}}),!m.isAtom(e))for(var t in e)e.hasOwnProperty(t)&&(e[t]=null)}function p(e){e=e||b(this).sub$els;var t=this._event();if(a(e,function(e){e.off(t)},!0),!m.isAtom(e))for(var n in e)e.hasOwnProperty(n)&&(e[n]=null)}var g=e("jquery"),m=e("dt/lib"),v=e("dt/tpl"),w=m.getByPath,y=m.setByPath,b=m.makeInner(),C=b.attach(m.newClass(m.enableEvent({_define:{tpl:"",tplTarget:"",css:"",viewModel:function(){return{disabled:null,visible:null,css:"",tplTarget:null,tplRenderMode:"html"}},viewModelPublic:["disabled","visible"],viewModelMerge:[],viewModelOnlyAccessDeclaredProperties:!0,suppressConstructSub:!1},_prepare:g.noop,_init:g.noop,_dispose:g.noop,_disposeFinally:g.noop,_run:g.noop,_event:function(e){var t=b(this).eventNamespace;return(null!=e?e:"")+t},_parseViewModel:function(e,t){return e},_parseCptDef:function(e){return e},_construct:function(e,o,i){arguments.length>0&&m.assert(null!=e),!e||g.isPlainObject(e)?(i=o,o=e,e=null):e=g(e),i=g.extend({},i),m.isComponent(this,!0);var s=b(this);s.cptDef=i,s.eventNamespace=".namespace"+m.localUID(),s.subComponents={},s.sub$Els={},s.disposed=!1,s.cptDisposableArea={},s.cptInstanceUID="cpt-instance-"+m.localUID(),u.call(this),o=this._parseViewModel(o||{},i)||{},l.call(this,o),c.call(this),t.call(this),n.call(this,e),this._prepare(),r.call(this),this._init()},dispose:function(){var e=b(this);if(!e.disposed){var t=this.el(),n=this["__originalHTML"]||"";this._dispose(),f.call(this),p.call(this),this._disposable(!1),s.call(this),this._disposeFinally(),t.innerHTML=n,e.disposed=!0}},isDisposed:function(){return!!b(this).disposed},isFrozen:function(){return this._viewModel().disabled()||this.isDisposed()},_disposable:function(e,t){m.assert(null!=e);var n=b(this).cptDisposableArea;if(null==e)return e;if(!1===e)for(var o in n)n.hasOwnProperty(o)&&(h.call(this,n[o]),n[o]=null);else"string"===g.type(e)?(h.call(this,n[e]),n[e]=null):(m.assert(g.isFunction(e.dispose)||m.isJQuery(e),"No dispose method nor not jQuery!"),t=t||"-component-anonymouse-disposable"+m.localUID(),n[t]=e);return e},resize:g.noop,_manuInitView:function(e){n.call(this,e),this._constructSub(e)},_applyTpl:function(e,t){t&&(this._renderTpl(t,null,e),this._constructSub(e))},_renderTpl:function(e,t,n){var o={viewModel:t||this._viewModel(),lang:this.getLang(),constant:this.getConstant()},i=v.render(e,o,this._getDefineProperty("tpl"))||"";return n&&g(n)[this._viewModel().tplRenderMode](i),i},_constructSub:function(e,t){var n=g(e);m.assert(n.length),t&&n.data("cpt")&&this._constructSubCpt.call(this,e);var o=this;g("*[data-cpt]",n).each(function(e,t){o._constructSubCpt(t)})},_constructSubCpt:function(e){var t=g(e),n=e.innerHTML,o=this._viewModel(),i=this._parseCptDef(new Function("viewModel","lib","lang","constant","return {"+t.data("cpt")+"};").call(this,o,m,this.getLang(),this.getConstant())),r=this.getCptClass(i.type),s=i.viewModelGet?w(i.viewModelGet,o):i.viewModel,a=new r(e,s,i);return a["__originalHTML"]=n,this._sub(i.name||"-sub-cpt-name-"+m.localUID(),a)},recreateSubCpt:function(e){var t=this._sub(e);if(t){var n=t.el();t.dispose(),this._sub(e,null),this._constructSubCpt(n)}},traversalRun:function(e){a(b(this).subComponents,function(t){t.traversalRun(e)}),this._run(e)},_sub:function(e,t,n){var o=b(this).subComponents;return arguments.length<2?w(e,o,w.actionChoice.notPlainReturn):(y(e,t,o,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},_getDefineProperty:function(e){return this.constructor.defineProperties[e]},el:function(){return b(this).el},$el:function(e,t,n){var o=b(this);return 0===arguments.length?o.$el:1===arguments.length?w(e,o.sub$Els,w.actionChoice.notPlainReturn):(y(e,t,o.sub$Els,n?y.actionChoice.notPlainOverlap:y.actionChoice.notPlainThrow),t)},css:function(){return this._getDefineProperty("css")||""},viewModel:function(e){if(d.call(this,e))return w(e,b(this).viewModel);throw new Error(e+" is private!")},_viewModel:function(){return b(this).viewModel},getCptClass:function(e){return C.cptClasses[e]},getCptDef:function(e){return b(this).cptDef[e]},uid:function(){return b(this).cptInstanceUID},getFullCss:function(e){var t=["dtui-cpt"],n=b(this);return t.push.apply(t,n.basicCss||[]),t.push.apply(t,n.extraCss||[]),g.map(t,function(t){return t+(e||"")})},isDisabled:function(){return!!m.peek(this._viewModel().disabled)},getLang:function(){return C.defaultLanguageSet},getConstant:function(){return C.defaultConstant},clone:g.noop,_traverseFromAncestor:function(e){for(var t=[],n=this.constructor;n;n=n.prototype._superClass)t.push(n);for(var o=t.length;o--;)e.call(this,t[o])},localOb:function(e,t){var n,o=b(this),i=o.localObRepo||(o.localObRepo={});return arguments.length>1?!1===t?(n=i[e],delete i[e]):(m.assert(null==i[e]),n=i[e]=t):n=i[e],n},getAncestorLocalOb:function(e){for(var t,n,o=this.$el();(o=o&&o.parent())[0]&&!(n=(t=m.getComponent(o))&&t.localOb(e))&&o[0]!==document.body;);return n}})));return C.cptClasses={},C.defaultLanguageSet={},C.defaultConstant={},C.consoleLog=function(e){var t=window.console;m.isObject(t)&&"function"==typeof t.log&&t.log(m.stringifyJSON(e))},C}),define("spreadsheet/lang",["require","jquery"],function(e){var t=e("jquery"),n={langCode:"zh",pageTitle:"表格数据转换工具",pageDescHTML:"使用说明:在<strong>左侧</strong>贴入数据&nbsp;&nbsp;<strong>右下方</strong>立刻产生结果",typeSetting:"结果类型:",emptyValueSetting:"空值设置:",quotationMarkSetting:"引号设置:",quotationMarks:{singleQuotes:"单引号",doubleQuotes:"双引号"},dimensionSetting:"维度设置:",attributeSetting:"属性设置:",codeFormatSetting:"格式化:",codeFormat:{compressed:"压缩",expanded2Indent:"展开(2空格缩进)",expanded4Indent:"展开(4空格缩进)"},convertResult:"转换结果:",dimDesc:{dimallto2:"整体转换成一个二维数组",dim1to1:"每一列转换为一个一维数组",dim1to2:"每一列转换成一个二维数组",dim2to2:"每二列转换成一个二维数组",dim3to2:"每三列转换成一个二维数组",dim4to2:"每四列转换成一个二维数组",dim5to2:"每五列转换成一个二维数组",dim6to2:"每六列转换成一个二维数组"},codeInputTitle:"#{rangeDesc} 列转换结果:",attrInfoTitle:"列 #{colName} ",attrInfoAttrName:"属性名:",attrInfoType:"类型:",ecEmptyValue:"ECharts标准空值(中划线:'-')",jsDataTypeDimArray:"纯数组",jsDataTypeArrayObject:"数组+对象",jsDataTypeGEO:"地理坐标",outputFormat:"结果格式:",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"在第一列贴入国家或地区名称,然后点击:",geoConvertBtn:"转换成坐标",geoDesc:"结果解释:B 列:经度,C 列:纬度,D 列:2位简称",dataTableControl:{clear:"清空",lt:"⇱",rb:"⇲",l:"⇇",r:"⇉",t:"⇈",b:"⇊"}},o={langCode:"en",pageTitle:"Spreadsheet Data Converter",pageDescHTML:"Tip: Paste data on the <strong>left</strong>, and get result <strong>below</strong> immediately.",typeSetting:"Type: ",emptyValueSetting:"Empty Value: ",quotationMarkSetting:"Quotation Mark: ",quotationMarks:{singleQuotes:"single quotation mark",doubleQuotes:"double quotation mark"},dimensionSetting:"Dimension: ",dimDesc:{dim1to1:"Convert to a 1-dimension array every column.",dimallto2:"Convert all of the data to a 2-dimension array.",dim1to2:"Convert to a 2-dimension array every column.",dim2to2:"Convert to a 2-dimension array every 2 columns.",dim3to2:"Convert to a 2-dimension array every 3 columns.",dim4to2:"Convert to a 2-dimension array every 4 columns.",dim5to2:"Convert to a 2-dimension array every 5 columns."},attributeSetting:"Attributes: ",codeFormatSetting:"Formatting Result: ",codeFormat:{compressed:"compress",expanded2Indent:"expand and indent with 2 spaces",expanded4Indent:"expand and indent with 4 spaces"},convertResult:"Result: ",codeInputTitle:"Result from Column #{rangeDesc}:",attrInfoTitle:"Column #{colName} ",attrInfoAttrName:"Attr name: ",attrInfoType:"Type: ",ecEmptyValue:"ECharts Empty Value ('-')",jsDataTypeDimArray:"Array",jsDataTypeArrayObject:"Array + Object",jsDataTypeGEO:"GEO Coordinate",outputFormat:"Result Format: ",outputFormatJS:"JavaScript",outputFormatJSON:"JSON",geoConvertDesc:"Paste names of countries or regions, and then click: ",geoConvertBtn:"Convert",geoDesc:"Explanation:B: longitude, C: latitude, D: alpha-2",dataTableControl:{clear:"Clear",lt:"⇱",rb:"⇲",l:"⇦",r:"⇨",t:"⇧",b:"⇩"}};return(window.EC_WWW_LANG||t("html").attr("lang")||"").toLowerCase().indexOf("zh")>-1?n:o}),define("spreadsheet/constant",["require"],function(e){var t={};return t.EC_EMPTY_VALUE="-",t.JSDATA_UPDATE_DELAY=700,t.JSDATA_DIM_ARRAY="dimArray",t.JSDATA_ARRAY_OBJECT="arrayObject",t.JSDATA_GEO="geo",t.UI_DATA_TABLE="dataTable",t.UI_CODE_INPUTS="codeInputs",t}),define("spreadsheet/helper",["require","jquery"],function(e){var t=e("jquery"),n={};return n.formatJSDataToEditorData=function(e,t,n){return e===t.getEmptyValue()?n.getEmptyValue():e},n.formatEditorDataToJSData=function(e,t,n){return e===n.getEmptyValue()?t.getEmptyValue():e},n.objectPropertyCount=function(e){e=e||{};var t=0;for(var n in e)e.hasOwnProperty(n)&&t++;return t},n.parseToArray=function(e){var n;try{n=new Function("return ("+e+")")()}catch(e){}return t.isArray(n)||(n=null),n},n}),function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define("handsontable",[],e);else{var t;t="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this,t.Handsontable=e()}}(function(){var e;return function e(t,n,o){function i(a,l){if(!n[a]){if(!t[a]){var u="function"==typeof require&&require;if(!l&&u)return u(a,!0);if(r)return r(a,!0);if(s[a]&&void 0!==window[s[a]])return window[s[a]];var c=new Error("Cannot find module '"+a+"'");throw c.code="MODULE_NOT_FOUND",c}var d=n[a]={exports:{}};t[a][0].call(d.exports,function(e){var n=t[a][1][e];return i(n||e)},d,d.exports,e,t,n,o)}return n[a].exports}for(var r="function"==typeof require&&require,s=JSON.parse('{"zeroclipboard":"ZeroClipboard","moment":"moment","numbro":"numbro","pikaday":"Pikaday"}')||{},a=0;a<o.length;a++)i(o[a]);return i}({1:[function(e,t,n){},{}],2:[function(e,t,n){window.jQuery&&function(e){e.fn.handsontable=function(e){var t,n,o,i,r,s=this.first(),a=s.data("handsontable");if("string"!=typeof e)return r=e||{},a?a.updateSettings(r):(a=new Handsontable.Core(s[0],r),s.data("handsontable",a),a.init()),s;if(o=[],arguments.length>1)for(t=1,n=arguments.length;t<n;t++)o.push(arguments[t]);if(a){if(void 0===a[e])throw new Error("Handsontable do not provide action: "+e);i=a[e].apply(a,o),"destroy"===e&&s.removeData()}return i}}(window.jQuery)},{}],3:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableBorder:{get:function(){return C}},__esModule:{value:!0}});var o,i,r,s,a,l,u=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},c=u.getComputedStyle,d=u.getTrimmingContainer,h=u.innerWidth,f=u.innerHeight,p=u.offset,g=u.outerHeight,m=u.outerWidth,v=((i=e("helpers/dom/event"))&&i.__esModule&&i||{default:i}).stopImmediatePropagation,w=((r=e("helpers/browser"))&&r.__esModule&&r||{default:r}).isMobileBrowser,y=((s=e("eventManager"))&&s.__esModule&&s||{default:s}).EventManager,b=((a=e("cell/coords"))&&a.__esModule&&a||{default:a}).WalkontableCellCoords,C=((l=e("overlay/_base.js"))&&l.__esModule,function(e,t){t&&(this.eventManager=new y(e),this.instance=e,this.wot=e,this.settings=t,this.mouseDown=!1,this.main=null,this.top=null,this.left=null,this.bottom=null,this.right=null,this.topStyle=null,this.leftStyle=null,this.bottomStyle=null,this.rightStyle=null,this.cornerDefaultStyle={width:"5px",height:"5px",borderWidth:"2px",borderStyle:"solid",borderColor:"#FFF"},this.corner=null,this.cornerStyle=null,this.createBorders(t),this.registerListeners())});$traceurRuntime.createClass(C,{registerListeners:function(){var e=this;this.eventManager.addEventListener(document.body,"mousedown",function(){return e.onMouseDown()}),this.eventManager.addEventListener(document.body,"mouseup",function(){return e.onMouseUp()});for(var t=this,n=0,o=this.main.childNodes.length;n<o;n++)!function(n,o){t.eventManager.addEventListener(t.main.childNodes[n],"mouseenter",function(t){return e.onMouseEnter(t,e.main.childNodes[n])})}(n)},onMouseDown:function(){this.mouseDown=!0},onMouseUp:function(){this.mouseDown=!1},onMouseEnter:function(e,t){function n(e){return e.clientY<Math.floor(r.top)||e.clientY>Math.ceil(r.top+r.height)||e.clientX<Math.floor(r.left)||e.clientX>Math.ceil(r.left+r.width)||void 0}function o(e){n(e)&&(i.eventManager.removeEventListener(document.body,"mousemove",o),t.style.display="block")}if(this.mouseDown&&this.wot.getSetting("hideBorderOnMouseDownOver")){e.preventDefault(),v(e);var i=this,r=t.getBoundingClientRect();t.style.display="none",this.eventManager.addEventListener(document.body,"mousemove",o)}},createBorders:function(e){this.main=document.createElement("div");var t=["top","left","bottom","right","corner"],n=this.main.style;n.position="absolute",n.top=0,n.left=0;for(var o=0;o<5;o++){var i=t[o],r=document.createElement("div");r.className="wtBorder "+(this.settings.className||""),this.settings[i]&&this.settings[i].hide&&(r.className+=" hidden"),n=r.style,n.backgroundColor=this.settings[i]&&this.settings[i].color?this.settings[i].color:e.border.color,n.height=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",n.width=this.settings[i]&&this.settings[i].width?this.settings[i].width+"px":e.border.width+"px",this.main.appendChild(r)}this.top=this.main.childNodes[0],this.left=this.main.childNodes[1],this.bottom=this.main.childNodes[2],this.right=this.main.childNodes[3],this.topStyle=this.top.style,this.leftStyle=this.left.style,this.bottomStyle=this.bottom.style,this.rightStyle=this.right.style,this.corner=this.main.childNodes[4],this.corner.className+=" corner",this.cornerStyle=this.corner.style,this.cornerStyle.width=this.cornerDefaultStyle.width,this.cornerStyle.height=this.cornerDefaultStyle.height,this.cornerStyle.border=[this.cornerDefaultStyle.borderWidth,this.cornerDefaultStyle.borderStyle,this.cornerDefaultStyle.borderColor].join(" "),w()&&this.createMultipleSelectorHandles(),this.disappear(),this.wot.wtTable.bordersHolder||(this.wot.wtTable.bordersHolder=document.createElement("div"),this.wot.wtTable.bordersHolder.className="htBorders",this.wot.wtTable.spreader.appendChild(this.wot.wtTable.bordersHolder)),this.wot.wtTable.bordersHolder.insertBefore(this.main,this.wot.wtTable.bordersHolder.firstChild)},createMultipleSelectorHandles:function(){this.selectionHandles={topLeft:document.createElement("DIV"),topLeftHitArea:document.createElement("DIV"),bottomRight:document.createElement("DIV"),bottomRightHitArea:document.createElement("DIV")};this.selectionHandles.topLeft.className="topLeftSelectionHandle",this.selectionHandles.topLeftHitArea.className="topLeftSelectionHandle-HitArea",this.selectionHandles.bottomRight.className="bottomRightSelectionHandle",this.selectionHandles.bottomRightHitArea.className="bottomRightSelectionHandle-HitArea",this.selectionHandles.styles={topLeft:this.selectionHandles.topLeft.style,topLeftHitArea:this.selectionHandles.topLeftHitArea.style,bottomRight:this.selectionHandles.bottomRight.style,
 bottomRightHitArea:this.selectionHandles.bottomRightHitArea.style};var e={position:"absolute",height:"40px",width:"40px","border-radius":parseInt(40/1.5,10)+"px"};for(var t in e)e.hasOwnProperty(t)&&(this.selectionHandles.styles.bottomRightHitArea[t]=e[t],this.selectionHandles.styles.topLeftHitArea[t]=e[t]);var n={position:"absolute",height:"10px",width:"10px","border-radius":parseInt(10/1.5,10)+"px",background:"#F5F5FF",border:"1px solid #4285c8"};for(var o in n)n.hasOwnProperty(o)&&(this.selectionHandles.styles.bottomRight[o]=n[o],this.selectionHandles.styles.topLeft[o]=n[o]);this.main.appendChild(this.selectionHandles.topLeft),this.main.appendChild(this.selectionHandles.bottomRight),this.main.appendChild(this.selectionHandles.topLeftHitArea),this.main.appendChild(this.selectionHandles.bottomRightHitArea)},isPartRange:function(e,t){return!(!this.wot.selections.area.cellRange||e==this.wot.selections.area.cellRange.to.row&&t==this.wot.selections.area.cellRange.to.col)},updateMultipleSelectionHandlesPosition:function(e,t,n,o,i,r){var s=parseInt(this.selectionHandles.styles.topLeft.width,10),a=parseInt(this.selectionHandles.styles.topLeftHitArea.width,10);this.selectionHandles.styles.topLeft.top=parseInt(n-s,10)+"px",this.selectionHandles.styles.topLeft.left=parseInt(o-s,10)+"px",this.selectionHandles.styles.topLeftHitArea.top=parseInt(n-a/4*3,10)+"px",this.selectionHandles.styles.topLeftHitArea.left=parseInt(o-a/4*3,10)+"px",this.selectionHandles.styles.bottomRight.top=parseInt(n+r,10)+"px",this.selectionHandles.styles.bottomRight.left=parseInt(o+i,10)+"px",this.selectionHandles.styles.bottomRightHitArea.top=parseInt(n+r-a/4,10)+"px",this.selectionHandles.styles.bottomRightHitArea.left=parseInt(o+i-a/4,10)+"px",this.settings.border.multipleSelectionHandlesVisible&&this.settings.border.multipleSelectionHandlesVisible()?(this.selectionHandles.styles.topLeft.display="block",this.selectionHandles.styles.topLeftHitArea.display="block",this.isPartRange(e,t)?(this.selectionHandles.styles.bottomRight.display="none",this.selectionHandles.styles.bottomRightHitArea.display="none"):(this.selectionHandles.styles.bottomRight.display="block",this.selectionHandles.styles.bottomRightHitArea.display="block")):(this.selectionHandles.styles.topLeft.display="none",this.selectionHandles.styles.bottomRight.display="none",this.selectionHandles.styles.topLeftHitArea.display="none",this.selectionHandles.styles.bottomRightHitArea.display="none"),e==this.wot.wtSettings.getSetting("fixedRowsTop")||t==this.wot.wtSettings.getSetting("fixedColumnsLeft")?(this.selectionHandles.styles.topLeft.zIndex="9999",this.selectionHandles.styles.topLeftHitArea.zIndex="9999"):(this.selectionHandles.styles.topLeft.zIndex="",this.selectionHandles.styles.topLeftHitArea.zIndex="")},appear:function(e){if(!this.disabled){var t,n,o,i,r,s,a,l,u,v,y,C,_,S,T,E,R,M;M=this.wot.wtTable.getRenderedRowsCount();for(var O=0;O<M;O++){var k=this.wot.wtTable.rowFilter.renderedToSource(O);if(k>=e[0]&&k<=e[2]){_=k;break}}for(var x=M-1;x>=0;x--){var D=this.wot.wtTable.rowFilter.renderedToSource(x);if(D>=e[0]&&D<=e[2]){T=D;break}}M=this.wot.wtTable.getRenderedColumnsCount();for(var A=0;A<M;A++){var P=this.wot.wtTable.columnFilter.renderedToSource(A);if(P>=e[1]&&P<=e[3]){S=P;break}}for(var H=M-1;H>=0;H--){var N=this.wot.wtTable.columnFilter.renderedToSource(H);if(N>=e[1]&&N<=e[3]){E=N;break}}if(void 0===_||void 0===S)return void this.disappear();t=_!==T||S!==E,n=this.wot.wtTable.getCell(new b(_,S)),o=t?this.wot.wtTable.getCell(new b(T,E)):n,i=p(n),r=t?p(o):i,s=p(this.wot.wtTable.TABLE),l=i.top,y=r.top+g(o)-l,v=i.left,C=r.left+m(o)-v,a=l-s.top-1,u=v-s.left-1;var L=c(n);parseInt(L.borderTopWidth,10)>0&&(a+=1,y=y>0?y-1:0),parseInt(L.borderLeftWidth,10)>0&&(u+=1,C=C>0?C-1:0),this.topStyle.top=a+"px",this.topStyle.left=u+"px",this.topStyle.width=C+"px",this.topStyle.display="block",this.leftStyle.top=a+"px",this.leftStyle.left=u+"px",this.leftStyle.height=y+"px",this.leftStyle.display="block";var I=Math.floor(this.settings.border.width/2);this.bottomStyle.top=a+y-I+"px",this.bottomStyle.left=u+"px",this.bottomStyle.width=C+"px",this.bottomStyle.display="block",this.rightStyle.top=a+"px",this.rightStyle.left=u+C-I+"px",this.rightStyle.height=y+1+"px",this.rightStyle.display="block",w()||!this.hasSetting(this.settings.border.cornerVisible)||this.isPartRange(T,E)?this.cornerStyle.display="none":(this.cornerStyle.top=a+y-4+"px",this.cornerStyle.left=u+C-4+"px",this.cornerStyle.borderRightWidth=this.cornerDefaultStyle.borderWidth,this.cornerStyle.width=this.cornerDefaultStyle.width,this.cornerStyle.display="block",R=d(this.wot.wtTable.TABLE),E===this.wot.getSetting("totalColumns")-1&&o.offsetLeft+m(o)>=h(R)&&(this.cornerStyle.left=Math.floor(u+C-3-parseInt(this.cornerDefaultStyle.width)/2)+"px",this.cornerStyle.borderRightWidth=0),T===this.wot.getSetting("totalRows")-1&&o.offsetTop+g(o)>=f(R)&&(this.cornerStyle.top=Math.floor(a+y-3-parseInt(this.cornerDefaultStyle.height)/2)+"px",this.cornerStyle.borderBottomWidth=0)),w()&&this.updateMultipleSelectionHandlesPosition(_,S,a,u,C,y)}},disappear:function(){this.topStyle.display="none",this.leftStyle.display="none",this.bottomStyle.display="none",this.rightStyle.display="none",this.cornerStyle.display="none",w()&&(this.selectionHandles.styles.topLeft.display="none",this.selectionHandles.styles.bottomRight.display="none")},hasSetting:function(e){return"function"==typeof e?e():!!e}},{}),window.WalkontableBorder=C},{"cell/coords":6,eventManager:42,"helpers/browser":44,"helpers/dom/element":47,"helpers/dom/event":48,"overlay/_base.js":12}],4:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableViewportColumnsCalculator:{get:function(){return i}},__esModule:{value:!0}});var o=new WeakMap,i=function(e,t,n,i,r,s,a){var l=void 0!==arguments[7]?arguments[7]:function(e){return e};o.set(this,{viewportWidth:e,scrollOffset:t,totalColumns:n,columnWidthFn:i,overrideFn:r,onlyFullyVisible:s,stretchingColumnWidthFn:l}),this.count=0,this.startColumn=null,this.endColumn=null,this.startPosition=null,this.stretchAllRatio=0,this.stretchLastWidth=0,this.stretch=a,this.totalTargetWidth=0,this.needVerifyLastColumnWidth=!0,this.stretchAllColumnsWidth=[],this.calculate()},r=i;$traceurRuntime.createClass(i,{calculate:function(){for(var e,t=0,n=!0,i=[],r=o.get(this),s=r.onlyFullyVisible,a=r.overrideFn,l=r.scrollOffset,u=r.totalColumns,c=r.viewportWidth,d=0;d<u;d++)if(e=this._getColumnWidth(d),t<=l&&!s&&(this.startColumn=d),t>=l&&t+e<=l+c&&(null==this.startColumn&&(this.startColumn=d),this.endColumn=d),i.push(t),t+=e,s||(this.endColumn=d),t>=l+c){n=!1;break}if(this.endColumn===u-1&&n)for(this.startColumn=this.endColumn;this.startColumn>0;){var h=i[this.endColumn]+e-i[this.startColumn-1];if((h<=c||!s)&&this.startColumn--,h>c)break}null!==this.startColumn&&a&&a(this),this.startPosition=i[this.startColumn],void 0==this.startPosition&&(this.startPosition=null),null!==this.startColumn&&(this.count=this.endColumn-this.startColumn+1)},refreshStretching:function(e){if("none"!==this.stretch){this.totalTargetWidth=e;for(var t=o.get(this),n=t.totalColumns,i=0,r=0;r<n;r++){var s=this._getColumnWidth(r),a=t.stretchingColumnWidthFn(void 0,r);"number"==typeof a?e-=a:i+=s}var l=e-i;if("all"===this.stretch&&l>0)this.stretchAllRatio=e/i,this.stretchAllColumnsWidth=[],this.needVerifyLastColumnWidth=!0;else if("last"===this.stretch&&e!==1/0){var u=this._getColumnWidth(n-1),c=l+u;this.stretchLastWidth=c>=0?c:u}}},getStretchedColumnWidth:function(e,t){var n=null;return"all"===this.stretch&&0!==this.stretchAllRatio?n=this._getStretchedAllColumnWidth(e,t):"last"===this.stretch&&0!==this.stretchLastWidth&&(n=this._getStretchedLastColumnWidth(e)),n},_getStretchedAllColumnWidth:function(e,t){var n=0,i=o.get(this),r=i.totalColumns;if(!this.stretchAllColumnsWidth[e]){var s=Math.round(t*this.stretchAllRatio),a=i.stretchingColumnWidthFn(s,e);this.stretchAllColumnsWidth[e]=void 0===a?s:isNaN(a)?this._getColumnWidth(e):a}if(this.stretchAllColumnsWidth.length===r&&this.needVerifyLastColumnWidth){this.needVerifyLastColumnWidth=!1;for(var l=0;l<this.stretchAllColumnsWidth.length;l++)n+=this.stretchAllColumnsWidth[l];n!==this.totalTargetWidth&&(this.stretchAllColumnsWidth[this.stretchAllColumnsWidth.length-1]+=this.totalTargetWidth-n)}return this.stretchAllColumnsWidth[e]},_getStretchedLastColumnWidth:function(e){return e===o.get(this).totalColumns-1?this.stretchLastWidth:null},_getColumnWidth:function(e){var t=o.get(this).columnWidthFn(e);return void 0===t&&(t=r.DEFAULT_WIDTH),t}},{get DEFAULT_WIDTH(){return 50}}),window.WalkontableViewportColumnsCalculator=i},{}],5:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableViewportRowsCalculator:{get:function(){return i}},__esModule:{value:!0}});var o=new WeakMap,i=function(e,t,n,i,r,s,a){o.set(this,{viewportHeight:e,scrollOffset:t,totalRows:n,rowHeightFn:i,overrideFn:r,onlyFullyVisible:s,horizontalScrollbarHeight:a}),this.count=0,this.startRow=null,this.endRow=null,this.startPosition=null,this.calculate()},r=i;$traceurRuntime.createClass(i,{calculate:function(){for(var e=0,t=!0,n=[],i=o.get(this),s=i.onlyFullyVisible,a=i.overrideFn,l=i.rowHeightFn,u=i.scrollOffset,c=i.totalRows,d=i.viewportHeight,h=i.horizontalScrollbarHeight||0,f=0;f<c;f++){var p=l(f);if(void 0===p&&(p=r.DEFAULT_HEIGHT),e<=u&&!s&&(this.startRow=f),e>=u&&e+p<=u+d-h&&(null===this.startRow&&(this.startRow=f),this.endRow=f),n.push(e),e+=p,s||(this.endRow=f),e>=u+d-h){t=!1;break}}if(this.endRow===c-1&&t)for(this.startRow=this.endRow;this.startRow>0;){var g=n[this.endRow]+p-n[this.startRow-1];if((g<=d-h||!s)&&this.startRow--,g>=d-h)break}null!==this.startRow&&a&&a(this),this.startPosition=n[this.startRow],void 0==this.startPosition&&(this.startPosition=null),null!==this.startRow&&(this.count=this.endRow-this.startRow+1)}},{get DEFAULT_HEIGHT(){return 23}}),window.WalkontableViewportRowsCalculator=i},{}],6:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableCellCoords:{get:function(){return o}},__esModule:{value:!0}});var o=function(e,t){void 0!==e&&void 0!==t?(this.row=e,this.col=t):(this.row=null,this.col=null)};$traceurRuntime.createClass(o,{isValid:function(e){return!(this.row<0||this.col<0||this.row>=e.getSetting("totalRows")||this.col>=e.getSetting("totalColumns"))},isEqual:function(e){return e===this||this.row===e.row&&this.col===e.col},isSouthEastOf:function(e){return this.row>=e.row&&this.col>=e.col},isNorthWestOf:function(e){return this.row<=e.row&&this.col<=e.col},isSouthWestOf:function(e){return this.row>=e.row&&this.col<=e.col},isNorthEastOf:function(e){return this.row<=e.row&&this.col>=e.col}},{}),window.WalkontableCellCoords=o},{}],7:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableCellRange:{get:function(){return r}},__esModule:{value:!0}});var o,i=((o=e("cell/coords"))&&o.__esModule&&o||{default:o}).WalkontableCellCoords,r=function(e,t,n){this.highlight=e,this.from=t,this.to=n},s=r;$traceurRuntime.createClass(r,{isValid:function(e){return this.from.isValid(e)&&this.to.isValid(e)},isSingle:function(){return this.from.row===this.to.row&&this.from.col===this.to.col},getHeight:function(){return Math.max(this.from.row,this.to.row)-Math.min(this.from.row,this.to.row)+1},getWidth:function(){return Math.max(this.from.col,this.to.col)-Math.min(this.from.col,this.to.col)+1},includes:function(e){var t=e,n=t.row,o=t.col,i=this.getTopLeftCorner(),r=this.getBottomRightCorner();return i.row<=n&&r.row>=n&&i.col<=o&&r.col>=o},includesRange:function(e){return this.includes(e.getTopLeftCorner())&&this.includes(e.getBottomRightCorner())},isEqual:function(e){return Math.min(this.from.row,this.to.row)==Math.min(e.from.row,e.to.row)&&Math.max(this.from.row,this.to.row)==Math.max(e.from.row,e.to.row)&&Math.min(this.from.col,this.to.col)==Math.min(e.from.col,e.to.col)&&Math.max(this.from.col,this.to.col)==Math.max(e.from.col,e.to.col)},overlaps:function(e){return e.isSouthEastOf(this.getTopLeftCorner())&&e.isNorthWestOf(this.getBottomRightCorner())},isSouthEastOf:function(e){return this.getTopLeftCorner().isSouthEastOf(e)||this.getBottomRightCorner().isSouthEastOf(e)},isNorthWestOf:function(e){return this.getTopLeftCorner().isNorthWestOf(e)||this.getBottomRightCorner().isNorthWestOf(e)},expand:function(e){var t=this.getTopLeftCorner(),n=this.getBottomRightCorner();return(e.row<t.row||e.col<t.col||e.row>n.row||e.col>n.col)&&(this.from=new i(Math.min(t.row,e.row),Math.min(t.col,e.col)),this.to=new i(Math.max(n.row,e.row),Math.max(n.col,e.col)),!0)},expandByRange:function(e){if(this.includesRange(e)||!this.overlaps(e))return!1;var t=this.getTopLeftCorner(),n=this.getBottomRightCorner(),o=(this.getTopRightCorner(),this.getBottomLeftCorner(),e.getTopLeftCorner()),r=e.getBottomRightCorner(),a=Math.min(t.row,o.row),l=Math.min(t.col,o.col),u=Math.max(n.row,r.row),c=Math.max(n.col,r.col),d=new i(a,l),h=new i(u,c),f=new s(d,d,h).isCorner(this.from,e),p=e.isEqual(new s(d,d,h));return f&&!p&&(this.from.col>d.col&&(d.col=c,h.col=l),this.from.row>d.row&&(d.row=u,h.row=a)),this.from=d,this.to=h,!0},getDirection:function(){return this.from.isNorthWestOf(this.to)?"NW-SE":this.from.isNorthEastOf(this.to)?"NE-SW":this.from.isSouthEastOf(this.to)?"SE-NW":this.from.isSouthWestOf(this.to)?"SW-NE":void 0},setDirection:function(e){switch(e){case"NW-SE":this.from=this.getTopLeftCorner(),this.to=this.getBottomRightCorner();break;case"NE-SW":this.from=this.getTopRightCorner(),this.to=this.getBottomLeftCorner();break;case"SE-NW":this.from=this.getBottomRightCorner(),this.to=this.getTopLeftCorner();break;case"SW-NE":this.from=this.getBottomLeftCorner(),this.to=this.getTopRightCorner()}},getTopLeftCorner:function(){return new i(Math.min(this.from.row,this.to.row),Math.min(this.from.col,this.to.col))},getBottomRightCorner:function(){return new i(Math.max(this.from.row,this.to.row),Math.max(this.from.col,this.to.col))},getTopRightCorner:function(){return new i(Math.min(this.from.row,this.to.row),Math.max(this.from.col,this.to.col))},getBottomLeftCorner:function(){return new i(Math.max(this.from.row,this.to.row),Math.min(this.from.col,this.to.col))},isCorner:function(e,t){return!!(t&&t.includes(e)&&(this.getTopLeftCorner().isEqual(new i(t.from.row,t.from.col))||this.getTopRightCorner().isEqual(new i(t.from.row,t.to.col))||this.getBottomLeftCorner().isEqual(new i(t.to.row,t.from.col))||this.getBottomRightCorner().isEqual(new i(t.to.row,t.to.col))))||e.isEqual(this.getTopLeftCorner())||e.isEqual(this.getTopRightCorner())||e.isEqual(this.getBottomLeftCorner())||e.isEqual(this.getBottomRightCorner())},getOppositeCorner:function(e,t){if(!(e instanceof i))return!1;if(t&&t.includes(e)){if(this.getTopLeftCorner().isEqual(new i(t.from.row,t.from.col)))return this.getBottomRightCorner();if(this.getTopRightCorner().isEqual(new i(t.from.row,t.to.col)))return this.getBottomLeftCorner();if(this.getBottomLeftCorner().isEqual(new i(t.to.row,t.from.col)))return this.getTopRightCorner();if(this.getBottomRightCorner().isEqual(new i(t.to.row,t.to.col)))return this.getTopLeftCorner()}return e.isEqual(this.getBottomRightCorner())?this.getTopLeftCorner():e.isEqual(this.getTopLeftCorner())?this.getBottomRightCorner():e.isEqual(this.getTopRightCorner())?this.getBottomLeftCorner():e.isEqual(this.getBottomLeftCorner())?this.getTopRightCorner():void 0},getBordersSharedWith:function(e){if(!this.includesRange(e))return[];var t={top:Math.min(this.from.row,this.to.row),bottom:Math.max(this.from.row,this.to.row),left:Math.min(this.from.col,this.to.col),right:Math.max(this.from.col,this.to.col)},n={top:Math.min(e.from.row,e.to.row),bottom:Math.max(e.from.row,e.to.row),left:Math.min(e.from.col,e.to.col),right:Math.max(e.from.col,e.to.col)},o=[];return t.top==n.top&&o.push("top"),t.right==n.right&&o.push("right"),t.bottom==n.bottom&&o.push("bottom"),t.left==n.left&&o.push("left"),o},getInner:function(){for(var e=this.getTopLeftCorner(),t=this.getBottomRightCorner(),n=[],o=e.row;o<=t.row;o++)for(var r=e.col;r<=t.col;r++)this.from.row===o&&this.from.col===r||this.to.row===o&&this.to.col===r||n.push(new i(o,r));return n},getAll:function(){for(var e=this.getTopLeftCorner(),t=this.getBottomRightCorner(),n=[],o=e.row;o<=t.row;o++)for(var r=e.col;r<=t.col;r++)e.row===o&&e.col===r?n.push(e):t.row===o&&t.col===r?n.push(t):n.push(new i(o,r));return n},forAll:function(e){for(var t=this.getTopLeftCorner(),n=this.getBottomRightCorner(),o=t.row;o<=n.row;o++)for(var i=t.col;i<=n.col;i++){var r=e(o,i);if(!1===r)return}}},{}),window.WalkontableCellRange=r},{"cell/coords":6}],8:[function(e,t,n){"use strict";Object.defineProperties(n,{Walkontable:{get:function(){return A}},__esModule:{value:!0}});var o,i,r,s,a,l,u,c,d,h,f,p,g,m,v=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},w=v.addClass,y=v.fastInnerText,b=v.isVisible,C=v.removeClass,_=((i=e("helpers/object"))&&i.__esModule&&i||{default:i}).objectEach,S=(r=e("helpers/string"))&&r.__esModule&&r||{default:r},T=S.toUpperCaseFirst,E=S.randomString,R=((s=e("event"))&&s.__esModule&&s||{default:s}).WalkontableEvent,M=((a=e("overlays"))&&a.__esModule&&a||{default:a}).WalkontableOverlays,O=((l=e("scroll"))&&l.__esModule&&l||{default:l}).WalkontableScroll,k=((u=e("settings"))&&u.__esModule&&u||{default:u}).WalkontableSettings,x=((c=e("table"))&&c.__esModule&&c||{default:c}).WalkontableTable,D=((d=e("viewport"))&&d.__esModule&&d||{default:d}).WalkontableViewport,A=((h=e("overlay/_base.js"))&&h.__esModule,(f=e("overlay/top.js"))&&f.__esModule,(p=e("overlay/left.js"))&&p.__esModule,(g=e("overlay/debug.js"))&&g.__esModule,(m=e("overlay/topLeftCorner.js"))&&m.__esModule,function(e){var t=[];if(this.guid="wt_"+E(),e.cloneSource?(this.cloneSource=e.cloneSource,this.cloneOverlay=e.cloneOverlay,this.wtSettings=e.cloneSource.wtSettings,this.wtTable=new x(this,e.table,e.wtRootElement),this.wtScroll=new O(this),this.wtViewport=e.cloneSource.wtViewport,this.wtEvent=new R(this),this.selections=this.cloneSource.selections):(this.wtSettings=new k(this,e),this.wtTable=new x(this,e.table),this.wtScroll=new O(this),this.wtViewport=new D(this),this.wtEvent=new R(this),this.selections=this.getSetting("selections"),this.wtOverlays=new M(this),this.exportSettingsAsClassNames()),this.wtTable.THEAD.childNodes.length&&this.wtTable.THEAD.childNodes[0].childNodes.length){for(var n=0,o=this.wtTable.THEAD.childNodes[0].childNodes.length;n<o;n++)t.push(this.wtTable.THEAD.childNodes[0].childNodes[n].innerHTML);this.getSetting("columnHeaders").length||this.update("columnHeaders",[function(e,n){y(n,t[e])}])}this.drawn=!1,this.drawInterrupted=!1});$traceurRuntime.createClass(A,{draw:function(){var e=void 0!==arguments[0]&&arguments[0];return this.drawInterrupted=!1,e||b(this.wtTable.TABLE)?this.wtTable.draw(e):this.drawInterrupted=!0,this},getCell:function(e){if(void 0===arguments[1]||!arguments[1])return this.wtTable.getCell(e);var t=this.wtSettings.getSetting("totalRows"),n=this.wtSettings.getSetting("fixedRowsTop"),o=this.wtSettings.getSetting("fixedRowsBottom"),i=this.wtSettings.getSetting("fixedColumnsLeft");if(e.row<n&&e.col<i)return this.wtOverlays.topLeftCornerOverlay.clone.wtTable.getCell(e);if(e.row<n)return this.wtOverlays.topOverlay.clone.wtTable.getCell(e);if(e.col<i&&e.row>=t-o){if(this.wtOverlays.bottomLeftCornerOverlay.clone)return this.wtOverlays.bottomLeftCornerOverlay.clone.wtTable.getCell(e)}else{if(e.col<i)return this.wtOverlays.leftOverlay.clone.wtTable.getCell(e);if(e.row<t&&e.row>t-o&&this.wtOverlays.bottomOverlay.clone)return this.wtOverlays.bottomOverlay.clone.wtTable.getCell(e)}return this.wtTable.getCell(e)},update:function(e,t){return this.wtSettings.update(e,t)},scrollVertical:function(e){return this.wtOverlays.topOverlay.scrollTo(e),this.getSetting("onScrollVertically"),this},scrollHorizontal:function(e){return this.wtOverlays.leftOverlay.scrollTo(e),this.getSetting("onScrollHorizontally"),this},scrollViewport:function(e){return this.wtScroll.scrollViewport(e),this},getViewport:function(){return[this.wtTable.getFirstVisibleRow(),this.wtTable.getFirstVisibleColumn(),this.wtTable.getLastVisibleRow(),this.wtTable.getLastVisibleColumn()]},getOverlayName:function(){return this.cloneOverlay?this.cloneOverlay.type:"master"},isOverlayName:function(e){return!!this.cloneOverlay&&this.cloneOverlay.type===e},exportSettingsAsClassNames:function(){var e=this,t={rowHeaders:["array"],columnHeaders:["array"]},n=[],o=[];_(t,function(t,i){t.indexOf("array")>-1&&e.getSetting(i).length&&o.push("ht"+T(i)),n.push("ht"+T(i))}),C(this.wtTable.wtRootElement.parentNode,n),w(this.wtTable.wtRootElement.parentNode,o)},getSetting:function(e,t,n,o,i){return this.wtSettings.getSetting(e,t,n,o,i)},hasSetting:function(e){return this.wtSettings.has(e)},destroy:function(){this.wtOverlays.destroy(),this.wtEvent.destroy()}},{}),window.Walkontable=A},{event:9,"helpers/dom/element":47,"helpers/object":53,"helpers/string":55,"overlay/_base.js":12,"overlay/debug.js":13,"overlay/left.js":14,"overlay/top.js":15,"overlay/topLeftCorner.js":16,overlays:17,scroll:18,settings:20,table:21,viewport:23}],9:[function(e,t,n){"use strict";function o(e){var t=this,n=h(e);this.instance=e;var o=[null,null];this.dblClickTimeout=[null,null];var i=function(e){var n=t.parentCell(e.realTarget);u(e.realTarget,"corner")?t.instance.getSetting("onCellCornerMouseDown",e,e.realTarget):n.TD&&t.instance.hasSetting("onCellMouseDown")&&t.instance.getSetting("onCellMouseDown",e,n.coords,n.TD,t.instance),2!==e.button&&n.TD&&(o[0]=n.TD,clearTimeout(t.dblClickTimeout[0]),t.dblClickTimeout[0]=setTimeout(function(){o[0]=null},1e3))},r=function(e){t.instance.touchMoving=!0},s=function(e){n.addEventListener(this,"touchmove",r),t.checkIfTouchMove=setTimeout(function(){return!0===t.instance.touchMoving?(t.instance.touchMoving=void 0,void n.removeEventListener("touchmove",r,!1)):void i(e)},30)},a=function(e){var n,o,i;t.instance.hasSetting("onCellMouseOver")&&(n=t.instance.wtTable.TABLE,o=l(e.realTarget,["TD","TH"],n),i=t.instance.cloneSource||t.instance,o&&o!==i.lastMouseOver&&c(o,n)&&(i.lastMouseOver=o,t.instance.getSetting("onCellMouseOver",e,t.instance.wtTable.getCoords(o),o,t.instance)))},f=function(e){if(2!==e.button){var n=t.parentCell(e.realTarget);n.TD===o[0]&&n.TD===o[1]?(u(e.realTarget,"corner")?t.instance.getSetting("onCellCornerDblClick",e,n.coords,n.TD,t.instance):t.instance.getSetting("onCellDblClick",e,n.coords,n.TD,t.instance),o[0]=null,o[1]=null):n.TD===o[0]&&(o[1]=n.TD,clearTimeout(t.dblClickTimeout[1]),t.dblClickTimeout[1]=setTimeout(function(){o[1]=null},500))}},p=function(e){clearTimeout(void 0),e.preventDefault(),f(e)};if(n.addEventListener(this.instance.wtTable.holder,"mousedown",i),n.addEventListener(this.instance.wtTable.TABLE,"mouseover",a),n.addEventListener(this.instance.wtTable.holder,"mouseup",f),this.instance.wtTable.holder.parentNode.parentNode&&d()&&!t.instance.wtTable.isWorkingOnClone()){var g="."+this.instance.wtTable.holder.parentNode.className.split(" ").join(".");n.addEventListener(this.instance.wtTable.holder,"touchstart",function(e){t.instance.touchApplied=!0,c(e.target,g)&&s.call(e.target,e)}),n.addEventListener(this.instance.wtTable.holder,"touchend",function(e){t.instance.touchApplied=!1,c(e.target,g)&&p.call(e.target,e)}),t.instance.momentumScrolling||(t.instance.momentumScrolling={}),n.addEventListener(this.instance.wtTable.holder,"scroll",function(e){clearTimeout(t.instance.momentumScrolling._timeout),t.instance.momentumScrolling.ongoing||t.instance.getSetting("onBeforeTouchScroll"),t.instance.momentumScrolling.ongoing=!0,t.instance.momentumScrolling._timeout=setTimeout(function(){t.instance.touchApplied||(t.instance.momentumScrolling.ongoing=!1,t.instance.getSetting("onAfterMomentumScroll"))},200)})}n.addEventListener(window,"resize",function(){"none"!==t.instance.getSetting("stretchH")&&t.instance.draw()}),this.destroy=function(){clearTimeout(this.dblClickTimeout[0]),clearTimeout(this.dblClickTimeout[1]),n.destroy()}}Object.defineProperties(n,{WalkontableEvent:{get:function(){return o}},__esModule:{value:!0}});var i,r,s,a=(i=e("helpers/dom/element"))&&i.__esModule&&i||{default:i},l=a.closestDown,u=a.hasClass,c=a.isChildOf,d=((r=e("helpers/browser"))&&r.__esModule&&r||{default:r}).isMobileBrowser,h=((s=e("eventManager"))&&s.__esModule&&s||{default:s}).eventManager;o.prototype.parentCell=function(e){var t={},n=this.instance.wtTable.TABLE,o=l(e,["TD","TH"],n);return o?(t.coords=this.instance.wtTable.getCoords(o),t.TD=o):u(e,"wtBorder")&&u(e,"current")?(t.coords=this.instance.selections.current.cellRange.highlight,t.TD=this.instance.wtTable.getCell(t.coords)):u(e,"wtBorder")&&u(e,"area")&&this.instance.selections.area.cellRange&&(t.coords=this.instance.selections.area.cellRange.to,t.TD=this.instance.wtTable.getCell(t.coords)),t},window.WalkontableEvent=o},{eventManager:42,"helpers/browser":44,"helpers/dom/element":47}],10:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableColumnFilter:{get:function(){return o}},__esModule:{value:!0}});var o=function(e,t,n){this.offset=e,this.total=t,this.countTH=n};$traceurRuntime.createClass(o,{offsetted:function(e){return e+this.offset},unOffsetted:function(e){return e-this.offset},renderedToSource:function(e){return this.offsetted(e)},sourceToRendered:function(e){return this.unOffsetted(e)},offsettedTH:function(e){return e-this.countTH},unOffsettedTH:function(e){return e+this.countTH},visibleRowHeadedColumnToSourceColumn:function(e){return this.renderedToSource(this.offsettedTH(e))},sourceColumnToVisibleRowHeadedColumn:function(e){return this.unOffsettedTH(this.sourceToRendered(e))}},{}),window.WalkontableColumnFilter=o},{}],11:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableRowFilter:{get:function(){return o}},__esModule:{value:!0}});var o=function(e,t,n){this.offset=e,this.total=t,this.countTH=n};$traceurRuntime.createClass(o,{offsetted:function(e){return e+this.offset},unOffsetted:function(e){return e-this.offset},renderedToSource:function(e){return this.offsetted(e)},sourceToRendered:function(e){return this.unOffsetted(e)},offsettedTH:function(e){return e-this.countTH},unOffsettedTH:function(e){return e+this.countTH},visibleColHeadedRowToSourceRow:function(e){return this.renderedToSource(this.offsettedTH(e))},sourceRowToVisibleColHeadedRow:function(e){return this.unOffsettedTH(this.sourceToRendered(e))}},{}),window.WalkontableRowFilter=o},{}],12:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableOverlay:{get:function(){return h}},__esModule:{value:!0}});var o,i,r,s=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},a=s.getScrollableElement,l=s.getTrimmingContainer,u=((i=e("helpers/object"))&&i.__esModule&&i||{default:i}).defineGetter,c=((r=e("eventManager"))&&r.__esModule&&r||{default:r}).eventManager,d={},h=function(e){u(this,"wot",e,{writable:!1}),this.instance=this.wot,this.type="",this.mainTableScrollableElement=null,this.TABLE=this.wot.wtTable.TABLE,this.hider=this.wot.wtTable.hider,this.spreader=this.wot.wtTable.spreader,this.holder=this.wot.wtTable.holder,this.wtRootElement=this.wot.wtTable.wtRootElement,this.trimmingContainer=l(this.hider.parentNode.parentNode),this.needFullRender=this.shouldBeRendered(),this.areElementSizesAdjusted=!1},f=h;$traceurRuntime.createClass(h,{shouldBeRendered:function(){return!0},updateTrimmingContainer:function(){this.trimmingContainer=l(this.hider.parentNode.parentNode)},updateMainScrollableElement:function(){this.mainTableScrollableElement=a(this.wot.wtTable.TABLE)},makeClone:function(e){if(-1===f.CLONE_TYPES.indexOf(e))throw new Error('Clone type "'+e+'" is not supported.');var t=document.createElement("DIV"),n=document.createElement("TABLE");t.className="ht_clone_"+e+" handsontable",t.style.position="absolute",t.style.top=0,t.style.left=0,t.style.overflow="hidden",n.className=this.wot.wtTable.TABLE.className,t.appendChild(n),this.type=e,this.wot.wtTable.wtRootElement.parentNode.appendChild(t);var o=this.wot.getSetting("preventOverflow");return!0===o||"horizontal"===o&&this.type===f.CLONE_TOP||"vertical"===o&&this.type===f.CLONE_LEFT?this.mainTableScrollableElement=window:this.mainTableScrollableElement=a(this.wot.wtTable.TABLE),new Walkontable({cloneSource:this.wot,cloneOverlay:this,table:n})},refresh:function(){var e=void 0!==arguments[0]&&arguments[0],t=this.shouldBeRendered();this.clone&&(this.needFullRender||t)&&this.clone.draw(e),this.needFullRender=t},destroy:function(){c(this.clone).destroy()}},{get CLONE_TOP(){return"top"},get CLONE_BOTTOM(){return"bottom"},get CLONE_LEFT(){return"left"},get CLONE_TOP_LEFT_CORNER(){return"top_left_corner"},get CLONE_BOTTOM_LEFT_CORNER(){return"bottom_left_corner"},get CLONE_DEBUG(){return"debug"},get CLONE_TYPES(){return[f.CLONE_TOP,f.CLONE_BOTTOM,f.CLONE_LEFT,f.CLONE_TOP_LEFT_CORNER,f.CLONE_BOTTOM_LEFT_CORNER,f.CLONE_DEBUG]},registerOverlay:function(e,t){if(-1===f.CLONE_TYPES.indexOf(e))throw new Error("Unsupported overlay ("+e+").");d[e]=t},createOverlay:function(e,t){return new d[e](t)},isOverlayTypeOf:function(e,t){return!(!e||!d[t])&&e instanceof d[t]}}),window.WalkontableOverlay=h},{eventManager:42,"helpers/dom/element":47,"helpers/object":53}],13:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableDebugOverlay:{get:function(){return a}},__esModule:{value:!0}});var o,i,r=((o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o}).addClass,s=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,a=function(e){$traceurRuntime.superConstructor(l).call(this,e),this.clone=this.makeClone(s.CLONE_DEBUG),this.clone.wtTable.holder.style.opacity=.4,this.clone.wtTable.holder.style.textShadow="0 0 2px #ff0000",r(this.clone.wtTable.holder.parentNode,"wtDebugVisible")},l=a;$traceurRuntime.createClass(a,{},{},s),window.WalkontableDebugOverlay=a,s.registerOverlay(s.CLONE_DEBUG,a)},{_base:12,"helpers/dom/element":47}],14:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableLeftOverlay:{get:function(){return v}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.addClass,a=r.getScrollbarWidth,l=r.getScrollLeft,u=r.getWindowScrollTop,c=r.hasClass,d=r.outerWidth,h=r.innerHeight,f=r.removeClass,p=r.setOverlayPosition,g=r.resetCssTransform,m=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,v=function(e){$traceurRuntime.superConstructor(w).call(this,e),this.clone=this.makeClone(m.CLONE_LEFT)},w=v;$traceurRuntime.createClass(v,{shouldBeRendered:function(){return!(!this.wot.getSetting("fixedColumnsLeft")&&!this.wot.getSetting("rowHeaders").length)},resetFixedPosition:function(){if(this.needFullRender&&this.wot.wtTable.holder.parentNode){var e=this.clone.wtTable.holder.parentNode,t=0,n=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||n&&"horizontal"===n)t=this.getScrollPosition(),g(e);else{var o,i,r=this.wot.wtTable.hider.getBoundingClientRect(),s=Math.ceil(r.left),a=Math.ceil(r.right);i=this.wot.wtTable.hider.style.top,i=""===i?0:i,o=s<0&&a-e.offsetWidth>0?-s:0,t=o,o+="px",p(e,o,i)}this.adjustHeaderBordersPosition(t),this.adjustElementsSize()}},setScrollPosition:function(e){this.mainTableScrollableElement===window?window.scrollTo(e,u()):this.mainTableScrollableElement.scrollLeft=e},onScroll:function(){this.wot.getSetting("onScrollVertically")},sumCellSizes:function(e,t){for(var n=0,o=this.wot.wtSettings.defaultColumnWidth;e<t;)n+=this.wot.wtTable.getStretchedColumnWidth(e)||o,e++;return n},adjustElementsSize:function(){var e=void 0!==arguments[0]&&arguments[0];this.updateTrimmingContainer(),(this.needFullRender||e)&&(this.adjustRootElementSize(),this.adjustRootChildrenSize(),e||(this.areElementSizesAdjusted=!0))},adjustRootElementSize:function(){var e,t=this.wot.wtTable.holder,n=t.clientHeight===t.offsetHeight?0:a(),o=this.clone.wtTable.holder.parentNode,i=o.style,r=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||"vertical"===r){
 var s=this.wot.wtViewport.getWorkspaceHeight()-n;s=Math.min(s,h(this.wot.wtTable.wtRootElement)),i.height=s+"px"}else i.height="";this.clone.wtTable.holder.style.height=i.height,e=d(this.clone.wtTable.TABLE),i.width=(0===e?e:e+4)+"px"},adjustRootChildrenSize:function(){var e=a();this.clone.wtTable.hider.style.height=this.hider.style.height,this.clone.wtTable.holder.style.height=this.clone.wtTable.holder.parentNode.style.height,0===e&&(e=30),this.clone.wtTable.holder.style.width=parseInt(this.clone.wtTable.holder.parentNode.style.width,10)+e+"px"},applyToDOM:function(){var e=this.wot.getSetting("totalColumns");if(this.areElementSizesAdjusted||this.adjustElementsSize(),"number"==typeof this.wot.wtViewport.columnsRenderCalculator.startPosition)this.spreader.style.left=this.wot.wtViewport.columnsRenderCalculator.startPosition+"px";else{if(0!==e)throw new Error("Incorrect value of the columnsRenderCalculator");this.spreader.style.left="0"}this.spreader.style.right="",this.needFullRender&&this.syncOverlayOffset()},syncOverlayOffset:function(){"number"==typeof this.wot.wtViewport.rowsRenderCalculator.startPosition?this.clone.wtTable.spreader.style.top=this.wot.wtViewport.rowsRenderCalculator.startPosition+"px":this.clone.wtTable.spreader.style.top=""},scrollTo:function(e,t){var n=this.getTableParentOffset(),o=this.wot.cloneSource?this.wot.cloneSource:this.wot,i=o.wtTable.holder,r=0;t&&i.offsetWidth!==i.clientWidth&&(r=a()),t?(n+=this.sumCellSizes(0,e+1),n-=this.wot.wtViewport.getViewportWidth()):n+=this.sumCellSizes(this.wot.getSetting("fixedColumnsLeft"),e),n+=r,this.setScrollPosition(n)},getTableParentOffset:function(){var e=this.wot.getSetting("preventOverflow"),t=0;return e||this.trimmingContainer!==window||(t=this.wot.wtTable.holderOffset.left),t},getScrollPosition:function(){return l(this.mainTableScrollableElement)},adjustHeaderBordersPosition:function(e){var t=this.wot.wtTable.holder.parentNode,n=this.wot.getSetting("rowHeaders"),o=this.wot.getSetting("fixedColumnsLeft");if(this.wot.getSetting("totalRows")?f(t,"emptyRows"):s(t,"emptyRows"),o&&!n.length)s(t,"innerBorderLeft");else if(!o&&n.length){var i=c(t,"innerBorderLeft");e?s(t,"innerBorderLeft"):f(t,"innerBorderLeft"),(!i&&e||i&&!e)&&this.wot.wtOverlays.adjustElementsSize()}}},{},m),window.WalkontableLeftOverlay=v,m.registerOverlay(m.CLONE_LEFT,v)},{_base:12,"helpers/dom/element":47}],15:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableTopOverlay:{get:function(){return v}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.addClass,a=r.getScrollbarWidth,l=r.getScrollTop,u=r.getWindowScrollLeft,c=r.hasClass,d=r.outerHeight,h=r.innerWidth,f=r.removeClass,p=r.setOverlayPosition,g=r.resetCssTransform,m=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,v=function(e){$traceurRuntime.superConstructor(w).call(this,e),this.clone=this.makeClone(m.CLONE_TOP)},w=v;$traceurRuntime.createClass(v,{shouldBeRendered:function(){return!(!this.wot.getSetting("fixedRowsTop")&&!this.wot.getSetting("columnHeaders").length)},resetFixedPosition:function(){if(this.needFullRender&&this.wot.wtTable.holder.parentNode){var e=this.clone.wtTable.holder.parentNode,t=0,n=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||n&&"vertical"===n)t=this.getScrollPosition(),g(e);else{var o,i,r=this.wot.wtTable.hider.getBoundingClientRect(),s=Math.ceil(r.top),a=Math.ceil(r.bottom);o=this.wot.wtTable.hider.style.left,o=""===o?0:o,i=s<0&&a-e.offsetHeight>0?-s:0,t=i,i+="px",p(e,o,i)}this.adjustHeaderBordersPosition(t),this.adjustElementsSize()}},setScrollPosition:function(e){this.mainTableScrollableElement===window?window.scrollTo(u(),e):this.mainTableScrollableElement.scrollTop=e},onScroll:function(){this.wot.getSetting("onScrollHorizontally")},sumCellSizes:function(e,t){for(var n=0,o=this.wot.wtSettings.settings.defaultRowHeight;e<t;){var i=this.wot.wtTable.getRowHeight(e);n+=void 0===i?o:i,e++}return n},adjustElementsSize:function(){var e=void 0!==arguments[0]&&arguments[0];this.updateTrimmingContainer(),(this.needFullRender||e)&&(this.adjustRootElementSize(),this.adjustRootChildrenSize(),e||(this.areElementSizesAdjusted=!0))},adjustRootElementSize:function(){var e,t=this.wot.wtTable.holder,n=t.clientWidth===t.offsetWidth?0:a(),o=this.clone.wtTable.holder.parentNode,i=o.style,r=this.wot.getSetting("preventOverflow");if(this.trimmingContainer!==window||"horizontal"===r){var s=this.wot.wtViewport.getWorkspaceWidth()-n;s=Math.min(s,h(this.wot.wtTable.wtRootElement)),i.width=s+"px"}else i.width="";this.clone.wtTable.holder.style.width=i.width,e=d(this.clone.wtTable.TABLE),i.height=(0===e?e:e+4)+"px"},adjustRootChildrenSize:function(){var e=a();this.clone.wtTable.hider.style.width=this.hider.style.width,this.clone.wtTable.holder.style.width=this.clone.wtTable.holder.parentNode.style.width,0===e&&(e=30),this.clone.wtTable.holder.style.height=parseInt(this.clone.wtTable.holder.parentNode.style.height,10)+e+"px"},applyToDOM:function(){var e=this.wot.getSetting("totalRows");if(this.areElementSizesAdjusted||this.adjustElementsSize(),"number"==typeof this.wot.wtViewport.rowsRenderCalculator.startPosition)this.spreader.style.top=this.wot.wtViewport.rowsRenderCalculator.startPosition+"px";else{if(0!==e)throw new Error("Incorrect value of the rowsRenderCalculator");this.spreader.style.top="0"}this.spreader.style.bottom="",this.needFullRender&&this.syncOverlayOffset()},syncOverlayOffset:function(){"number"==typeof this.wot.wtViewport.columnsRenderCalculator.startPosition?this.clone.wtTable.spreader.style.left=this.wot.wtViewport.columnsRenderCalculator.startPosition+"px":this.clone.wtTable.spreader.style.left=""},scrollTo:function(e,t){var n=this.getTableParentOffset(),o=this.wot.cloneSource?this.wot.cloneSource:this.wot,i=o.wtTable.holder,r=0;if(t&&i.offsetHeight!==i.clientHeight&&(r=a()),t){var s=this.wot.getSetting("fixedRowsBottom"),l=(this.wot.getSetting("fixedRowsTop"),this.wot.getSetting("totalRows"));n+=this.sumCellSizes(0,e+1),n-=this.wot.wtViewport.getViewportHeight()-this.sumCellSizes(l-s,l),n+=1}else n+=this.sumCellSizes(this.wot.getSetting("fixedRowsTop"),e);n+=r,this.setScrollPosition(n)},getTableParentOffset:function(){return this.mainTableScrollableElement===window?this.wot.wtTable.holderOffset.top:0},getScrollPosition:function(){return l(this.mainTableScrollableElement)},adjustHeaderBordersPosition:function(e){var t=this.wot.wtTable.holder.parentNode;if(this.wot.getSetting("totalColumns")?f(t,"emptyColumns"):s(t,"emptyColumns"),0===this.wot.getSetting("fixedRowsTop")&&this.wot.getSetting("columnHeaders").length>0){var n=c(t,"innerBorderTop");e||0===this.wot.getSetting("totalRows")?s(t,"innerBorderTop"):f(t,"innerBorderTop"),(!n&&e||n&&!e)&&this.wot.wtOverlays.adjustElementsSize()}if(0===this.wot.getSetting("rowHeaders").length){var o=this.clone.wtTable.THEAD.querySelectorAll("th:nth-of-type(2)");if(o)for(var i=0;i<o.length;i++)o[i].style["border-left-width"]=0}}},{},m),window.WalkontableTopOverlay=v,m.registerOverlay(m.CLONE_TOP,v)},{_base:12,"helpers/dom/element":47}],16:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableTopLeftCornerOverlay:{get:function(){return d}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.outerHeight,a=r.outerWidth,l=r.setOverlayPosition,u=r.resetCssTransform,c=((i=e("_base"))&&i.__esModule&&i||{default:i}).WalkontableOverlay,d=function(e){$traceurRuntime.superConstructor(h).call(this,e),this.clone=this.makeClone(c.CLONE_TOP_LEFT_CORNER)},h=d;$traceurRuntime.createClass(d,{shouldBeRendered:function(){return!(!this.wot.getSetting("fixedRowsTop")&&!this.wot.getSetting("columnHeaders").length||!this.wot.getSetting("fixedColumnsLeft")&&!this.wot.getSetting("rowHeaders").length)},resetFixedPosition:function(){if(this.updateTrimmingContainer(),this.wot.wtTable.holder.parentNode){var e=this.clone.wtTable.holder.parentNode,t=s(this.clone.wtTable.TABLE),n=a(this.clone.wtTable.TABLE),o=this.wot.getSetting("preventOverflow");if(this.trimmingContainer===window){var i=this.wot.wtTable.hider.getBoundingClientRect(),r=Math.ceil(i.top),c=Math.ceil(i.left),d=Math.ceil(i.bottom),h=Math.ceil(i.right),f="0",p="0";o&&"vertical"!==o||c<0&&h-e.offsetWidth>0&&(f=-c+"px"),o&&"horizontal"!==o||r<0&&d-e.offsetHeight>0&&(p=-r+"px"),l(e,f,p)}else u(e);e.style.height=(0===t?t:t+4)+"px",e.style.width=(0===n?n:n+4)+"px"}}},{},c),window.WalkontableTopLeftCornerOverlay=d,c.registerOverlay(c.CLONE_TOP_LEFT_CORNER,d)},{_base:12,"helpers/dom/element":47}],17:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableOverlays:{get:function(){return v}},__esModule:{value:!0}});var o,i,r,s,a,l=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},u=l.getScrollableElement,c=l.getScrollbarWidth,d=l.getScrollLeft,h=l.getScrollTop,f=((i=e("helpers/array"))&&i.__esModule&&i||{default:i}).arrayEach,p=((r=e("helpers/unicode"))&&r.__esModule&&r||{default:r}).isKey,g=((s=e("helpers/browser"))&&s.__esModule&&s||{default:s}).isMobileBrowser,m=((a=e("eventManager"))&&a.__esModule&&a||{default:a}).EventManager,v=function(e){this.wot=e,this.instance=this.wot,this.eventManager=new m(this.wot),this.wot.update("scrollbarWidth",c()),this.wot.update("scrollbarHeight",c()),this.scrollableElement=u(this.wot.wtTable.TABLE),this.topOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_TOP,this.wot),"undefined"==typeof WalkontableBottomOverlay?this.bottomOverlay={needFullRender:!1}:this.bottomOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_BOTTOM,this.wot),this.leftOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_LEFT,this.wot),this.topOverlay.needFullRender&&this.leftOverlay.needFullRender&&(this.topLeftCornerOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_TOP_LEFT_CORNER,this.wot)),this.bottomOverlay.needFullRender&&this.leftOverlay.needFullRender&&"undefined"!=typeof WalkontableBottomLeftCornerOverlay?this.bottomLeftCornerOverlay=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER,this.wot):this.bottomLeftCornerOverlay={needFullRender:!1},this.wot.getSetting("debug")&&(this.debug=WalkontableOverlay.createOverlay(WalkontableOverlay.CLONE_DEBUG,this.wot)),this.destroyed=!1,this.keyPressed=!1,this.spreaderLastSize={width:null,height:null},this.overlayScrollPositions={master:{top:0,left:0},top:{top:null,left:0},bottom:{top:null,left:0},left:{top:0,left:null}},this.pendingScrollCallbacks={master:{top:0,left:0},top:{left:0},bottom:{left:0},left:{top:0}},this.verticalScrolling=!1,this.horizontalScrolling=!1,this.delegatedScrollCallback=!1,this.registeredListeners=[],this.registerListeners()};$traceurRuntime.createClass(v,{refreshAll:function(){if(this.wot.drawn){if(!this.wot.wtTable.holder.parentNode)return void this.destroy();this.wot.draw(!0),this.verticalScrolling&&this.leftOverlay.onScroll(),this.horizontalScrolling&&this.topOverlay.onScroll(),this.verticalScrolling=!1,this.horizontalScrolling=!1}},registerListeners:function(){var e=this,t=this.topOverlay.mainTableScrollableElement,n=this.leftOverlay.mainTableScrollableElement,o=[];for(o.push([document.documentElement,"keydown",function(t){return e.onKeyDown(t)}]),o.push([document.documentElement,"keyup",function(){return e.onKeyUp()}]),o.push([document,"visibilitychange",function(){return e.onKeyUp()}]),o.push([t,"scroll",function(t){return e.onTableScroll(t)}]),t!==n&&o.push([n,"scroll",function(t){return e.onTableScroll(t)}]),this.topOverlay.needFullRender&&(o.push([this.topOverlay.clone.wtTable.holder,"scroll",function(t){return e.onTableScroll(t)}]),o.push([this.topOverlay.clone.wtTable.holder,"wheel",function(t){return e.onTableScroll(t)}])),this.bottomOverlay.needFullRender&&(o.push([this.bottomOverlay.clone.wtTable.holder,"scroll",function(t){return e.onTableScroll(t)}]),o.push([this.bottomOverlay.clone.wtTable.holder,"wheel",function(t){return e.onTableScroll(t)}])),this.leftOverlay.needFullRender&&(o.push([this.leftOverlay.clone.wtTable.holder,"scroll",function(t){return e.onTableScroll(t)}]),o.push([this.leftOverlay.clone.wtTable.holder,"wheel",function(t){return e.onTableScroll(t)}])),this.topOverlay.trimmingContainer!==window&&this.leftOverlay.trimmingContainer!==window&&o.push([window,"wheel",function(t){var n,o=t.wheelDeltaY||t.deltaY,i=t.wheelDeltaX||t.deltaX;e.topOverlay.clone.wtTable.holder.contains(t.realTarget)?n="top":e.bottomOverlay.clone&&e.bottomOverlay.clone.wtTable.holder.contains(t.realTarget)?n="bottom":e.leftOverlay.clone.wtTable.holder.contains(t.realTarget)&&(n="left"),"top"==n&&0!==o?t.preventDefault():"left"==n&&0!==i?t.preventDefault():"bottom"==n&&0!==o&&t.preventDefault()}]);o.length;){var i=o.pop();this.eventManager.addEventListener(i[0],i[1],i[2]),this.registeredListeners.push(i)}},deregisterListeners:function(){for(;this.registeredListeners.length;){var e=this.registeredListeners.pop();this.eventManager.removeEventListener(e[0],e[1],e[2])}},onTableScroll:function(e){if(!g()){var t=this.leftOverlay.mainTableScrollableElement,n=this.topOverlay.mainTableScrollableElement,o=e.target;this.keyPressed&&(n!==window&&o!==window&&!e.target.contains(n)||t!==window&&o!==window&&!e.target.contains(t))||("scroll"===e.type?this.syncScrollPositions(e):this.translateMouseWheelToScroll(e))}},onKeyDown:function(e){this.keyPressed=p(e.keyCode,"ARROW_UP|ARROW_RIGHT|ARROW_DOWN|ARROW_LEFT")},onKeyUp:function(){this.keyPressed=!1},translateMouseWheelToScroll:function(e){var t,n=this.topOverlay.clone.wtTable.holder,o=this.bottomOverlay.clone?this.bottomOverlay.clone.wtTable.holder:null,i=this.leftOverlay.clone.wtTable.holder,r={type:"wheel"},s=e.target,a=e.wheelDeltaY||-1*e.deltaY,l=e.wheelDeltaX||-1*e.deltaX;for(1===e.deltaMode&&(a*=120,l*=120);s!=document&&null!=s;){if(s.className.indexOf("wtHolder")>-1){t=s;break}s=s.parentNode}return r.target=t,t==n?this.syncScrollPositions(r,-.2*a):t==o?this.syncScrollPositions(r,-.2*a):t==i&&this.syncScrollPositions(r,-.2*l),!1},syncScrollPositions:function(e){var t=void 0!==arguments[1]?arguments[1]:null;if(!this.destroyed){if(0===arguments.length)return void this.syncScrollWithMaster();var n,o,i,r=this.leftOverlay.mainTableScrollableElement,s=this.topOverlay.mainTableScrollableElement,a=e.target,l=0,u=!1,c=!1,f=this.wot.getSetting("preventOverflow");this.topOverlay.needFullRender&&(n=this.topOverlay.clone.wtTable.holder),this.bottomOverlay.needFullRender&&(i=this.bottomOverlay.clone.wtTable.holder),this.leftOverlay.needFullRender&&(o=this.leftOverlay.clone.wtTable.holder),a===document&&(a=window),a===r||a===s?(l=d(f?this.scrollableElement:a),this.horizontalScrolling=!0,this.overlayScrollPositions.master.left=l,u=!0,this.pendingScrollCallbacks.master.left>0?this.pendingScrollCallbacks.master.left--:(n&&n.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.top.left++,n.scrollLeft=l,c=r!==window),i&&i.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.bottom.left++,i.scrollLeft=l,c=r!==window)),l=h(a),this.verticalScrolling=!0,this.overlayScrollPositions.master.top=l,u=!0,this.pendingScrollCallbacks.master.top>0?this.pendingScrollCallbacks.master.top--:o&&o.scrollTop!==l&&(null==t&&this.pendingScrollCallbacks.left.top++,o.scrollTop=l,c=s!==window)):a===i?(l=d(a),this.horizontalScrolling=!0,this.overlayScrollPositions.bottom.left=l,u=!0,this.pendingScrollCallbacks.bottom.left>0?this.pendingScrollCallbacks.bottom.left--:(null==t&&this.pendingScrollCallbacks.master.left++,r.scrollLeft=l,n&&n.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.top.left++,n.scrollLeft=l,c=s!==window)),null!==t&&(u=!0,s.scrollTop+=t)):a===n?(l=d(a),this.horizontalScrolling=!0,this.overlayScrollPositions.top.left=l,u=!0,this.pendingScrollCallbacks.top.left>0?this.pendingScrollCallbacks.top.left--:(null==t&&this.pendingScrollCallbacks.master.left++,r.scrollLeft=l),null!==t&&(u=!0,s.scrollTop+=t),i&&i.scrollLeft!==l&&(null==t&&this.pendingScrollCallbacks.bottom.left++,i.scrollLeft=l,c=s!==window)):a===o&&(l=h(a),this.overlayScrollPositions.left.top!==l&&(this.verticalScrolling=!0,this.overlayScrollPositions.left.top=l,u=!0,this.pendingScrollCallbacks.left.top>0?this.pendingScrollCallbacks.left.top--:(null==t&&this.pendingScrollCallbacks.master.top++,s.scrollTop=l)),null!==t&&(u=!0,s.scrollLeft+=t)),!this.keyPressed&&u&&"scroll"===e.type&&(this.delegatedScrollCallback?this.delegatedScrollCallback=!1:this.refreshAll(),c&&(this.delegatedScrollCallback=!0))}},syncScrollWithMaster:function(){var e=this.topOverlay.mainTableScrollableElement;this.topOverlay.needFullRender&&(this.topOverlay.clone.wtTable.holder.scrollLeft=e.scrollLeft),this.leftOverlay.needFullRender&&(this.leftOverlay.clone.wtTable.holder.scrollTop=e.scrollTop)},updateMainScrollableElements:function(){this.deregisterListeners(),this.leftOverlay.updateMainScrollableElement(),this.topOverlay.updateMainScrollableElement(),this.bottomOverlay.needFullRender&&this.bottomOverlay.updateMainScrollableElement(),this.scrollableElement=u(this.wot.wtTable.TABLE),this.registerListeners()},destroy:function(){this.eventManager.destroy(),this.topOverlay.destroy(),this.bottomOverlay.clone&&this.bottomOverlay.destroy(),this.leftOverlay.destroy(),this.topLeftCornerOverlay&&this.topLeftCornerOverlay.destroy(),this.bottomLeftCornerOverlay&&this.bottomLeftCornerOverlay.clone&&this.bottomLeftCornerOverlay.destroy(),this.debug&&this.debug.destroy(),this.destroyed=!0},refresh:function(){var e=void 0!==arguments[0]&&arguments[0];if(this.topOverlay.areElementSizesAdjusted&&this.leftOverlay.areElementSizesAdjusted){var t=this.wot.wtTable.wtRootElement.parentNode||this.wot.wtTable.wtRootElement,n=t.clientWidth,o=t.clientHeight;n===this.spreaderLastSize.width&&o===this.spreaderLastSize.height||(this.spreaderLastSize.width=n,this.spreaderLastSize.height=o,this.adjustElementsSize())}this.bottomOverlay.clone&&this.bottomOverlay.refresh(e),this.leftOverlay.refresh(e),this.topOverlay.refresh(e),this.topLeftCornerOverlay&&this.topLeftCornerOverlay.refresh(e),this.bottomLeftCornerOverlay&&this.bottomLeftCornerOverlay.clone&&this.bottomLeftCornerOverlay.refresh(e),this.debug&&this.debug.refresh(e)},adjustElementsSize:function(){var e=void 0!==arguments[0]&&arguments[0],t=this.wot.getSetting("totalColumns"),n=this.wot.getSetting("totalRows"),o=this.wot.wtViewport.getRowHeaderWidth(),i=this.wot.wtViewport.getColumnHeaderHeight(),r=this.wot.wtTable.hider.style;r.width=o+this.leftOverlay.sumCellSizes(0,t)+"px",r.height=i+this.topOverlay.sumCellSizes(0,n)+1+"px",this.topOverlay.adjustElementsSize(e),this.leftOverlay.adjustElementsSize(e),this.bottomOverlay.clone&&this.bottomOverlay.adjustElementsSize(e)},applyToDOM:function(){this.topOverlay.areElementSizesAdjusted&&this.leftOverlay.areElementSizesAdjusted||this.adjustElementsSize(),this.topOverlay.applyToDOM(),this.bottomOverlay.clone&&this.bottomOverlay.applyToDOM(),this.leftOverlay.applyToDOM()},getParentOverlay:function(e){if(!e)return null;var t=[this.topOverlay,this.leftOverlay,this.bottomOverlay,this.topLeftCornerOverlay,this.bottomLeftCornerOverlay],n=null;return f(t,function(t,o){t&&t.clone&&t.clone.wtTable.TABLE.contains(e)&&(n=t.clone)}),n}},{}),window.WalkontableOverlays=v},{eventManager:42,"helpers/array":43,"helpers/browser":44,"helpers/dom/element":47,"helpers/unicode":56}],18:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableScroll:{get:function(){return p}},__esModule:{value:!0}});var o,i,r=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},s=r.innerHeight,a=r.innerWidth,l=r.getScrollLeft,u=r.getScrollTop,c=r.offset,d=(i=e("helpers/number"))&&i.__esModule&&i||{default:i},h=d.rangeEach,f=d.rangeEachReverse,p=function(e){this.wot=e,this.instance=e};$traceurRuntime.createClass(p,{scrollViewport:function(e){if(this.wot.drawn){var t=this._getVariables(),n=t.topOverlay,o=t.leftOverlay,i=t.totalRows,r=t.totalColumns,s=t.fixedRowsTop,a=t.fixedRowsBottom,l=t.fixedColumnsLeft;if(e.row<0||e.row>Math.max(i-1,0))throw new Error("row "+e.row+" does not exist");if(e.col<0||e.col>Math.max(r-1,0))throw new Error("column "+e.col+" does not exist");e.row>=s&&e.row<this.getFirstVisibleRow()?n.scrollTo(e.row):e.row>this.getLastVisibleRow()&&e.row<i-a&&n.scrollTo(e.row,!0),e.col>=l&&e.col<this.getFirstVisibleColumn()?o.scrollTo(e.col):e.col>this.getLastVisibleColumn()&&o.scrollTo(e.col,!0)}},getFirstVisibleRow:function(){var e=this._getVariables(),t=e.topOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalRows,r=e.fixedRowsTop,a=n.getFirstVisibleRow();if(t.mainTableScrollableElement===window){var l=c(n.wtRootElement),d=s(n.hider),h=s(window),p=u(window);if(l.top+d-h<=p){var g=o.getColumnHeaderHeight();g+=t.sumCellSizes(0,r),f(i,1,function(e){if(g+=t.sumCellSizes(e-1,e),l.top+d-g<=p)return a=e,!1})}}return a},getLastVisibleRow:function(){var e=this._getVariables(),t=e.topOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalRows,r=n.getLastVisibleRow();if(t.mainTableScrollableElement===window){var a=c(n.wtRootElement),l=s(window),d=u(window);if(a.top>d){var f=o.getColumnHeaderHeight();h(1,i,function(e){if(f+=t.sumCellSizes(e-1,e),a.top+f-d>=l)return r=e-2,!1})}}return r},getFirstVisibleColumn:function(){var e=this._getVariables(),t=e.leftOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalColumns,r=(e.fixedColumnsLeft,n.getFirstVisibleColumn());if(t.mainTableScrollableElement===window){var s=c(n.wtRootElement),u=a(n.hider),d=a(window),h=l(window);if(s.left+u-d<=h){var p=o.getRowHeaderWidth();f(i,1,function(e){if(p+=t.sumCellSizes(e-1,e),s.left+u-p<=h)return r=e,!1})}}return r},getLastVisibleColumn:function(){var e=this._getVariables(),t=e.leftOverlay,n=e.wtTable,o=e.wtViewport,i=e.totalColumns,r=n.getLastVisibleColumn();if(t.mainTableScrollableElement===window){var s=c(n.wtRootElement),u=a(window),d=l(window);if(s.left>d){var f=o.getRowHeaderWidth();h(1,i,function(e){if(f+=t.sumCellSizes(e-1,e),s.left+f-d>=u)return r=e-2,!1})}}return r},_getVariables:function(){var e=this.wot;return{topOverlay:e.wtOverlays.topOverlay,leftOverlay:e.wtOverlays.leftOverlay,wtTable:e.wtTable,wtViewport:e.wtViewport,totalRows:e.getSetting("totalRows"),totalColumns:e.getSetting("totalColumns"),fixedRowsTop:e.getSetting("fixedRowsTop"),fixedRowsBottom:e.getSetting("fixedRowsBottom"),fixedColumnsLeft:e.getSetting("fixedColumnsLeft")}}},{}),window.WalkontableScroll=p},{"helpers/dom/element":47,"helpers/number":52}],19:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableSelection:{get:function(){return d}},__esModule:{value:!0}});var o,i,r,s,a=((o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o}).addClass,l=((i=e("border"))&&i.__esModule&&i||{default:i}).WalkontableBorder,u=((r=e("cell/coords"))&&r.__esModule&&r||{default:r}).WalkontableCellCoords,c=((s=e("cell/range"))&&s.__esModule&&s||{default:s}).WalkontableCellRange,d=function(e,t){this.settings=e,this.cellRange=t||null,this.instanceBorders={}};$traceurRuntime.createClass(d,{getBorder:function(e){return this.instanceBorders[e.guid]?this.instanceBorders[e.guid]:void(this.instanceBorders[e.guid]=new l(e,this.settings))},isEmpty:function(){return null===this.cellRange},add:function(e){this.isEmpty()?this.cellRange=new c(e,e,e):this.cellRange.expand(e)},replace:function(e,t){if(!this.isEmpty()){if(this.cellRange.from.isEqual(e))return this.cellRange.from=t,!0;if(this.cellRange.to.isEqual(e))return this.cellRange.to=t,!0}return!1},clear:function(){this.cellRange=null},getCorners:function(){var e=this.cellRange.getTopLeftCorner(),t=this.cellRange.getBottomRightCorner();return[e.row,e.col,t.row,t.col]},addClassAtCoords:function(e,t,n,o){var i=e.wtTable.getCell(new u(t,n));"object"==typeof i&&a(i,o)},draw:function(e){if(this.isEmpty()){if(this.settings.border){var t=this.getBorder(e);t&&t.disappear()}}else{for(var n,o,i,r=e.wtTable.getRenderedRowsCount(),s=e.wtTable.getRenderedColumnsCount(),l=this.getCorners(),u=0;u<s;u++)(o=e.wtTable.columnFilter.renderedToSource(u))>=l[1]&&o<=l[3]&&(i=e.wtTable.getColumnHeader(o))&&this.settings.highlightColumnClassName&&a(i,this.settings.highlightColumnClassName);for(var c=0;c<r;c++){(n=e.wtTable.rowFilter.renderedToSource(c))>=l[0]&&n<=l[2]&&(i=e.wtTable.getRowHeader(n))&&this.settings.highlightRowClassName&&a(i,this.settings.highlightRowClassName);for(var d=0;d<s;d++)o=e.wtTable.columnFilter.renderedToSource(d),n>=l[0]&&n<=l[2]&&o>=l[1]&&o<=l[3]?this.settings.className&&this.addClassAtCoords(e,n,o,this.settings.className):n>=l[0]&&n<=l[2]?this.settings.highlightRowClassName&&this.addClassAtCoords(e,n,o,this.settings.highlightRowClassName):o>=l[1]&&o<=l[3]&&this.settings.highlightColumnClassName&&this.addClassAtCoords(e,n,o,this.settings.highlightColumnClassName)}if(e.getSetting("onBeforeDrawBorders",l,this.settings.className),this.settings.border){var h=this.getBorder(e);h&&h.appear(l)}}}},{}),window.WalkontableSelection=d},{border:3,"cell/coords":6,"cell/range":7,"helpers/dom/element":47}],20:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableSettings:{get:function(){return r}},__esModule:{value:!0}});var o,i=((o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o}).fastInnerText,r=function(e,t){var n=this;this.wot=e,this.instance=e,this.defaults={table:void 0,debug:!1,externalRowCalculator:!1,stretchH:"none",currentRowClassName:null,currentColumnClassName:null,preventOverflow:function(){return!1},data:void 0,fixedColumnsLeft:0,fixedRowsTop:0,fixedRowsBottom:0,minSpareRows:0,rowHeaders:function(){return[]},columnHeaders:function(){return[]},totalRows:void 0,totalColumns:void 0,cellRenderer:function(e,t,o){var r=n.getSetting("data",e,t);i(o,void 0===r||null===r?"":r)},columnWidth:function(e){},rowHeight:function(e){},defaultRowHeight:23,defaultColumnWidth:50,selections:null,hideBorderOnMouseDownOver:!1,viewportRowCalculatorOverride:null,viewportColumnCalculatorOverride:null,onCellMouseDown:null,onCellMouseOver:null,onCellDblClick:null,onCellCornerMouseDown:null,onCellCornerDblClick:null,beforeDraw:null,onDraw:null,onBeforeDrawBorders:null,onScrollVertically:null,onScrollHorizontally:null,onBeforeTouchScroll:null,onAfterMomentumScroll:null,onBeforeStretchingColumnWidth:function(e){return e},scrollbarWidth:10,scrollbarHeight:10,renderAllRows:!1,groups:!1,rowHeaderWidth:null,columnHeaderHeight:null},this.settings={};for(var o in this.defaults)if(this.defaults.hasOwnProperty(o))if(void 0!==t[o])this.settings[o]=t[o];else{if(void 0===this.defaults[o])throw new Error('A required setting "'+o+'" was not provided');this.settings[o]=this.defaults[o]}};$traceurRuntime.createClass(r,{update:function(e,t){if(void 0===t)for(var n in e)e.hasOwnProperty(n)&&(this.settings[n]=e[n]);else this.settings[e]=t;return this.wot},getSetting:function(e,t,n,o,i){return"function"==typeof this.settings[e]?this.settings[e](t,n,o,i):void 0!==t&&Array.isArray(this.settings[e])?this.settings[e][t]:this.settings[e]},has:function(e){return!!this.settings[e]}},{}),window.WalkontableSettings=r},{"helpers/dom/element":47}],21:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableTable:{get:function(){return S}},__esModule:{value:!0}});var o,i,r,s,a,l,u=(o=e("helpers/dom/element"))&&o.__esModule&&o||{default:o},c=u.getStyle,d=u.getTrimmingContainer,h=u.hasClass,f=u.index,p=u.offset,g=u.removeClass,m=u.removeTextNodes,v=u.overlayContainsElement,w=u.closest,y=((i=e("cell/coords"))&&i.__esModule&&i||{default:i}).WalkontableCellCoords,b=((r=e("cell/range"))&&r.__esModule,((s=e("filter/column"))&&s.__esModule&&s||{default:s}).WalkontableColumnFilter),C=((a=e("filter/row"))&&a.__esModule&&a||{default:a}).WalkontableRowFilter,_=((l=e("tableRenderer"))&&l.__esModule&&l||{default:l}).WalkontableTableRenderer,S=function(e,t){this.wot=e,this.instance=this.wot,this.TABLE=t,this.TBODY=null,this.THEAD=null,this.COLGROUP=null,this.tableOffset=0,this.holderOffset=0,m(this.TABLE),this.spreader=this.createSpreader(this.TABLE),this.hider=this.createHider(this.spreader),this.holder=this.createHolder(this.hider),this.wtRootElement=this.holder.parentNode,this.alignOverlaysWithTrimmingContainer(),this.fixTableDomTree(),this.colgroupChildrenLength=this.COLGROUP.childNodes.length,this.theadChildrenLength=this.THEAD.firstChild?this.THEAD.firstChild.childNodes.length:0,this.tbodyChildrenLength=this.TBODY.childNodes.length,this.rowFilter=null,this.columnFilter=null};$traceurRuntime.createClass(S,{fixTableDomTree:function(){this.TBODY=this.TABLE.querySelector("tbody"),this.TBODY||(this.TBODY=document.createElement("tbody"),this.TABLE.appendChild(this.TBODY)),this.THEAD=this.TABLE.querySelector("thead"),this.THEAD||(this.THEAD=document.createElement("thead"),this.TABLE.insertBefore(this.THEAD,this.TBODY)),this.COLGROUP=this.TABLE.querySelector("colgroup"),this.COLGROUP||(this.COLGROUP=document.createElement("colgroup"),this.TABLE.insertBefore(this.COLGROUP,this.THEAD)),this.wot.getSetting("columnHeaders").length&&!this.THEAD.childNodes.length&&this.THEAD.appendChild(document.createElement("TR"))},createSpreader:function(e){var t,n=e.parentNode;return n&&1===n.nodeType&&h(n,"wtHolder")||(t=document.createElement("div"),t.className="wtSpreader",n&&n.insertBefore(t,e),t.appendChild(e)),t.style.position="relative",t},createHider:function(e){var t,n=e.parentNode;return n&&1===n.nodeType&&h(n,"wtHolder")||(t=document.createElement("div"),t.className="wtHider",n&&n.insertBefore(t,e),t.appendChild(e)),t},createHolder:function(e){var t,n=e.parentNode;return n&&1===n.nodeType&&h(n,"wtHolder")||(t=document.createElement("div"),t.style.position="relative",t.className="wtHolder",n&&n.insertBefore(t,e),this.isWorkingOnClone()||(t.parentNode.className+="ht_master handsontable"),t.appendChild(e)),t},alignOverlaysWithTrimmingContainer:function(){var e=d(this.wtRootElement);if(!this.isWorkingOnClone())if(this.holder.parentNode.style.position="relative",e===window){var t=this.wot.getSetting("preventOverflow");t||(this.holder.style.overflow="visible",this.wtRootElement.style.overflow="visible")}else this.holder.style.width=c(e,"width"),this.holder.style.height=c(e,"height"),this.holder.style.overflow=""},isWorkingOnClone:function(){return!!this.wot.cloneSource},draw:function(e){var t=this.instance.getSetting("totalRows");if(this.isWorkingOnClone()||(this.holderOffset=p(this.holder),e=this.wot.wtViewport.createRenderCalculators(e)),e)this.isWorkingOnClone()||this.wot.wtViewport.createVisibleCalculators(),this.wot.wtOverlays&&this.wot.wtOverlays.refresh(!0);else{this.isWorkingOnClone()?this.tableOffset=this.wot.cloneSource.wtTable.tableOffset:this.tableOffset=p(this.TABLE);var n;n=WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_DEBUG)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_TOP)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_TOP_LEFT_CORNER)?0:WalkontableOverlay.isOverlayTypeOf(this.instance.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM)||WalkontableOverlay.isOverlayTypeOf(this.instance.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER)?Math.max(t-this.wot.getSetting("fixedRowsBottom"),0):this.wot.wtViewport.rowsRenderCalculator.startRow;var o;o=WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_DEBUG)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_LEFT)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_TOP_LEFT_CORNER)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER)?0:this.wot.wtViewport.columnsRenderCalculator.startColumn,this.rowFilter=new C(n,t,this.wot.getSetting("columnHeaders").length),this.columnFilter=new b(o,this.wot.getSetting("totalColumns"),this.wot.getSetting("rowHeaders").length),this.alignOverlaysWithTrimmingContainer(),this._doDraw()}return this.refreshSelections(e),this.isWorkingOnClone()||(this.wot.wtOverlays.topOverlay.resetFixedPosition(),
 this.wot.wtOverlays.bottomOverlay.clone&&this.wot.wtOverlays.bottomOverlay.resetFixedPosition(),this.wot.wtOverlays.leftOverlay.resetFixedPosition(),this.wot.wtOverlays.topLeftCornerOverlay&&this.wot.wtOverlays.topLeftCornerOverlay.resetFixedPosition(),this.instance.wtOverlays.bottomLeftCornerOverlay&&this.instance.wtOverlays.bottomLeftCornerOverlay.clone&&this.wot.wtOverlays.bottomLeftCornerOverlay.resetFixedPosition()),this.wot.drawn=!0,this},_doDraw:function(){new _(this).render()},removeClassFromCells:function(e){for(var t=this.TABLE.querySelectorAll("."+e),n=0,o=t.length;n<o;n++)g(t[n],e)},refreshSelections:function(e){if(this.wot.selections){var t=this.wot.selections.length;if(e)for(var n=0;n<t;n++)this.wot.selections[n].settings.className&&this.removeClassFromCells(this.wot.selections[n].settings.className),this.wot.selections[n].settings.highlightRowClassName&&this.removeClassFromCells(this.wot.selections[n].settings.highlightRowClassName),this.wot.selections[n].settings.highlightColumnClassName&&this.removeClassFromCells(this.wot.selections[n].settings.highlightColumnClassName);for(var o=0;o<t;o++)this.wot.selections[o].draw(this.wot,e)}},getCell:function(e){if(this.isRowBeforeRenderedRows(e.row))return-1;if(this.isRowAfterRenderedRows(e.row))return-2;var t=this.TBODY.childNodes[this.rowFilter.sourceToRendered(e.row)];return t?t.childNodes[this.columnFilter.sourceColumnToVisibleRowHeadedColumn(e.col)]:void 0},getColumnHeader:function(e){var t=void 0!==arguments[1]?arguments[1]:0,n=this.THEAD.childNodes[t];if(n)return n.childNodes[this.columnFilter.sourceColumnToVisibleRowHeadedColumn(e)]},getRowHeader:function(e){if(0===this.columnFilter.sourceColumnToVisibleRowHeadedColumn(0))return null;var t=this.TBODY.childNodes[this.rowFilter.sourceToRendered(e)];return t?t.childNodes[0]:void 0},getCoords:function(e){"TD"!==e.nodeName&&"TH"!==e.nodeName&&(e=w(e,["TD","TH"]));var t=e.parentNode,n=t.parentNode,o=f(t),i=e.cellIndex;return v(WalkontableOverlay.CLONE_TOP_LEFT_CORNER,e)||v(WalkontableOverlay.CLONE_TOP,e)?"THEAD"===n.nodeName&&(o-=n.childNodes.length):o=n===this.THEAD?this.rowFilter.visibleColHeadedRowToSourceRow(o):this.rowFilter.renderedToSource(o),i=v(WalkontableOverlay.CLONE_TOP_LEFT_CORNER,e)||v(WalkontableOverlay.CLONE_LEFT,e)?this.columnFilter.offsettedTH(i):this.columnFilter.visibleRowHeadedColumnToSourceColumn(i),new y(o,i)},getTrForRow:function(e){return this.TBODY.childNodes[this.rowFilter.sourceToRendered(e)]},getFirstRenderedRow:function(){return this.wot.wtViewport.rowsRenderCalculator.startRow},getFirstVisibleRow:function(){return this.wot.wtViewport.rowsVisibleCalculator.startRow},getFirstRenderedColumn:function(){return this.wot.wtViewport.columnsRenderCalculator.startColumn},getFirstVisibleColumn:function(){return this.wot.wtViewport.columnsVisibleCalculator.startColumn},getLastRenderedRow:function(){return this.wot.wtViewport.rowsRenderCalculator.endRow},getLastVisibleRow:function(){return this.wot.wtViewport.rowsVisibleCalculator.endRow},getLastRenderedColumn:function(){return this.wot.wtViewport.columnsRenderCalculator.endColumn},getLastVisibleColumn:function(){return this.wot.wtViewport.columnsVisibleCalculator.endColumn},isRowBeforeRenderedRows:function(e){return this.rowFilter.sourceToRendered(e)<0&&e>=0},isRowAfterViewport:function(e){return this.rowFilter.sourceToRendered(e)>this.getLastVisibleRow()},isRowAfterRenderedRows:function(e){return this.rowFilter.sourceToRendered(e)>this.getLastRenderedRow()},isColumnBeforeViewport:function(e){return this.columnFilter.sourceToRendered(e)<0&&e>=0},isColumnAfterViewport:function(e){return this.columnFilter.sourceToRendered(e)>this.getLastVisibleColumn()},isLastRowFullyVisible:function(){return this.getLastVisibleRow()===this.getLastRenderedRow()},isLastColumnFullyVisible:function(){return this.getLastVisibleColumn()===this.getLastRenderedColumn()},getRenderedColumnsCount:function(){var e=this.wot.wtViewport.columnsRenderCalculator.count,t=this.wot.getSetting("totalColumns");if(this.wot.isOverlayName(WalkontableOverlay.CLONE_DEBUG))e=t;else if(this.wot.isOverlayName(WalkontableOverlay.CLONE_LEFT)||this.wot.isOverlayName(WalkontableOverlay.CLONE_TOP_LEFT_CORNER)||this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER))return Math.min(this.wot.getSetting("fixedColumnsLeft"),t);return e},getRenderedRowsCount:function(){var e=this.wot.wtViewport.rowsRenderCalculator.count,t=this.wot.getSetting("totalRows");return this.wot.isOverlayName(WalkontableOverlay.CLONE_DEBUG)?e=t:this.wot.isOverlayName(WalkontableOverlay.CLONE_TOP)||this.wot.isOverlayName(WalkontableOverlay.CLONE_TOP_LEFT_CORNER)?e=Math.min(this.wot.getSetting("fixedRowsTop"),t):(this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)||this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER))&&(e=Math.min(this.wot.getSetting("fixedRowsBottom"),t)),e},getVisibleRowsCount:function(){return this.wot.wtViewport.rowsVisibleCalculator.count},allRowsInViewport:function(){return this.wot.getSetting("totalRows")==this.getVisibleRowsCount()},getRowHeight:function(e){var t=this.wot.wtSettings.settings.rowHeight(e),n=this.wot.wtViewport.oversizedRows[e];return void 0!==n&&(t=void 0===t?n:Math.max(t,n)),t},getColumnHeaderHeight:function(e){var t=this.wot.wtSettings.settings.defaultRowHeight,n=this.wot.wtViewport.oversizedColumnHeaders[e];return void 0!==n&&(t=t?Math.max(t,n):n),t},getVisibleColumnsCount:function(){return this.wot.wtViewport.columnsVisibleCalculator.count},allColumnsInViewport:function(){return this.wot.getSetting("totalColumns")==this.getVisibleColumnsCount()},getColumnWidth:function(e){var t=this.wot.wtSettings.settings.columnWidth;return"function"==typeof t?t=t(e):"object"==typeof t&&(t=t[e]),t||this.wot.wtSettings.settings.defaultColumnWidth},getStretchedColumnWidth:function(e){var t=this.getColumnWidth(e),n=null==t?this.instance.wtSettings.settings.defaultColumnWidth:t,o=this.wot.wtViewport.columnsRenderCalculator;if(o){var i=o.getStretchedColumnWidth(e,n);i&&(n=i)}return n}},{}),window.WalkontableTable=S},{"cell/coords":6,"cell/range":7,"filter/column":10,"filter/row":11,"helpers/dom/element":47,tableRenderer:22}],22:[function(e,t,n){"use strict";function o(e,t){var n=document.createElement("TH");return t.insertBefore(n,e),t.removeChild(e),n}function i(e,t){var n=document.createElement("TD");return t.insertBefore(n,e),t.removeChild(e),n}Object.defineProperties(n,{WalkontableTableRenderer:{get:function(){return p}},__esModule:{value:!0}});var r,s=(r=e("helpers/dom/element"))&&r.__esModule&&r||{default:r},a=s.addClass,l=s.empty,u=s.getScrollbarWidth,c=s.hasClass,d=s.innerHeight,h=s.outerWidth,f=!1,p=function(e){this.wtTable=e,this.wot=e.instance,this.instance=e.instance,this.rowFilter=e.rowFilter,this.columnFilter=e.columnFilter,this.TABLE=e.TABLE,this.THEAD=e.THEAD,this.TBODY=e.TBODY,this.COLGROUP=e.COLGROUP,this.rowHeaders=[],this.rowHeaderCount=0,this.columnHeaders=[],this.columnHeaderCount=0,this.fixedRowsTop=0,this.fixedRowsBottom=0};$traceurRuntime.createClass(p,{render:function(){this.wtTable.isWorkingOnClone()||this.wot.getSetting("beforeDraw",!0),this.rowHeaders=this.wot.getSetting("rowHeaders"),this.rowHeaderCount=this.rowHeaders.length,this.fixedRowsTop=this.wot.getSetting("fixedRowsTop"),this.fixedRowsBottom=this.wot.getSetting("fixedRowsBottom"),this.columnHeaders=this.wot.getSetting("columnHeaders"),this.columnHeaderCount=this.columnHeaders.length;var e,t=this.wtTable.getRenderedColumnsCount(),n=this.wtTable.getRenderedRowsCount(),o=this.wot.getSetting("totalColumns"),i=this.wot.getSetting("totalRows"),r=!1;if((WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM)||WalkontableOverlay.isOverlayTypeOf(this.wot.cloneOverlay,WalkontableOverlay.CLONE_BOTTOM_LEFT_CORNER))&&(this.columnHeaders=[],this.columnHeaderCount=0),o>=0&&(this.adjustAvailableNodes(),r=!0,this.renderColumnHeaders(),this.renderRows(i,n,t),this.wtTable.isWorkingOnClone()||(e=this.wot.wtViewport.getWorkspaceWidth(),this.wot.wtViewport.containerWidth=null),this.adjustColumnWidths(t),this.markOversizedColumnHeaders(),this.adjustColumnHeaderHeights()),r||this.adjustAvailableNodes(),this.removeRedundantRows(n),this.wtTable.isWorkingOnClone()&&!this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)||this.markOversizedRows(),this.wtTable.isWorkingOnClone())this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)&&this.wot.cloneSource.wtOverlays.adjustElementsSize();else{this.wot.wtViewport.createVisibleCalculators(),this.wot.wtOverlays.refresh(!1);var s=h(this.wtTable.hider),a=h(this.wtTable.TABLE);if(0!==s&&a!==s&&this.adjustColumnWidths(t),this.wot.wtOverlays.applyToDOM(),e!==this.wot.wtViewport.getWorkspaceWidth()){this.wot.wtViewport.containerWidth=null;var l=this.wtTable.getFirstRenderedColumn(),u=this.wtTable.getLastRenderedColumn(),c=this.wot.getSetting("rowHeaderWidth");if(null!=c)for(var d=0;d<this.rowHeaderCount;d++)this.COLGROUP.childNodes[d].style.width=(isNaN(c)?c[d]:c)+"px";for(var f=l;f<u;f++){var p=this.wtTable.getStretchedColumnWidth(f),g=this.columnFilter.sourceToRendered(f);this.COLGROUP.childNodes[g+this.rowHeaderCount].style.width=p+"px"}}this.wot.getSetting("onDraw",!0)}},removeRedundantRows:function(e){for(;this.wtTable.tbodyChildrenLength>e;)this.TBODY.removeChild(this.TBODY.lastChild),this.wtTable.tbodyChildrenLength--},renderRows:function(e,t,n){for(var o,i=0,r=this.rowFilter.renderedToSource(i),s=this.wtTable.isWorkingOnClone();r<e&&r>=0&&(!f&&i>1e3&&(f=!0,console.warn('Performance tip: Handsontable rendered more than 1000 visible rows. Consider limiting the number of rendered rows by specifying the table height and/or turning off the "renderAllRows" option.')),void 0===t||i!==t);){if(o=this.getOrCreateTrForRow(i,o),this.renderRowHeaders(r,o),this.adjustColumns(o,n+this.rowHeaderCount),this.renderCells(r,o,n),s&&!this.wot.isOverlayName(WalkontableOverlay.CLONE_BOTTOM)||this.resetOversizedRow(r),o.firstChild){var a=this.wot.wtTable.getRowHeight(r);a?(a--,o.firstChild.style.height=a+"px"):o.firstChild.style.height=""}i++,r=this.rowFilter.renderedToSource(i)}},resetOversizedRow:function(e){this.wot.getSetting("externalRowCalculator")||this.wot.wtViewport.oversizedRows&&this.wot.wtViewport.oversizedRows[e]&&(this.wot.wtViewport.oversizedRows[e]=void 0)},markOversizedRows:function(){if(!this.wot.getSetting("externalRowCalculator")){var e,t,n,o,i,r=this.instance.wtTable.TBODY.childNodes.length,s=r*this.instance.wtSettings.settings.defaultRowHeight,a=d(this.instance.wtTable.TBODY)-1;if(this.instance.getSetting("totalRows"),s!==a||this.instance.getSetting("fixedRowsBottom"))for(;r;)r--,n=this.instance.wtTable.rowFilter.renderedToSource(r),e=this.instance.wtTable.getRowHeight(n),o=this.instance.wtTable.getTrForRow(n),i=o.querySelector("th"),t=i?d(i):d(o)-1,(!e&&this.instance.wtSettings.settings.defaultRowHeight<t||e<t)&&(this.instance.wtViewport.oversizedRows[n]=++t)}},markOversizedColumnHeaders:function(){var e=this.wot.getOverlayName();if(this.columnHeaderCount&&!this.wot.wtViewport.hasOversizedColumnHeadersMarked[e]&&!this.wtTable.isWorkingOnClone()){for(var t=this.wtTable.getRenderedColumnsCount(),n=0;n<this.columnHeaderCount;n++)for(var o=-1*this.rowHeaderCount;o<t;o++)this.markIfOversizedColumnHeader(o);this.wot.wtViewport.hasOversizedColumnHeadersMarked[e]=!0}},adjustColumnHeaderHeights:function(){for(var e=this.wot.getSetting("columnHeaders"),t=this.wot.wtTable.THEAD.childNodes,n=this.wot.wtViewport.oversizedColumnHeaders,o=0,i=e.length;o<i;o++)if(n[o]){if(0===t[o].childNodes.length)return;t[o].childNodes[0].style.height=n[o]+"px"}},markIfOversizedColumnHeader:function(e){for(var t,n,o,i=this.wot.wtTable.columnFilter.renderedToSource(e),r=this.columnHeaderCount,s=this.wot.wtSettings.settings.defaultRowHeight,a=this.wot.getSetting("columnHeaderHeight")||[];r;)r--,t=this.wot.wtTable.getColumnHeaderHeight(r),(n=this.wot.wtTable.getColumnHeader(i,r))&&(o=d(n),(!t&&s<o||t<o)&&(this.wot.wtViewport.oversizedColumnHeaders[r]=o),Array.isArray(a)?null!=a[r]&&(this.wot.wtViewport.oversizedColumnHeaders[r]=a[r]):isNaN(a)||(this.wot.wtViewport.oversizedColumnHeaders[r]=a),this.wot.wtViewport.oversizedColumnHeaders[r]<(a[r]||a)&&(this.wot.wtViewport.oversizedColumnHeaders[r]=a[r]||a))},renderCells:function(e,t,n){for(var o,r,s=0;s<n;s++)r=this.columnFilter.renderedToSource(s),o=0===s?t.childNodes[this.columnFilter.sourceColumnToVisibleRowHeadedColumn(r)]:o.nextSibling,"TH"==o.nodeName&&(o=i(o,t)),c(o,"hide")||(o.className=""),o.removeAttribute("style"),this.wot.wtSettings.settings.cellRenderer(e,r,o);return o},adjustColumnWidths:function(e){var t=0,n=this.wot.cloneSource?this.wot.cloneSource:this.wot,o=n.wtTable.holder;o.offsetHeight<o.scrollHeight&&(t=u()),this.wot.wtViewport.columnsRenderCalculator.refreshStretching(this.wot.wtViewport.getViewportWidth()-t);var i=this.wot.getSetting("rowHeaderWidth");if(null!=i)for(var r=0;r<this.rowHeaderCount;r++)this.COLGROUP.childNodes[r].style.width=(isNaN(i)?i[r]:i)+"px";for(var s=0;s<e;s++){var a=this.wtTable.getStretchedColumnWidth(this.columnFilter.renderedToSource(s));this.COLGROUP.childNodes[s+this.rowHeaderCount].style.width=a+"px"}},appendToTbody:function(e){this.TBODY.appendChild(e),this.wtTable.tbodyChildrenLength++},getOrCreateTrForRow:function(e,t){var n;return e>=this.wtTable.tbodyChildrenLength?(n=this.createRow(),this.appendToTbody(n)):n=0===e?this.TBODY.firstChild:t.nextSibling,n.className&&n.removeAttribute("class"),n},createRow:function(){for(var e=document.createElement("TR"),t=0;t<this.rowHeaderCount;t++)e.appendChild(document.createElement("TH"));return e},renderRowHeader:function(e,t,n){n.className="",n.removeAttribute("style"),this.rowHeaders[t](e,n,t)},renderRowHeaders:function(e,t){for(var n=t.firstChild,i=0;i<this.rowHeaderCount;i++)n?"TD"==n.nodeName&&(n=o(n,t)):(n=document.createElement("TH"),t.appendChild(n)),this.renderRowHeader(e,i,n),n=n.nextSibling},adjustAvailableNodes:function(){this.adjustColGroups(),this.adjustThead()},renderColumnHeaders:function(){if(this.columnHeaderCount)for(var e=this.wtTable.getRenderedColumnsCount(),t=0;t<this.columnHeaderCount;t++)for(var n=this.getTrForColumnHeaders(t),o=-1*this.rowHeaderCount;o<e;o++){var i=this.columnFilter.renderedToSource(o);this.renderColumnHeader(t,i,n.childNodes[o+this.rowHeaderCount])}},adjustColGroups:function(){for(var e=this.wtTable.getRenderedColumnsCount();this.wtTable.colgroupChildrenLength<e+this.rowHeaderCount;)this.COLGROUP.appendChild(document.createElement("COL")),this.wtTable.colgroupChildrenLength++;for(;this.wtTable.colgroupChildrenLength>e+this.rowHeaderCount;)this.COLGROUP.removeChild(this.COLGROUP.lastChild),this.wtTable.colgroupChildrenLength--;this.rowHeaderCount&&a(this.COLGROUP.childNodes[0],"rowHeader")},adjustThead:function(){var e=this.wtTable.getRenderedColumnsCount(),t=this.THEAD.firstChild;if(this.columnHeaders.length){for(var n=0,o=this.columnHeaders.length;n<o;n++){for(t=this.THEAD.childNodes[n],t||(t=document.createElement("TR"),this.THEAD.appendChild(t)),this.theadChildrenLength=t.childNodes.length;this.theadChildrenLength<e+this.rowHeaderCount;)t.appendChild(document.createElement("TH")),this.theadChildrenLength++;for(;this.theadChildrenLength>e+this.rowHeaderCount;)t.removeChild(t.lastChild),this.theadChildrenLength--}var i=this.THEAD.childNodes.length;if(i>this.columnHeaders.length)for(var r=this.columnHeaders.length;r<i;r++)this.THEAD.removeChild(this.THEAD.lastChild)}else t&&l(t)},getTrForColumnHeaders:function(e){return this.THEAD.childNodes[e]},renderColumnHeader:function(e,t,n){return n.className="",n.removeAttribute("style"),this.columnHeaders[e](t,n,e)},adjustColumns:function(e,t){for(var n=e.childNodes.length;n<t;){var o=document.createElement("TD");e.appendChild(o),n++}for(;n>t;)e.removeChild(e.lastChild),n--},removeRedundantColumns:function(e){for(;this.wtTable.tbodyChildrenLength>e;)this.TBODY.removeChild(this.TBODY.lastChild),this.wtTable.tbodyChildrenLength--}},{}),window.WalkontableTableRenderer=p},{"helpers/dom/element":47}],23:[function(e,t,n){"use strict";Object.defineProperties(n,{WalkontableViewport:{get:function(){return w}},__esModule:{value:!0}});var o,i,r,s,a,l=((o=e("browser"))&&o.__esModule&&o||{default:o}).default,u=(i=e("helpers/dom/element"))&&i.__esModule&&i||{default:i},c=u.getScrollbarWidth,d=u.getStyle,h=u.offset,f=u.outerHeight,p=u.outerWidth,g=((r=e("eventManager"))&&r.__esModule&&r||{default:r}).EventManager,m=((s=e("calculator/viewportColumns"))&&s.__esModule&&s||{default:s}).WalkontableViewportColumnsCalculator,v=((a=e("calculator/viewportRows"))&&a.__esModule&&a||{default:a}).WalkontableViewportRowsCalculator,w=function(e){var t=this;this.wot=e,this.instance=this.wot,this.oversizedRows=[],this.oversizedColumnHeaders=[],this.hasOversizedColumnHeadersMarked={},this.clientHeight=0,this.containerWidth=NaN,this.rowHeaderWidth=NaN,this.rowsVisibleCalculator=null,this.columnsVisibleCalculator=null,this.eventManager=new g(this.wot),this.eventManager.addEventListener(window,"resize",function(){t.clientHeight=t.getWorkspaceHeight()})};$traceurRuntime.createClass(w,{getWorkspaceHeight:function(){var e,t=this.instance.wtOverlays.topOverlay.trimmingContainer,n=0;return t===window?n=document.documentElement.clientHeight:(e=f(t),n=e>0&&t.clientHeight>0?t.clientHeight:1/0),n},getWorkspaceWidth:function(){var e,t,n=this.wot.getSetting("totalColumns"),o=this.instance.wtOverlays.leftOverlay.trimmingContainer,i=this.wot.getSetting("stretchH"),r=document.documentElement.offsetWidth;return this.wot.getSetting("preventOverflow")?p(this.instance.wtTable.wtRootElement):(e=l.freezeOverlays?Math.min(r-this.getWorkspaceOffset().left,r):Math.min(this.getContainerFillWidth(),r-this.getWorkspaceOffset().left,r),o===window&&n>0&&this.sumColumnWidths(0,n-1)>e?document.documentElement.clientWidth:o===window||"scroll"!=(t=d(this.instance.wtOverlays.leftOverlay.trimmingContainer,"overflow"))&&"hidden"!=t&&"auto"!=t?"none"!==i&&i?e:Math.max(e,p(this.instance.wtTable.TABLE)):Math.max(e,o.clientWidth))},hasVerticalScroll:function(){return this.getWorkspaceActualHeight()>this.getWorkspaceHeight()},hasHorizontalScroll:function(){return this.getWorkspaceActualWidth()>this.getWorkspaceWidth()},sumColumnWidths:function(e,t){for(var n=0;e<t;)n+=this.wot.wtTable.getColumnWidth(e),e++;return n},getContainerFillWidth:function(){if(this.containerWidth)return this.containerWidth;var e,t,n=this.instance.wtTable.holder;return t=document.createElement("div"),t.style.width="100%",t.style.height="1px",n.appendChild(t),e=t.offsetWidth,this.containerWidth=e,n.removeChild(t),e},getWorkspaceOffset:function(){return h(this.wot.wtTable.TABLE)},getWorkspaceActualHeight:function(){return f(this.wot.wtTable.TABLE)},getWorkspaceActualWidth:function(){return p(this.wot.wtTable.TABLE)||p(this.wot.wtTable.TBODY)||p(this.wot.wtTable.THEAD)},getColumnHeaderHeight:function(){return isNaN(this.columnHeaderHeight)&&(this.columnHeaderHeight=f(this.wot.wtTable.THEAD)),this.columnHeaderHeight},getViewportHeight:function(){var e,t=this.getWorkspaceHeight();return t===1/0?t:(e=this.getColumnHeaderHeight(),e>0&&(t-=e),t)},getRowHeaderWidth:function(){var e=this.instance.getSetting("rowHeaderWidth"),t=this.instance.getSetting("rowHeaders");if(e){this.rowHeaderWidth=0;for(var n=0,o=t.length;n<o;n++)this.rowHeaderWidth+=e[n]||e}if(this.wot.cloneSource)return this.wot.cloneSource.wtViewport.getRowHeaderWidth();if(isNaN(this.rowHeaderWidth))if(t.length){var i=this.instance.wtTable.TABLE.querySelector("TH");this.rowHeaderWidth=0;for(var r=0,s=t.length;r<s;r++)i?(this.rowHeaderWidth+=p(i),i=i.nextSibling):this.rowHeaderWidth+=50}else this.rowHeaderWidth=0;return this.rowHeaderWidth},getViewportWidth:function(){var e,t=this.getWorkspaceWidth();return t===1/0?t:(e=this.getRowHeaderWidth(),e>0?t-e:t)},createRowsCalculator:function(){var e,t,n,o,i,r,s,a=void 0!==arguments[0]&&arguments[0],l=this;return this.rowHeaderWidth=NaN,e=this.wot.wtSettings.settings.renderAllRows?1/0:this.getViewportHeight(),t=this.wot.wtOverlays.topOverlay.getScrollPosition()-this.wot.wtOverlays.topOverlay.getTableParentOffset(),t<0&&(t=0),n=this.wot.getSetting("fixedRowsTop"),i=this.wot.getSetting("fixedRowsBottom"),s=this.wot.getSetting("totalRows"),n&&(r=this.wot.wtOverlays.topOverlay.sumCellSizes(0,n),t+=r,e-=r),i&&this.wot.wtOverlays.bottomOverlay.clone&&(r=this.wot.wtOverlays.bottomOverlay.sumCellSizes(s-i,s),e-=r),o=this.wot.wtTable.holder.clientHeight===this.wot.wtTable.holder.offsetHeight?0:c(),new v(e,t,this.wot.getSetting("totalRows"),function(e){return l.wot.wtTable.getRowHeight(e)},a?null:this.wot.wtSettings.settings.viewportRowCalculatorOverride,a,o)},createColumnsCalculator:function(){var e,t,n=void 0!==arguments[0]&&arguments[0],o=this,i=this.getViewportWidth();if(this.columnHeaderHeight=NaN,e=this.wot.wtOverlays.leftOverlay.getScrollPosition()-this.wot.wtOverlays.leftOverlay.getTableParentOffset(),e<0&&(e=0),t=this.wot.getSetting("fixedColumnsLeft")){var r=this.wot.wtOverlays.leftOverlay.sumCellSizes(0,t);e+=r,i-=r}return this.wot.wtTable.holder.clientWidth!==this.wot.wtTable.holder.offsetWidth&&(i-=c()),new m(i,e,this.wot.getSetting("totalColumns"),function(e){return o.wot.wtTable.getColumnWidth(e)},n?null:this.wot.wtSettings.settings.viewportColumnCalculatorOverride,n,this.wot.getSetting("stretchH"),function(e,t){return o.wot.getSetting("onBeforeStretchingColumnWidth",e,t)})},createRenderCalculators:function(){var e=void 0!==arguments[0]&&arguments[0];if(e){var t=this.createRowsCalculator(!0),n=this.createColumnsCalculator(!0);this.areAllProposedVisibleRowsAlreadyRendered(t)&&this.areAllProposedVisibleColumnsAlreadyRendered(n)||(e=!1)}return e||(this.rowsRenderCalculator=this.createRowsCalculator(),this.columnsRenderCalculator=this.createColumnsCalculator()),this.rowsVisibleCalculator=null,this.columnsVisibleCalculator=null,e},createVisibleCalculators:function(){this.rowsVisibleCalculator=this.createRowsCalculator(!0),this.columnsVisibleCalculator=this.createColumnsCalculator(!0)},areAllProposedVisibleRowsAlreadyRendered:function(e){return!(!this.rowsVisibleCalculator||e.startRow<this.rowsRenderCalculator.startRow||e.startRow===this.rowsRenderCalculator.startRow&&e.startRow>0||e.endRow>this.rowsRenderCalculator.endRow||e.endRow===this.rowsRenderCalculator.endRow&&e.endRow<this.wot.getSetting("totalRows")-1)},areAllProposedVisibleColumnsAlreadyRendered:function(e){return!(!this.columnsVisibleCalculator||e.startColumn<this.columnsRenderCalculator.startColumn||e.startColumn===this.columnsRenderCalculator.startColumn&&e.startColumn>0||e.endColumn>this.columnsRenderCalculator.endColumn||e.endColumn===this.columnsRenderCalculator.endColumn&&e.endColumn<this.wot.getSetting("totalColumns")-1)}},{}),window.WalkontableViewport=w},{browser:24,"calculator/viewportColumns":4,"calculator/viewportRows":5,eventManager:42,"helpers/dom/element":47}],24:[function(e,t,n){"use strict";function o(e,t){var n=new o.Core(e,t||{});return n.init(),n}var i,r,s,a,l,u,c,d,h,f,p,g,m,v,w,y,b,C,_,S,T,E,R,M;t.exports=o,o.utils={},i=e("shims/runtime"),i&&i.__esModule,(r=e("es6collections"))&&r.__esModule;var O=((s=e("pluginHooks"))&&s.__esModule&&s||{default:s}).Hooks,k=((a=e("numbro"))&&a.__esModule&&a||{default:a}).default,x=((l=e("moment"))&&l.__esModule&&l||{default:l}).default;"object"==typeof window&&(void 0===window.numbro&&(window.numbro=k),void 0===window.moment&&(window.moment=x)),o.hooks||(o.hooks=new O),o.utils.Hooks=O,u=e("core"),u&&u.__esModule,c=e("renderers/_cellDecorator"),c&&c.__esModule,d=e("cellTypes"),d&&d.__esModule,(h=e("plugins/jqueryHandsontable"))&&h.__esModule;var D=(f=e("helpers/array"))&&f.__esModule&&f||{default:f},A=(p=e("helpers/browser"))&&p.__esModule&&p||{default:p},P=(g=e("helpers/data"))&&g.__esModule&&g||{default:g},H=(m=e("helpers/date"))&&m.__esModule&&m||{default:m},N=(v=e("helpers/feature"))&&v.__esModule&&v||{default:v},L=(w=e("helpers/function"))&&w.__esModule&&w||{default:w},I=(y=e("helpers/mixed"))&&y.__esModule&&y||{default:y},W=(b=e("helpers/number"))&&b.__esModule&&b||{default:b},j=(C=e("helpers/object"))&&C.__esModule&&C||{default:C},B=(_=e("helpers/setting"))&&_.__esModule&&_||{default:_},F=(S=e("helpers/string"))&&S.__esModule&&S||{default:S},V=(T=e("helpers/unicode"))&&T.__esModule&&T||{default:T},z=(E=e("helpers/dom/element"))&&E.__esModule&&E||{default:E},Y=(R=e("helpers/dom/event"))&&R.__esModule&&R||{default:R},U=[D,A,P,H,N,L,I,W,j,B,F,V],G=[z,Y];o.buildDate="Wed Jul 27 2016 12:03:17 GMT+0200 (CEST)",o.packageName="handsontable",o.version="0.26.1";var $="@@baseVersion";/^@@/.test($)||(o.baseVersion=$),o.plugins={};var q=((M=e("plugins"))&&M.__esModule&&M||{default:M}).registerPlugin;o.plugins.registerPlugin=q,o.helper={},o.dom={},o.Dom=o.dom,D.arrayEach(U,function(e){D.arrayEach(Object.getOwnPropertyNames(e),function(t){"_"!==t.charAt(0)&&(o.helper[t]=e[t])})}),D.arrayEach(G,function(e){D.arrayEach(Object.getOwnPropertyNames(e),function(t){"_"!==t.charAt(0)&&(o.dom[t]=e[t])})})},{cellTypes:25,core:26,es6collections:"es6collections","helpers/array":43,"helpers/browser":44,"helpers/data":45,"helpers/date":46,"helpers/dom/element":47,"helpers/dom/event":48,"helpers/feature":49,"helpers/function":50,"helpers/mixed":51,"helpers/number":52,"helpers/object":53,"helpers/setting":54,"helpers/string":55,"helpers/unicode":56,moment:"moment",numbro:"numbro",pluginHooks:59,plugins:60,"plugins/jqueryHandsontable":2,"renderers/_cellDecorator":106,"shims/runtime":113}],25:[function(e,t,n){"use strict";var o,i,r,s,a,l,u,c,d,h,f,p,g,m,v,w,y,b,C,_,S,T,E,R,M=((o=e("helpers/browser"))&&o.__esModule&&o||{default:o}).isMobileBrowser,O=((i=e("editors"))&&i.__esModule&&i||{default:i}).getEditorConstructor,k=((r=e("renderers"))&&r.__esModule&&r||{default:r}).getRenderer,x=((s=e("editors/autocompleteEditor"))&&s.__esModule,(a=e("editors/checkboxEditor"))&&a.__esModule,(l=e("editors/dateEditor"))&&l.__esModule,(u=e("editors/dropdownEditor"))&&u.__esModule,(c=e("editors/handsontableEditor"))&&c.__esModule,(d=e("editors/mobileTextEditor"))&&d.__esModule,(h=e("editors/numericEditor"))&&h.__esModule,(f=e("editors/passwordEditor"))&&f.__esModule,(p=e("editors/selectEditor"))&&p.__esModule,(g=e("editors/textEditor"))&&g.__esModule,(m=e("renderers/autocompleteRenderer"))&&m.__esModule,(v=e("renderers/checkboxRenderer"))&&v.__esModule,(w=e("renderers/htmlRenderer"))&&w.__esModule,(y=e("renderers/numericRenderer"))&&y.__esModule,(b=e("renderers/passwordRenderer"))&&b.__esModule,(C=e("renderers/textRenderer"))&&C.__esModule,(_=e("validators/autocompleteValidator"))&&_.__esModule,(S=e("validators/dateValidator"))&&S.__esModule,(T=e("validators/timeValidator"))&&T.__esModule,(E=e("validators/numericValidator"))&&E.__esModule,((R=e("browser"))&&R.__esModule&&R||{default:R}).default);x.AutocompleteCell={editor:O("autocomplete"),renderer:k("autocomplete"),validator:x.AutocompleteValidator},x.CheckboxCell={editor:O("checkbox"),renderer:k("checkbox")},x.TextCell={editor:O(M()?"mobile":"text"),renderer:k("text")},x.NumericCell={editor:O("numeric"),renderer:k("numeric"),validator:x.NumericValidator,dataType:"number"},x.DateCell={editor:O("date"),validator:x.DateValidator,renderer:k("autocomplete")},x.TimeCell={editor:O("text"),validator:x.TimeValidator,renderer:k("text")},x.HandsontableCell={editor:O("handsontable"),renderer:k("autocomplete")},x.PasswordCell={editor:O("password"),renderer:k("password"),copyable:!1},x.DropdownCell={editor:O("dropdown"),renderer:k("autocomplete"),validator:x.AutocompleteValidator},x.cellTypes={text:x.TextCell,date:x.DateCell,time:x.TimeCell,numeric:x.NumericCell,checkbox:x.CheckboxCell,autocomplete:x.AutocompleteCell,handsontable:x.HandsontableCell,password:x.PasswordCell,dropdown:x.DropdownCell},x.cellLookup={validator:{numeric:x.NumericValidator,autocomplete:x.AutocompleteValidator}}},{browser:24,editors:30,"editors/autocompleteEditor":32,"editors/checkboxEditor":33,"editors/dateEditor":34,"editors/dropdownEditor":35,"editors/handsontableEditor":36,"editors/mobileTextEditor":37,"editors/numericEditor":38,"editors/passwordEditor":39,"editors/selectEditor":40,"editors/textEditor":41,"helpers/browser":44,renderers:105,"renderers/autocompleteRenderer":107,"renderers/checkboxRenderer":108,"renderers/htmlRenderer":109,"renderers/numericRenderer":110,"renderers/passwordRenderer":111,"renderers/textRenderer":112,"validators/autocompleteValidator":118,"validators/dateValidator":119,"validators/numericValidator":120,"validators/timeValidator":121}],26:[function(e,t,n){"use strict";var o,i,r,s,a,l,u,c,d,h,f,p,g,m,v,w,y,b,C,_,S,T,E=((o=e("browser"))&&o.__esModule&&o||{default:o}).default,R=((i=e("numbro"))&&i.__esModule&&i||{default:i}).default,M=(r=e("helpers/dom/element"))&&r.__esModule&&r||{default:r},O=M.addClass,k=M.empty,x=M.isChildOfWebComponentTable,D=M.removeClass,A=((s=e("helpers/setting"))&&s.__esModule&&s||{default:s}).columnFactory,P=((a=e("helpers/function"))&&a.__esModule&&a||{default:a}).isFunction,H=(l=e("helpers/mixed"))&&l.__esModule&&l||{default:l},N=H.isDefined,L=H.isUndefined,I=((u=e("helpers/browser"))&&u.__esModule&&u||{default:u}).isMobileBrowser,W=((c=e("dataMap"))&&c.__esModule&&c||{default:c}).DataMap,j=((d=e("editorManager"))&&d.__esModule&&d||{default:d}).EditorManager,B=((h=e("eventManager"))&&h.__esModule&&h||{default:h}).eventManager,F=(f=e("helpers/object"))&&f.__esModule&&f||{default:f},V=F.deepClone,z=F.duckSchema,Y=F.extend,U=F.isObject,G=F.isObjectEquals,$=F.deepObjectSize,q=(p=e("helpers/array"))&&p.__esModule&&p||{default:p},K=q.arrayFlatten,X=q.arrayMap,J=((g=e("plugins"))&&g.__esModule&&g||{default:g}).getPlugin,Z=((m=e("renderers"))&&m.__esModule&&m||{default:m}).getRenderer,Q=((v=e("helpers/string"))&&v.__esModule&&v||{default:v}).randomString,ee=((w=e("helpers/number"))&&w.__esModule&&w||{default:w}).rangeEach,te=((y=e("tableView"))&&y.__esModule&&y||{default:y}).TableView,ne=((b=e("dataSource"))&&b.__esModule&&b||{default:b}).DataSource,oe=(C=e("helpers/data"))&&C.__esModule&&C||{default:C},ie=oe.translateRowsToColumns,re=oe.cellMethodLookupFactory,se=oe.spreadsheetColumnLabel,ae=((_=e("3rdparty/walkontable/src/cell/coords"))&&_.__esModule&&_||{default:_}).WalkontableCellCoords,le=((S=e("3rdparty/walkontable/src/cell/range"))&&S.__esModule&&S||{default:S}).WalkontableCellRange,ue=((T=e("3rdparty/walkontable/src/calculator/viewportColumns"))&&T.__esModule&&T||{default:T}).WalkontableViewportColumnsCalculator;E.activeGuid=null,E.Core=function(e,t){function n(){var e=!1;return{validatorsInQueue:0,valid:!0,addValidatorToQueue:function(){this.validatorsInQueue++,e=!1},removeValidatorFormQueue:function(){this.validatorsInQueue=this.validatorsInQueue-1<0?0:this.validatorsInQueue-1,this.checkIfQueueIsEmpty()},onQueueEmpty:function(e){},checkIfQueueIsEmpty:function(){0==this.validatorsInQueue&&0==e&&(e=!0,this.onQueueEmpty(this.valid))}}}function o(e,t,o){function i(){var n;e.length&&(n=E.hooks.run(m,"beforeChange",e,t),P(n)?console.warn("Your beforeChange callback returns a function. It's not supported since Handsontable 0.12.1 (and the returned function will not be executed)."):!1===n&&e.splice(0,e.length)),o()}var r=new n;r.onQueueEmpty=i;for(var s=e.length-1;s>=0;s--)if(null===e[s])e.splice(s,1);else{var a=e[s][0],l=d.propToCol(e[s][1]),u=m.getCellMeta(a,l);if("numeric"===u.type&&"string"==typeof e[s][3]&&e[s][3].length>0&&(/^-?[\d\s]*(\.|\,)?\d*$/.test(e[s][3])||u.format)){var c=e[s][3].length;L(u.language)?R.culture("en-US"):e[s][3].indexOf(".")===c-3&&-1===e[s][3].indexOf(",")?R.culture("en-US"):R.culture(u.language);var h=R.cultureData(R.culture()).delimiters;new RegExp("^\\"+h.decimal+"[0-9]+$").test(e[s][3]+"")&&(e[s][3]="0"+e[s][3]),!R.validate(e[s][3])&&isNaN(parseFloat(e[s][3]))||(e[s][3]=R().unformat(e[s][3]))}m.getCellValidator(u)&&(r.addValidatorToQueue(),m.validateCell(e[s][3],u,function(t,n){return function(o){
diff --git a/zh/maillist.html b/zh/maillist.html
index b639213..933d674 100644
--- a/zh/maillist.html
+++ b/zh/maillist.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>邮件列表 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/zh/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
-<!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>邮件列表</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="maillist" class="page-content"><div class="page-nav"></div><div class="container"><h2>关于邮件列表</h2><p>邮件列表是我们公开讨论并记录的地方。如果你想做以下事情,欢迎订阅邮件列表:</p><ul><li>随时了解 bug 以及新需求的报告;</li><li>参与讨论开发计划或特定的问题;</li><li>帮助通过邮件提问的人;</li><li>等等……</li></ul><p>如果你有一个特定的问题想要问,建议使用 <a href="https://ecomfe.github.io/echarts-issue-helper/?lang=zh-cn">Issue Helper</a> 报 Bug 或提需求,这是一种更有效率的方式。</p><p><a href="mailto:commits@echarts.incubator.apache.org">commits@echarts.incubator.apache.org</a> 主要是代码提交记录,而 <a href="mailto:dev@echarts.incubator.apache.org">dev@echarts.incubator.apache.org</a> 则是其他通用问题的讨论。</p><p>这两个邮件列表是公开的,这意味着你可以在 <a href="https://lists.apache.org/list.html?commits@echarts.apache.org">https://lists.apache.org/list.html?commits@echarts.apache.org</a> 和 <a href="https://lists.apache.org/list.html?dev@echarts.apache.org">https://lists.apache.org/list.html?dev@echarts.apache.org</a> 访问到邮件内容,而无需订阅。</p><h2>如何订阅</h2><p>给 <a href="mailto:commits-subscribe@echarts.incubator.apache.org">commits-subscribe@echarts.incubator.apache.org</a> 或 <a href="mailto:dev-subscribe@echarts.incubator.apache.org">dev-subscribe@echarts.incubator.apache.org</a> 发邮件来分别订阅 commits@echarts.incubator.apache.org and dev@echarts.incubator.apache.org。</p><p>你会收到一封回信,请照着邮件内容操作。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="ECharts FAQ"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>邮件列表</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="maillist" class="page-content"><div class="page-nav"></div><div class="container"><h2>关于邮件列表</h2><p>邮件列表是我们公开讨论并记录的地方。如果你想做以下事情,欢迎订阅邮件列表:</p><ul><li>随时了解 bug 以及新需求的报告;</li><li>参与讨论开发计划或特定的问题;</li><li>帮助通过邮件提问的人;</li><li>等等……</li></ul><p>如果你有一个特定的问题想要问,建议使用 <a href="https://ecomfe.github.io/echarts-issue-helper/?lang=zh-cn">Issue Helper</a> 报 Bug 或提需求,这是一种更有效率的方式。</p><p><a href="mailto:commits@echarts.incubator.apache.org">commits@echarts.incubator.apache.org</a> 主要是代码提交记录,而 <a href="mailto:dev@echarts.incubator.apache.org">dev@echarts.incubator.apache.org</a> 则是其他通用问题的讨论。</p><p>这两个邮件列表是公开的,这意味着你可以在 <a href="https://lists.apache.org/list.html?commits@echarts.apache.org">https://lists.apache.org/list.html?commits@echarts.apache.org</a> 和 <a href="https://lists.apache.org/list.html?dev@echarts.apache.org">https://lists.apache.org/list.html?dev@echarts.apache.org</a> 访问到邮件内容,而无需订阅。</p><h2>如何订阅</h2><p>给 <a href="mailto:commits-subscribe@echarts.incubator.apache.org">commits-subscribe@echarts.incubator.apache.org</a> 或 <a href="mailto:dev-subscribe@echarts.incubator.apache.org">dev-subscribe@echarts.incubator.apache.org</a> 发邮件来分别订阅 commits@echarts.incubator.apache.org and dev@echarts.incubator.apache.org。</p><p>你会收到一封回信,请照着邮件内容操作。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-contribute').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/option-gl.html b/zh/option-gl.html
index 7681cc0..9c6107f 100644
--- a/zh/option-gl.html
+++ b/zh/option-gl.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1598903776431"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1603774175523"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-gl-parts',
     docType: 'option-gl',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/zh/option.html b/zh/option.html
index a885fb7..87db658 100644
--- a/zh/option.html
+++ b/zh/option.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1598903776431"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1603774175523"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/option-parts',
     docType: 'option',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 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/zh/option3.html b/zh/option3.html
index 5aa3478..310b5af 100644
--- a/zh/option3.html
+++ b/zh/option3.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -6,8 +6,8 @@
         + '@font-face {font-family:"noto-light";src:local("Microsoft Yahei");}';
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
-</script><title>ECharts Documentation</title><link rel="stylesheet" type="text/css" href="css/ecOption.css?_v_=1598903776431"><link rel="stylesheet" type="text/css" href="vendors/prettify/prettify.css"><link rel="stylesheet" type="text/css" href="vendors/perfect-scrollbar/0.6.8/css/perfect-scrollbar.min.css"><link rel="stylesheet" type="text/css" href="vendors/jquery-autocomplete/jquery.auto-complete.css"><link rel="stylesheet" type="text/css" href="vendors/twentytwenty/twentytwenty.css"><script src="vendors/prettify/prettify.js"></script><script src="vendors/prettify/lang-css.js"></script><script src="vendors/esl.js"></script><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="doc-version-change"><a href="option.html">前往 v4.x 文档</a><a href="https://www.echartsjs.com/echarts2/">前往 v2.x 文档</a></div><div class="ecdoc-apidoc"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="vendors/twentytwenty/jquery.event.move.js"></script><script src="vendors/twentytwenty/jquery.twentytwenty.js"></script><script type="text/javascript">window.globalArgsExtra = {
+</script><title>ECharts Documentation</title><link rel="stylesheet" type="text/css" href="css/ecOption.css?_v_=1603774175523"><link rel="stylesheet" type="text/css" href="vendors/prettify/prettify.css"><link rel="stylesheet" type="text/css" href="vendors/perfect-scrollbar/0.6.8/css/perfect-scrollbar.min.css"><link rel="stylesheet" type="text/css" href="vendors/jquery-autocomplete/jquery.auto-complete.css"><link rel="stylesheet" type="text/css" href="vendors/twentytwenty/twentytwenty.css"><script src="vendors/prettify/prettify.js"></script><script src="vendors/prettify/lang-css.js"></script><script src="vendors/esl.js"></script><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="doc-version-change"><a href="option.html">前往 v4.x 文档</a><a href="https://www.echartsjs.com/echarts2/">前往 v2.x 文档</a></div><div class="ecdoc-apidoc"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="vendors/twentytwenty/jquery.event.move.js"></script><script src="vendors/twentytwenty/jquery.twentytwenty.js"></script><script type="text/javascript">window.globalArgsExtra = {
     pageName: 'option',
     schemaName: 'option3',
     initHash: 'title',
@@ -17,7 +17,7 @@
 var vendorPath = '../vendors';
 
 define('globalArgs', extend({
-    version: '1598903776431',
+    version: '1603774175523',
     basePath: './',
     // Schema url is added by each doc page
     schemaUrl: '',
@@ -44,7 +44,7 @@
         hasher: vendorPath + '/hasher/1.2.0/hasher.min',
         perfectScrollbar: vendorPath + '/perfect-scrollbar/0.6.8/js/perfect-scrollbar'
     },
-    urlArgs: '_v_=1598903776431'
+    urlArgs: '_v_=1603774175523'
 });
 
 require(['docTool/main'], function (main) {
diff --git a/zh/resources.html b/zh/resources.html
index f41d23e..4f797b2 100644
--- a/zh/resources.html
+++ b/zh/resources.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>更多资源 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/zh/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
-<!--[if (gt IE 8)|!(IE)]><body class="更多资源"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>更多资源</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="page-nav"></div><div class="container"><p>除了本站官方提供的资源外,社区也提供了非常丰富的资源,比如各种语言的支持,比如在线创建 ECharts 图表的平台 <a target="_blank" href="https://gallery.echartsjs.com">Gallery</a> 等等。</p><p><a target="_blank" href="https://github.com/ecomfe/awesome-echarts">github.com/ecomfe/awesome-echarts</a> 项目提供了完整的资源列表,欢迎了解及补充。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="更多资源"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>更多资源</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div class="page-content"><div class="page-nav"></div><div class="container"><p>除了本站官方提供的资源外,社区也提供了非常丰富的资源,比如各种语言的支持,比如在线创建 ECharts 图表的平台 <a target="_blank" href="https://gallery.echartsjs.com">Gallery</a> 等等。</p><p><a target="_blank" href="https://github.com/ecomfe/awesome-echarts">github.com/ecomfe/awesome-echarts</a> 项目提供了完整的资源列表,欢迎了解及补充。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/security.html b/zh/security.html
index 62f4d00..652fa72 100644
--- a/zh/security.html
+++ b/zh/security.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -7,7 +7,7 @@
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
 </script><title>安全 - Apache ECharts (incubating)</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-www.cdn.bcebos.com/zh/images/forie.png?_v_=20200710_1" alt="ie tip"></div></body><![endif]-->
-<!--[if (gt IE 8)|!(IE)]><body class="安全"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>安全</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="maillist" class="page-content"><div class="page-nav"></div><div class="container"><p>Apache ECharts (incubating)<sup>TM</sup> 在消除其软件项目中的安全问题方面采取了严格的立场。也十分关注与其特性和功能相关的安全问题。</p><p>如果您对 ECharts 的安全性感到担忧,或者您发现了漏洞或潜在的威胁,请不要犹豫与 <a href="http://www.apache.org/security/" target="_blank">Apache 安全团队</a>联系,发送邮件至 <a href="mailto:security@apache.org">security@apache.org</a>。在邮件中请指明项目名称 ECharts 并提供相关问题或潜在威胁的描述。同时推荐重现和复制安全问题的方法。在评估和分析调查结果后,Apache 安全团队和 ECharts 社区将直接与您回复。</p><p>请注意在提交安全邮件之前,请勿在公共领域披露安全电子邮件报告的安全问题。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-others').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+<!--[if (gt IE 8)|!(IE)]><body class="安全"></body><![endif]--><div id="apache-banner"><div class="txt"><p>Apache ECharts 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 role="navigation" class="navbar navbar-default navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div class="page-info"><div class="container"><h1>安全</h1><p class="page-info-echarts">Apache ECharts (incubating)<sup>TM</sup></p></div></div><div id="maillist" class="page-content"><div class="page-nav"></div><div class="container"><p>Apache ECharts (incubating)<sup>TM</sup> 在消除其软件项目中的安全问题方面采取了严格的立场。也十分关注与其特性和功能相关的安全问题。</p><p>如果您对 ECharts 的安全性感到担忧,或者您发现了漏洞或潜在的威胁,请不要犹豫与 <a href="http://www.apache.org/security/" target="_blank">Apache 安全团队</a>联系,发送邮件至 <a href="mailto:security@apache.org">security@apache.org</a>。在邮件中请指明项目名称 ECharts 并提供相关问题或潜在威胁的描述。同时推荐重现和复制安全问题的方法。在评估和分析调查结果后,Apache 安全团队和 ECharts 社区将直接与您回复。</p><p>请注意在提交安全邮件之前,请勿在公共领域披露安全电子邮件报告的安全问题。</p></div></div><footer><div class="container"><div class="row"><div class="col-md-9"><p>Apache ECharts is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the Apache Incubator. Incubation is required of all newly accepted projects until a further review indicates that the infrastructure, communications, and decision making process have stabilized in a manner consistent with other successful ASF projects. While incubation status is not necessarily a reflection of the completeness or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p><p>Copyright © 2017-2020, The Apache Software Foundation Apache ECharts, ECharts, Apache, the Apache feather, and the Apache ECharts project logo are either registered trademarks or trademarks of the Apache Software Foundation.</p></div><div id="footer-icon-panel" class="col-md-3"><a href="https://www.apache.org"><img src="https://echarts-www.cdn.bcebos.com/zh/images/asf_logo.svg?_v_=20200710_1" class="footer-apache-logo"></a><div class="icon-panel"><a href="mailto:dev@echarts.apache.org?body=%28Thanks%20for%20using%20ECharts.%20Email%20us%20if%20you%20have%20non-technical%20problems%20using%20ECharts.%20For%20technical%20support%2C%20please%20go%20to%20https%3A//github.com/apache/incubator-echarts/issues%20.%29" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-email.png?_v_=20200710_1"></a><a href="https://twitter.com/EChartsJs" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-twitter.png?_v_=20200710_1"></a><a href="https://weibo.com/u/5160877841" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-weibo.png?_v_=20200710_1"></a><a href="https://github.com/apache/incubator-echarts" class="footer-icon"><img src="https://echarts-www.cdn.bcebos.com/zh/images/icon-github.png?_v_=20200710_1"></a></div></div></div></div></footer></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-others').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/spreadsheet.html b/zh/spreadsheet.html
index 19a8af3..fe2cfdb 100644
--- a/zh/spreadsheet.html
+++ b/zh/spreadsheet.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -6,13 +6,13 @@
         + '@font-face {font-family:"noto-light";src:local("Microsoft Yahei");}';
     document.head.insertBefore(el, document.getElementById('font-hack'));
 }
-</script><title>Spreadsheet Tool - Apache ECharts (incubating)</title><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/vendors/handsontable/0.26.1/dist/handsontable.full.min.css?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/spreadsheet.css?_v_=1598903776431"><script src="vendors/esl.js"></script><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="ecdoc-sprsht"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
+</script><title>Spreadsheet Tool - Apache ECharts (incubating)</title><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/vendors/handsontable/0.26.1/dist/handsontable.full.min.css?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/spreadsheet.css?_v_=1603774175523"><script src="vendors/esl.js"></script><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 navbar-fixed-top"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="ecdoc-sprsht"></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';
 
 var vendorPath = '../vendors';
 
 define('globalArgs', extend({
-    version: '1598903776431',
+    version: '1603774175523',
     basePath: './'
 }, window.globalArgsExtra || {}));
 
@@ -31,7 +31,7 @@
         numeral: vendorPath + '/numeral/1.4.7/numeral.min',
         immutable: vendorPath + '/immutable/3.7.4/dist/immutable'
     },
-    urlArgs: '_v_=1598903776431'
+    urlArgs: '_v_=1603774175523'
 });
 
 require(['spreadsheet/spreadsheet'], function (spreadsheet) {
diff --git a/zh/theme-builder.html b/zh/theme-builder.html
index c0baec1..86db43c 100644
--- a/zh/theme-builder.html
+++ b/zh/theme-builder.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -526,7 +526,7 @@
 <script src="//cdn.jsdelivr.net/npm/file-saver@2.0.2/dist/FileSaver.min.js"></script>
 
 <script src="./theme-builder/app.min.js"></script>
-</div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
+</div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script type="text/javascript">document.getElementById('nav-resources').className = 'active';</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");
 
diff --git a/zh/tutorial.html b/zh/tutorial.html
index 00a93b7..1112b1b 100644
--- a/zh/tutorial.html
+++ b/zh/tutorial.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1598903776431"><script>window.EC_WWW_LANG = 'zh';
+<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1" user-scalable="no"><meta name="description" content="ECharts, a powerful, interactive charting and visualization library for browser"><link rel="shortcut icon" href="https://echarts-www.cdn.bcebos.com/zh/images/favicon.png?_v_=20200710_1"><link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries--><!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]--><link rel="stylesheet" type="text/css" href="https://echarts-www.cdn.bcebos.com/zh/css/main.css?_v_=1603774175523"><script>window.EC_WWW_LANG = 'zh';
 </script><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/pace-progressbar@1.0.2/pace.min.js"></script><script id="font-hack" type="text/javascript">if (/windows/i.test(navigator.userAgent)) {
     var el = document.createElement('style');
     el.innerHTML = ''
@@ -9,8 +9,8 @@
 </script><title>Documentation - Apache ECharts(incubating)</title><style>html, body {
     /* position: sticky should not have overflow parents.*/
     overflow-x: hidden;
-}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1598903776431"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1598903776431"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1598903776431"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
+}</style><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/theme-chalk/index.css"><link rel="stylesheet" href="https://echarts-www.cdn.bcebos.com/zh/css/doc-bundle.css?_v_=1603774175523"><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-www.cdn.bcebos.com/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 是一个正在由 Apache 孵化器赞助的 Apache 开源基金会孵化的项目。</p><p>我们正在处理将本站跳转到 <a href="https://echarts.apache.org" target="_blank">https://echarts.apache.org</a> 的迁移工作。您可以现在就前往我们的 Apache 官网。</p></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 id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav"><div class="container-fluid"><div class="navbar-header"><button type="button" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" class="navbar-toggle collapsed"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a href="https://echarts.apache.org/zh/index.html" class="navbar-brand"><img src="https://echarts-www.cdn.bcebos.com/zh/images/logo.png?_v_=undefined" alt="echarts logo" class="navbar-logo"></a></div><div id="navbar-collapse" class="collapse navbar-collapse"><ul class="nav navbar-nav navbar-left"><li id="nav-index"><a href="https://echarts.apache.org/zh/index.html">首页</a></li><li id="nav-doc" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">文档<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/feature.html">特性</a></li><li><a href="https://echarts.apache.org/zh/tutorial.html">教程</a></li><li><a href="https://echarts.apache.org/zh/api.html">API</a></li><li><a href="https://echarts.apache.org/zh/option.html">配置项手册</a></li><li><a href="https://echarts.apache.org/zh/changelog.html">版本记录</a></li><li><a href="https://echarts.apache.org/zh/faq.html">常见问题</a></li></ul></li><li id="nav-download" class="dropdown"><a href="#" data-toggle="dropdown" class="dropdown-toggle">下载<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/download.html">下载</a></li><li><a href="https://echarts.apache.org/zh/download-theme.html">主题下载</a></li><li><a href="https://echarts.apache.org/zh/download-extension.html">扩展下载</a></li></ul></li><li id="nav-examples"><a href="https://echarts.apache.org/examples/zh/index.html">实例</a></li><li id="nav-resources"><a href="#" data-toggle="dropdown" class="dropdown-toggle">资源<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/spreadsheet.html">表格工具</a></li><li><a href="https://echarts.apache.org/zh/theme-builder.html">主题构建工具</a></li><li><a href="https://echarts.apache.org/zh/cheat-sheet.html">术语速查手册</a></li><li><a href="https://echarts.apache.org/zh/resources.html">更多资源</a></li></ul></li><li id="nav-contribute"><a href="#" data-toggle="dropdown" class="dropdown-toggle">社区<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://echarts.apache.org/zh/committers.html">贡献者列表</a></li><li><a href="https://echarts.apache.org/zh/maillist.html">邮件列表</a></li><li><a href="https://echarts.apache.org/zh/contributing.html">如何贡献</a></li><li><a href="https://echarts.apache.org/zh/dependencies.html">依赖项</a></li><li><a href="https://echarts.apache.org/zh/coding-standard.html">代码规范</a></li><li><a href="https://github.com/apache/incubator-echarts" target="_blank">源码(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://github.com/apache/incubator-echarts/issues" target="_blank">Issues(GitHub)<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li><li id="nav-others"><a href="#" data-toggle="dropdown" class="dropdown-toggle">其他<b class="caret"></b></a><ul class="dropdown-menu"><li><a href="https://www.apache.org/" target="_blank">Apache Software Foundation<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://echarts.apache.org/zh/security.html">安全</a></li><li><a href="https://www.apache.org/licenses/" target="_blank">版权<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/sponsorship.html" target="_blank">捐赠<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li><li><a href="https://www.apache.org/foundation/thanks.html" target="_blank">鸣谢<svg width="15px" height="15px" viewbox="0 0 100 100" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="icon-external-link"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul></li></ul><ul class="nav navbar-nav navbar-right"><li id="nav-homeen"><a href="javascript:;" onclick="changeLang('en')">EN</a></li><li id="nav-apache"><a href="https://www.apache.org/" target="_blank"><img src="https://echarts-www.cdn.bcebos.com/zh/images/apache-incubator-white.png?_v_=undefined" width="18"></a></li></ul></div></div></nav><div class="page-main"><div id="ec-doc-main"></div></div></div><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script><script type="text/javascript" src="https://echarts-www.cdn.bcebos.com/zh/js/common.js?_v_=1603774175523"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/element-ui@2.13.2/lib/index.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/lib/codemirror.min.js"></script><script src="https://cdn.jsdelivr.net/npm/codemirror@5.56.0/mode/javascript/javascript.js"></script><script src="https://cdn.jsdelivr.net/npm/js-beautify@1.11.0/js/lib/beautifier.min.js"></script><script src="https://echarts-www.cdn.bcebos.com/zh/js/doc-bundle.js?_v_=1603774175523"></script><script type="text/javascript">window.EC_WWW_CDN_PAY_ROOT = 'https://echarts-www.cdn.bcebos.com';
 </script><script type="text/javascript">window.globalArgsExtra = {
     baseUrl: 'documents/tutorial-parts',
     docType: 'tutorial',
@@ -19,7 +19,7 @@
 if (window.EC_WWW_CDN_PAY_ROOT) {
     window.globalArgsExtra.cdnRoot = window.EC_WWW_CDN_PAY_ROOT + '/zh/' + window.globalArgsExtra.baseUrl
 }</script><script type="text/javascript">document.getElementById('nav-doc').className = 'active';
-window.globalArgsExtra.version = '1598903776431';
+window.globalArgsExtra.version = '1603774175523';
 echartsDoc.init('#ec-doc-main', window.globalArgsExtra);</script><!-- Baidu Tongji--><script type="text/javascript">var _hmt = _hmt || [];
 (function() {
 var hm = document.createElement("script");