You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2019/10/31 07:53:21 UTC
[incubator-echarts-doc] branch master updated: update outdated info.
This is an automated email from the ASF dual-hosted git repository.
shenyi pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-echarts-doc.git
The following commit(s) were added to refs/heads/master by this push:
new 3021614 update outdated info.
3021614 is described below
commit 302161431972ee0c9bec1a343ceba9513152f1ec
Author: pissang <bm...@gmail.com>
AuthorDate: Thu Oct 31 15:53:09 2019 +0800
update outdated info.
---
en/tutorial/custom-build.md | 11 +++++-----
en/tutorial/custom-series.md | 38 ++++++++++++++++-----------------
en/tutorial/drag-example.md | 16 +++++++-------
en/tutorial/getting-started.md | 10 ++++-----
en/tutorial/headless.md | 10 ++++-----
en/tutorial/npm-webpack.md | 4 +---
en/tutorial/renderer.md | 10 ++++-----
en/tutorial/style-overview.md | 2 +-
watch.js | 2 +-
zh/tutorial/custom-build.md | 10 ++++-----
zh/tutorial/custom-series.md | 44 +++++++++++++++++++--------------------
zh/tutorial/drag-example.md | 18 ++++++++--------
zh/tutorial/getting-started.md | 10 ++++-----
zh/tutorial/headless.md | 10 ++++-----
zh/tutorial/npm-webpack.md | 8 +++----
zh/tutorial/renderer.md | 14 ++++++-------
zh/tutorial/sunburst-series.md | 2 +-
zh/tutorial/weixin-application.md | 4 ++--
18 files changed, 109 insertions(+), 114 deletions(-)
diff --git a/en/tutorial/custom-build.md b/en/tutorial/custom-build.md
index fac4824..4cd07f1 100644
--- a/en/tutorial/custom-build.md
+++ b/en/tutorial/custom-build.md
@@ -3,8 +3,7 @@
# Create Custom Build of ECharts
-
-In most cases, ECharts builds can be downloaded from the [download page](${wesitePath}/en/download.html) or from the `echarts/dist` directory in our [GitHub project](https://github.com/ecomfe/echarts/releases), where
+In most cases, ECharts builds can be get from [CDN](https://www.jsdelivr.com/package/npm/echarts) or from the `echarts/dist` directory in our [GitHub project](https://github.com/apache/incubator-echarts/releases), where
these pre-builds are provided:
+ Complete verion: `echarts/dist/echarts.js`, including all charts and components (see `echarts/echarts.all.js` for detail), but has maximum file size.
@@ -13,9 +12,9 @@ these pre-builds are provided:
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:
-+ [Online custom build tool](${wesitePath}/en/builder.html) is relatively convenient.
++ [Online custom build tool](${websitePath}builder.html) is relatively convenient.
+ The script `echarts/build/build.js` found in the project is flexible for module selecting, and supports multi-language builds
-+ Build ECharts and your project directly by using tools such as [rollup](https://rollupjs.org/), [webpack](https://webpack.github.io/), [browserify](http://browserify.org/)
++ Build ECharts and your project directly by using tools such as [rollup](https://rollupjs.org/), [webpack](https://webpack.js.org//), [browserify](http://browserify.org/)
There are some examples to illustrate the latter two approaches below.
@@ -125,7 +124,7 @@ Open `myProject/pie.html` in a browser, we can see the pie chart:
## Modules that are permitted to be imported
-All of the permitted modules are declared in [`myProject/node_module/echarts/echarts.all.js`](https://github.com/ecomfe/echarts/blob/master/echarts.all.js) and [`myProject/node_module/echarts/src/export.js`](https://github.com/ecomfe/echarts/blob/master/src/export.js). Other modules in the source code of echarts and zrender **SHOULD NOT BE IMPORTED**, because they are inner modules, whose interfaces and functionalities may be modified in the subsequent upgrades of echarts.
+All of the permitted modules are declared in [`myProject/node_module/echarts/echarts.all.js`](https://github.com/apache/incubator-echarts/blob/master/echarts.all.js) and [`myProject/node_module/echarts/src/export.js`](https://github.com/apache/incubator-echarts/blob/master/src/export.js). Other modules in the source code of echarts and zrender **SHOULD NOT BE IMPORTED**, because they are inner modules, whose interfaces and functionalities may be modified in the subsequent upgrades of echarts.
## Use `echarts/lib/**` or `echarts/src/**`?
@@ -139,7 +138,7 @@ All of the permitted modules are declared in [`myProject/node_module/echarts/ech
## Build echarts and our project directly by rollup
-Now we have known that how to create custom build by `echarts/build/build.js`. Alternatively, we can bundle echarts and our project directly by the tool like [rollup](https://rollupjs.org/), [webpack](https://webpack.github.io/) or [browserify](http://browserify.org/). In some project, this approach is required. Next we only go with [rollup](https://rollupjs.org/), because [webpack](https://webpack.github.io/) and [browserify](http://browserify.org/) are in the similar way.
+Now we have known that how to create custom build by `echarts/build/build.js`. Alternatively, we can bundle echarts and our project directly by the tool like [rollup](https://rollupjs.org/), [webpack](https://webpack.js.org//) or [browserify](http://browserify.org/). In some project, this approach is required. Next we only go with [rollup](https://rollupjs.org/), because [webpack](https://webpack.js.org//) and [browserify](http://browserify.org/) are in the similar way.
Firstly install [rollup](https://rollupjs.org/) in `myProject` directory:
diff --git a/en/tutorial/custom-series.md b/en/tutorial/custom-series.md
index 78166ad..9185319 100644
--- a/en/tutorial/custom-series.md
+++ b/en/tutorial/custom-series.md
@@ -2,9 +2,9 @@
# Custom Series
-[custom series](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom) is a type of series, which enable develpers to customize graphic elements rendering and generate new types of chart.
+[custom series](option.html#series-custom) is a type of series, which enable develpers to customize graphic elements rendering and generate new types of chart.
-Why echarts supports `custom series`? 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, transit [...]
+Why echarts supports `custom series`? 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, transit [...]
**For example, a "x-range" chart is made by custom sereis:**
~[800x500](${galleryViewPath}custom-profile&reset=1&edit=1)
@@ -32,7 +32,7 @@ var option = {
}
```
-In the rendering phase of echarts workflow, [renderItem](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem) is called respectively for each `dataItem` in [series.data](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.data). `renderItem` 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 [...]
+In the rendering phase of echarts workflow, [renderItem](option.html#series-custom.renderItem) is called respectively for each `dataItem` in [series.data](option.html#series-custom.data). `renderItem` 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:
```js
var option = {
@@ -99,19 +99,19 @@ var option = {
```
-[renderItem](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem) provides two parameters:
-+ [params](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.params)：provides info about the current series (such as `seriesIndex`、`dataIndex`, etc.) and data (such as `dataIndex`, `dataIndexInside`, etc.) and coordinate system (such as location and size of bounding box of the current coordinate system)
-+ [api](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.api) provides some methods to developers (such as `api.value()`, `api.coord()`).
+[renderItem](option.html#series-custom.renderItem) provides two parameters:
++ [params](option.html#series-custom.renderItem.arguments.params)：provides info about the current series (such as `seriesIndex`、`dataIndex`, etc.) and data (such as `dataIndex`, `dataIndexInside`, etc.) and coordinate system (such as location and size of bounding box of the current coordinate system)
++ [api](option.html#series-custom.renderItem.arguments.api) provides some methods to developers (such as `api.value()`, `api.coord()`).
-[renderItem](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem) method should return definitions of graphic elements for the current `dataItem`. See [renderItem.return](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.return).
+[renderItem](option.html#series-custom.renderItem) method should return definitions of graphic elements for the current `dataItem`. See [renderItem.return](option.html#series-custom.renderItem.return).
-Generally, the main process of [renderItem](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem) is that retrieve value from data and convert them to graphic elements on the current coordinate system. Two methods in [renderItem.arguments.api](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.api) are always used in this procedure:
-+ [api.value(...)](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.api.value) is used to retrieve value from data. For example, `api.value(0)` retrieve the value of the first dimension in the current data item.
-+ [api.coord(...)](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.api.coord) is used to convert data to coordinate. For example, `var point = api.coord([api.value(0), api.value(1)])` converet the data to the point on the current coordinate system.
+Generally, the main process of [renderItem](option.html#series-custom.renderItem) is that retrieve value from data and convert them to graphic elements on the current coordinate system. Two methods in [renderItem.arguments.api](option.html#series-custom.renderItem.arguments.api) are always used in this procedure:
++ [api.value(...)](option.html#series-custom.renderItem.arguments.api.value) is used to retrieve value from data. For example, `api.value(0)` retrieve the value of the first dimension in the current data item.
++ [api.coord(...)](option.html#series-custom.renderItem.arguments.api.coord) is used to convert data to coordinate. For example, `var point = api.coord([api.value(0), api.value(1)])` converet the data to the point on the current coordinate system.
-Sometimes [api.size(...)](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.api.size) method is needed, which calculates the size on the coordinate system by a given data range.
+Sometimes [api.size(...)](option.html#series-custom.renderItem.arguments.api.size) method is needed, which calculates the size on the coordinate system by a given data range.
-Moreover, [api.style(...)](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.api.style) method can be used to set style. It provides not only the style settings specified in [series.itemStyle](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.itemStyle), but also the result of visual mapping. This method can also be called like `api.style({fill: 'green', stroke: 'yellow'})` to override those style settings.
+Moreover, [api.style(...)](option.html#series-custom.renderItem.arguments.api.style) method can be used to set style. It provides not only the style settings specified in [series.itemStyle](option.html#series-custom.itemStyle), but also the result of visual mapping. This method can also be called like `api.style({fill: 'green', stroke: 'yellow'})` to override those style settings.
Having `renderItem` provided, 90% of the work of creating custom series has been accomplished. The rest of this work is to refine and polish them.
@@ -120,7 +120,7 @@ Having `renderItem` provided, 90% of the work of creating custom series has been
<br>
<h2>(II) Make the extent of axes fit the data</h2>
-There is axes in some coordinate systems, such as [cartesian2d (grid)](https://ecomfe.github.io/echarts-doc/public/en/option.html#grid)and [polar](https://ecomfe.github.io/echarts-doc/public/en/option.html#polar). 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 [cartesian2d (grid)](https://ecomfe.github.io/echarts-doc/public/en/option.html#grid), developers should spec [...]
+There is axes in some coordinate systems, such as [cartesian2d (grid)](option.html#grid)and [polar](option.html#polar). 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 [cartesian2d (grid)](option.html#grid), developers should specify that which dimensions correspond to `x` axis and which to `y` axis use the property [encode](option.html#series-custom.encode):
```js
option = {
@@ -151,7 +151,7 @@ option = {
<br>
<h2>(III) Set tooltip content</h2>
-Of course [tooltip.formatter](https://ecomfe.github.io/echarts-doc/public/en/option.html#tooltip.formatter) can be used to define the content in tooltip. But it is easier to do that by setting [encode](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.encode) and [dimensions](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.dimensions):
+Of course [tooltip.formatter](option.html#tooltip.formatter) can be used to define the content in tooltip. But it is easier to do that by setting [encode](option.html#series-custom.encode) and [dimensions](option.html#series-custom.dimensions):
```js
option = {
@@ -192,7 +192,7 @@ Several other issues about `custom series` are introduced below.
<br>
<h2>(IV) Shape clipping when overflow the coordinates area</h2>
-When use `custom series` with [dataZoom](https://ecomfe.github.io/echarts-doc/public/en/option.html#dataZoom), [dataZoom.filterMode](https://ecomfe.github.io/echarts-doc/public/en/option.html#dataZoom.filterMode) usually be set as `'weakFilter'`, which prevent `dataItem` from being filtered when only part of its dimensions are out of the current data window. For example:
+When use `custom series` with [dataZoom](option.html#dataZoom), [dataZoom.filterMode](option.html#dataZoom.filterMode) usually be set as `'weakFilter'`, which prevent `dataItem` from being filtered when only part of its dimensions are out of the current data window. For example:
```js
@@ -231,13 +231,13 @@ See the example mentioned above [Profile](${galleryEditorPath}custom-profile).
<h2>(V) About dataIndex</h2>
-Developers had better notice that in [renderItem.arguments.params](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.params) `dataIndexInside` and `dataIndex` is different:
+Developers had better notice that in [renderItem.arguments.params](option.html#series-custom.renderItem.arguments.params) `dataIndexInside` and `dataIndex` is different:
+ `dataIndex` is the index of a `dataItem` in the original data.
-+ `dataIndexInside` is the index of a `dataItem` in the current data window (see [dataZoom](https://ecomfe.github.io/echarts-doc/public/en/option.html#dataZoom).
++ `dataIndexInside` is the index of a `dataItem` in the current data window (see [dataZoom](option.html#dataZoom).
-[renderItem.arguments.api](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.arguments.api) uses `dataIndexInside` as the input parameter but not `dataIndex`, because conversion from `dataIndex` to `dataIndexInside` is time-consuming.
+[renderItem.arguments.api](option.html#series-custom.renderItem.arguments.api) uses `dataIndexInside` as the input parameter but not `dataIndex`, because conversion from `dataIndex` to `dataIndexInside` is time-consuming.
<br>
@@ -280,7 +280,7 @@ chart.on('click', {element: 'aaa'}, function (params) {
<h2>(VII) Custom vector shapes</h2>
-[SVG PathData](http://www.w3.org/TR/SVG/paths.html#PathData) is supported, which enables to use shapes that are created in vector tool. See [path](https://ecomfe.github.io/echarts-doc/public/en/option.html#series-custom.renderItem.return_path), and examples: [icons](https://ecomfe.github.io/echarts-examples/public/index.html?c=custom-calendar-icon), [shapes](https://ecomfe.github.io/echarts-examples/public/index.html?c=custom-gantt-flight).
+[SVG PathData](http://www.w3.org/TR/SVG/paths.html#PathData) is supported, which enables to use shapes that are created in vector tool. See [path](option.html#series-custom.renderItem.return_path), and examples: [icons](https://ecomfe.github.io/echarts-examples/public/index.html?c=custom-calendar-icon), [shapes](https://ecomfe.github.io/echarts-examples/public/index.html?c=custom-gantt-flight).
diff --git a/en/tutorial/drag-example.md b/en/tutorial/drag-example.md
index ef73afa..3be7716 100644
--- a/en/tutorial/drag-example.md
+++ b/en/tutorial/drag-example.md
@@ -13,7 +13,7 @@ This example mainly implements that dragging points of a curve and by which the
<br>
<h2>[ Part 1 ] Implement basic dragging</h2>
-First of all, we create a basic [line chart (line series)](http://echarts.baidu.com/option.html#series-line):
+First of all, we create a basic [line chart (line series)](option.html#series-line):
```js
var symbolSize = 20;
@@ -45,7 +45,7 @@ myChart.setOption({
});
```
-Since the symbols in line is not draggable, we make them draggable by using [graphic component](http://echarts.baidu.com/option.html#graphic) to add draggable circular elements to symbols respectively.
+Since the symbols in line is not draggable, we make them draggable by using [graphic component](option.html#graphic) to add draggable circular elements to symbols respectively.
```js
myChart.setOption({
@@ -86,7 +86,7 @@ myChart.setOption({
});
```
-In the code above, API [convertToPixel](http://echarts.baidu.com/api.html#echartsInstance.convertToPixel) is used to convert data to its "pixel coodinate", based on which each graphic elements can be rendered on canvas. The term "pixel coodinate" means the coordinate is in canvas pixel, whose origin is the top-left of the canvas. In the sentence `myChart.convertToPixel('grid', dataItem)`, the first parameter `'grid'` indicates that `dataItem` should be converted in the first [grid compon [...]
+In the code above, API [convertToPixel](api.html#echartsInstance.convertToPixel) is used to convert data to its "pixel coodinate", based on which each graphic elements can be rendered on canvas. The term "pixel coodinate" means the coordinate is in canvas pixel, whose origin is the top-left of the canvas. In the sentence `myChart.convertToPixel('grid', dataItem)`, the first parameter `'grid'` indicates that `dataItem` should be converted in the first [grid component (cartesian)](option.h [...]
**Notice:** `convertToPixel` should not be called before the first time that `setOption` called. Namely, it can only be used after coordinate systems (grid/polar/...) initialized.
@@ -113,7 +113,7 @@ function onPointDragging(dataIndex) {
}
```
-In the code above, API [convertFromPixel](http://echarts.baidu.com/api.html#echartsInstance.convertFromPixel) is used, which is the reversed process of [convertToPixel](http://echarts.baidu.com/api.html#echartsInstance.convertToPixel). `myChart.convertFromPixel('grid', this.position)` converts a pixel coordinate to data item in [grid (cartesian)](http://echarts.baidu.com/option.html#grid).
+In the code above, API [convertFromPixel](api.html#echartsInstance.convertFromPixel) is used, which is the reversed process of [convertToPixel](api.html#echartsInstance.convertToPixel). `myChart.convertFromPixel('grid', this.position)` converts a pixel coordinate to data item in [grid (cartesian)](option.html#grid).
Finally, add those code to make graphic elements responsive to change of canvas size.
@@ -138,7 +138,7 @@ window.addEventListener('resize', function () {
<br>
<h2>[ Part 2 ] Add tooltip component</h2>
-Now basic functionality have been implemented by parte 1. If we need the data can be displayed realtime when dragging, we can use [tooltip component](http://echarts.baidu.com/option.html#tooltip) to do that. Nevertheless, tooltip component has its default "show/hide rule", which is not applicable in this case. So we need to customize the "show/hide rule" for our case.
+Now basic functionality have been implemented by parte 1. If we need the data can be displayed realtime when dragging, we can use [tooltip component](option.html#tooltip) to do that. Nevertheless, tooltip component has its default "show/hide rule", which is not applicable in this case. So we need to customize the "show/hide rule" for our case.
Add these snippets to the code block above:
@@ -183,7 +183,7 @@ function hideTooltip(dataIndex) {
}
```
-The API [dispatchAction](http://echarts.baidu.com/api.html#echartsInstance.dispatchAction) is used to show/hide tooltip content, where actions [showTip](http://echarts.baidu.com/api.html#action.tooltip.showTip) and [hideTip](http://echarts.baidu.com/api.html#action.tooltip.hideTip) is dispatched.
+The API [dispatchAction](api.html#echartsInstance.dispatchAction) is used to show/hide tooltip content, where actions [showTip](api.html#action.tooltip.showTip) and [hideTip](api.html#action.tooltip.hideTip) is dispatched.
@@ -197,7 +197,7 @@ Full code is shown as follow:
<html>
<head>
<meta charset="utf-8">
- <script src="http://echarts.baidu.com/dist/echarts.min.js"></script>
+ <script src="dist/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width: 600px;height:400px;"></div>
@@ -298,7 +298,7 @@ Full code is shown as follow:
<br>
-With knowledge introduced above, more feature can be implemented. For example, [dataZoom component](http://echarts.baidu.com/option.html#dataZoom) can be added to cooperate with the cartesian, or we can make a plotting board on coordinate systems. Use your imagination ~
+With knowledge introduced above, more feature can be implemented. For example, [dataZoom component](option.html#dataZoom) can be added to cooperate with the cartesian, or we can make a plotting board on coordinate systems. Use your imagination ~
diff --git a/en/tutorial/getting-started.md b/en/tutorial/getting-started.md
index b204bd6..b62ac19 100644
--- a/en/tutorial/getting-started.md
+++ b/en/tutorial/getting-started.md
@@ -5,17 +5,17 @@
First, install ECharts using one of the following methods:
-* The [official download page](https://ecomfe.github.io/echarts-doc/public/en/download.html), has different builds for most common use cases. If you would like to include all packages, you can download [the full minified version](http://echarts.baidu.com/dist/echarts.min.js).
+* Download official source release from [Apache ECharts (incubating) website](${websitePath}download.html). Then [build](https://github.com/apache/incubator-echarts#build) from the source release.
-* From the latest [GitHub](https://github.com/ecomfe/echarts) release, you can find the latest version of echarts in `dist` directory of the unzipped files.
+* Download from [GitHub](https://github.com/apache/incubator-echarts/releases)
-* Using npm: `npm install echarts --save`. [Using ECharts with webpack](https://ecomfe.github.io/echarts-doc/public/en/tutorial.html#Use%20ECharts%20with%20webpack)
+* Using npm: `npm install echarts --save`. [Using ECharts with webpack](${websitePath}tutorial.html#Use%20ECharts%20with%20webpack)
-* Using the [online build tool](http://echarts.baidu.com/builder.html) (Currently available in Chinese only).
+* Use CDN like [jsDelivr](https://www.jsdelivr.com/package/npm/echarts).
## Including ECharts
-ECharts 3 no longer requires using AMD to load packages, and the AMD loader is no longer included in ECharts. Instead, ECharts should be included using a traditional `<script>` tag:
+Load `echarts.min.js` with a script tag.
```html
<!DOCTYPE html>
diff --git a/en/tutorial/headless.md b/en/tutorial/headless.md
index d664bb3..54a72f4 100644
--- a/en/tutorial/headless.md
+++ b/en/tutorial/headless.md
@@ -3,13 +3,13 @@
# Server-side Rendering
-ECharts can be rendered at server-side. For example, the thumbnails in the [official examples page](http://www.echartsjs.com/examples/) are generated at a server.
+ECharts can be rendered at server-side. For example, the thumbnails in the [official examples page](https://echarts.apache.org/examples/en/index.html/) are generated at a server.
Commonly used headless tool is required, for example, [puppeteer](https://github.com/GoogleChrome/puppeteer), [headless chrome](https://chromium.googlesource.com/chromium/src/+/lkgr/headless/README.md), [node-canvas](https://github.com/Automattic/node-canvas), [jsdom](https://github.com/jsdom/jsdom), [PhantomJS](http://phantomjs.org/), etc.
Some solutions contributed by the community are list as follows:
-+ <https://github.com/hellosean1025/node-echarts>
-+ <https://github.com/chfw/echarts-scrappeteer>
-+ <https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js>
-
++ https://github.com/hellosean1025/node-echarts
++ https://github.com/chfw/echarts-scrappeteer
++ https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js
++ https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73
diff --git a/en/tutorial/npm-webpack.md b/en/tutorial/npm-webpack.md
index 314689c..852c058 100644
--- a/en/tutorial/npm-webpack.md
+++ b/en/tutorial/npm-webpack.md
@@ -3,12 +3,10 @@
# Use ECharts with webpack
-[Webpack](https://webpack.github.io/) is a popular module packaging tool, which can be used easily to import and packaging ECharts. Here we assume you already have certain understanding about webpack and used it in your project.
+[Webpack](https://webpack.js.org//) is a popular module packaging tool, which can be used easily to import and packaging ECharts. Here we assume you already have certain understanding about webpack and used it in your project.
## Use npm to install ECharts
-Before `3.1.1` version, ECharts package on npm was maintained by third-party. Since `3.1.1`, ECharts and zrender on npm are maintained officially by [EFE](https://github.com/ecomfe/) team.
-
You can use the following command to install ECharts with npm.
```shell
diff --git a/en/tutorial/renderer.md b/en/tutorial/renderer.md
index 6d8572b..c6dd4da 100644
--- a/en/tutorial/renderer.md
+++ b/en/tutorial/renderer.md
@@ -4,13 +4,13 @@
Most of browser-side charting libraries use SVG or Canvas as their underlying renderer. In the scope of charts, they are usually alternative, without critical differences. But in some environment and scenarios, they show notable differences in performance or functionality.
-ECharts has been using Canvas as its renderer (use VML for IE8-) from the begining. Now, from [ECharts v3.8](https://github.com/ecomfe/echarts/releases) we provide a SVG renderer (beta version) as another option. Either of them can be used by specifing parameter [renderer](https://ecomfe.github.io/echarts-doc/public/en/api.html#echarts.init) as `'canvas'` or `'svg'` when initailizing a chart instance.
+ECharts has been using Canvas as its renderer (use VML for IE8-) from the begining. Now, from [ECharts v3.8](https://github.com/apache/incubator-echarts/releases) we provide a SVG renderer (beta version) as another option. Either of them can be used by specifing parameter [renderer](api.html#echarts.init) as `'canvas'` or `'svg'` when initailizing a chart instance.
> 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 [zender](https://github.com/ecomfe/zrender), where they are implemented as a Canvas renderer and a alternative SVG renderer.
## How to make a choice?
-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 [special visual effect](https://ecomfe.github.io/echarts-examples/public/editor.html?c=lines-bmap-effect). But in some other scenarios SVG has some critical advantages: it consumes less memory then Canvas (especially in mobile dev [...]
+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 [special visual effect](examples/editor.html?c=lines-bmap-effect). 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 re [...]
~[90%x400](${galleryViewPath}doc-example/canvas-vs-svg-en&reset=1)
@@ -23,7 +23,7 @@ How to make a choice? These factors, hardware and software environment, data amo
+ 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 [liquidfill](https://ecomfe.github.io/echarts-liquidfill/example/), the SVG renderer probably gives a better performance.
+ If visualizing a large amount of data, or complicated human interactions with data is required, the Canvas renderer works better currently.
-Therefore [feedback](https://github.com/ecomfe/echarts/issues/new) of experiences and usage scenarios are strongly welcomed, which will make the these renderers better and better.
+Therefore [feedback](https://github.com/apache/incubator-echarts/issues/new) of experiences and usage scenarios are strongly welcomed, which will make the these renderers better and better.
Notice: The features of rich text, shadow and texture have not been supported yet in the current beta version of the SVG renderer.
@@ -33,7 +33,7 @@ Notice: The features of rich text, shadow and texture have not been supported ye
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.
-+ In the [pre-build](https://ecomfe.github.io/echarts-doc/public/en/download.html) of ECharts, the SVG renderer has been included in [common version](https://raw.githubusercontent.com/ecomfe/echarts/3.7.2/dist/echarts.common.min.js) and [complete version](https://raw.githubusercontent.com/ecomfe/echarts/3.7.2/dist/echarts.min.js). But not in [simple version](https://raw.githubusercontent.com/ecomfe/echarts/3.7.2/dist/echarts.simple.min.js).
++ In the [pre-build](https://www.jsdelivr.com/package/npm/echarts) of ECharts, the SVG renderer has been included in [common version](https://cdn.jsdelivr.net/npm/echarts/dist/echarts.common.min.js) and [complete version](https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js). But not in [simple version](https://cdn.jsdelivr.net/npm/echarts/dist/echarts.simple.min.js).
+ If [build ECharts online](http://echarts.baidu.com/builder.html), the checkbox "SVG 渲染" should be checked.
+ If [build ECharts offline](http://echarts.baidu.com/tutorial.html#Create%20Custom%20Build%20of%20ECharts), the module of the SVG renderer should be imported:
@@ -41,7 +41,7 @@ ECharts uses Canvas by default. If user intends to use the SVG renderer, the mod
import 'zrender/lib/svg/svg';
```
-Then wen can specify renderer by [parameter](https://ecomfe.github.io/echarts-doc/public/en/api.html#echarts.init):
+Then wen can specify renderer by [parameter](api.html#echarts.init):
```js
// Use the Canvas renderer (default).
diff --git a/en/tutorial/style-overview.md b/en/tutorial/style-overview.md
index ca7027b..71d42ea 100644
--- a/en/tutorial/style-overview.md
+++ b/en/tutorial/style-overview.md
@@ -24,7 +24,7 @@ Other article about styling can be check in [Customized Chart Styles](~Customize
**Theme**
-Setting a theme is the simplest way to change the color style. For example, in [Examples page](https://ecomfe.github.io/echarts-examples/public/index.html), "Theme" can be selected, and view the result directly.
+Setting a theme is the simplest way to change the color style. For example, in [Examples page](${websitePath}/examples), "Theme" can be selected, and view the result directly.
Since ECharts4, besides the original default theme, ECharts provide another two built-in themes, named '`'light'` and `'dark'`. They can be used as follows:
diff --git a/watch.js b/watch.js
index 0f6fe7e..067110f 100644
--- a/watch.js
+++ b/watch.js
@@ -36,7 +36,7 @@ function initEnv() {
var envType = initEnv();
var docSrcDirZH = path.join(__dirname, '/zh');
-var docSrcDirEN = path.join(__dirname, '/zh');
+var docSrcDirEN = path.join(__dirname, '/en');
var watchDirs = [];
getAllDirs(docSrcDirZH, watchDirs);
diff --git a/zh/tutorial/custom-build.md b/zh/tutorial/custom-build.md
index 3fc1bed..987a641 100644
--- a/zh/tutorial/custom-build.md
+++ b/zh/tutorial/custom-build.md
@@ -2,7 +2,7 @@
# 自定义构建 ECharts
-一般来说，可以直接从 [echarts 下载页](${wesitePath}/zh/download.html) 中获取构建好的 echarts，也可以从 [GitHub](https://github.com/ecomfe/echarts/releases) 中的 `echarts/dist` 文件夹中获取构建好的 echarts，这都可以直接在浏览器端项目中使用。这些构建好的 echarts 提供了下面这几种定制：
+一般来说，可以直接从 [CDN](https://www.jsdelivr.com/package/npm/echarts) 中获取构建后的 echarts，也可以从 [GitHub](https://github.com/apache/incubator-echarts/releases) 中的 `echarts/dist` 文件夹中获取构建好的 echarts，这都可以直接在浏览器端项目中使用。这些构建好的 echarts 提供了下面这几种定制：
+ 完全版：`echarts/dist/echarts.js`，体积最大，包含所有的图表和组件，所包含内容参见：`echarts/echarts.all.js`。
+ 常用版：`echarts/dist/echarts.common.js`，体积适中，包含常见的图表和组件，所包含内容参见：`echarts/echarts.common.js`。
@@ -10,9 +10,9 @@
我们也可以自己构建 echarts，能够仅仅包括自己所需要的图表和组件。可以用这几种方式自定义构建：
-+ [在线自定义构建](${wesitePath}/zh/builder.html)：比较方便。
++ [在线自定义构建](${websitePath}builder.html)：比较方便。
+ 使用 `echarts/build/build.js` 脚本自定义构建：比在线构建更灵活一点，并且支持多语言。
-+ 直接使用构建工具（如 [rollup](https://rollupjs.org/)、[webpack](https://webpack.github.io/)、[browserify](http://browserify.org/)）自己构建：也是一种选择。
++ 直接使用构建工具（如 [rollup](https://rollupjs.org/)、[webpack](https://webpack.js.org//)、[browserify](http://browserify.org/)）自己构建：也是一种选择。
下面我们举些小例子，介绍后两种方式。
@@ -122,7 +122,7 @@ node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echar
## 允许被引用的模块
-在自定义构建中，允许被引用的模块，全声明在 [`myProject/node_module/echarts/echarts.all.js`](https://github.com/ecomfe/echarts/blob/master/echarts.all.js) 和 [`myProject/node_module/echarts/src/export.js`](https://github.com/ecomfe/echarts/blob/master/src/export.js) 中。echarts 和 zrender 源代码中的其他模块，都是 echarts 的内部模块，**不应该去引用**。因为在后续 echarts 版本升级中，内部模块的接口和功能可能变化，甚至模块本身也可能被移除。
+在自定义构建中，允许被引用的模块，全声明在 [`myProject/node_module/echarts/echarts.all.js`](https://github.com/apache/incubator-echarts/blob/master/echarts.all.js) 和 [`myProject/node_module/echarts/src/export.js`](https://github.com/apache/incubator-echarts/blob/master/src/export.js) 中。echarts 和 zrender 源代码中的其他模块，都是 echarts 的内部模块，**不应该去引用**。因为在后续 echarts 版本升级中，内部模块的接口和功能可能变化，甚至模块本身也可能被移除。
## 引用 `echarts/lib/**` 还是 `echarts/src/**`
@@ -136,7 +136,7 @@ node node_modules/echarts/build/build.js --min -i echarts.custom.js -o lib/echar
## 直接使用 rollup 自定义构建
-上文中介绍了如何使用 echarts 提供的脚本 `echarts/build/build.js` 自定义构建。与此并列的另一种选择是，我们直接使用构建工具（如 [rollup](https://rollupjs.org/)、[webpack](https://webpack.github.io/)、[browserify](http://browserify.org/)）自定义构建，并且把 echarts 代码和项目代码在构建成一体。在一些项目中可能需要这么做。下面我们仅仅介绍如何使用 [rollup](https://rollupjs.org/) 来构建。[webpack](https://webpack.github.io/) 和 [browserify](http://browserify.org/) 与此类同，不赘述。
+上文中介绍了如何使用 echarts 提供的脚本 `echarts/build/build.js` 自定义构建。与此并列的另一种选择是，我们直接使用构建工具（如 [rollup](https://rollupjs.org/)、[webpack](https://webpack.js.org//)、[browserify](http://browserify.org/)）自定义构建，并且把 echarts 代码和项目代码在构建成一体。在一些项目中可能需要这么做。下面我们仅仅介绍如何使用 [rollup](https://rollupjs.org/) 来构建。[webpack](https://webpack.js.org//) 和 [browserify](http://browserify.org/) 与此类同，不赘述。
首先我们在 `myProject` 目录下使用 npm 安装 [rollup](https://rollupjs.org/)：
diff --git a/zh/tutorial/custom-series.md b/zh/tutorial/custom-series.md
index fce2fcf..0fe8c98 100644
--- a/zh/tutorial/custom-series.md
+++ b/zh/tutorial/custom-series.md
@@ -2,16 +2,16 @@
# 自定义系列
-[自定义系列（custom series）](http://echarts.baidu.com/option.html#series-custom)，是一种系列的类型。它把绘制图形元素这一步留给开发者去做，从而开发者能在坐标系中自由绘制出自己需要的图表。
+[自定义系列（custom series）](option.html#series-custom)，是一种系列的类型。它把绘制图形元素这一步留给开发者去做，从而开发者能在坐标系中自由绘制出自己需要的图表。
-echarts 为什么会要支持 `自定义系列` 呢？echarts 内置支持的图表类型是最常见的图表类型，但是图表类型是难于穷举的，有很多小众的需求 echarts 并不能内置的支持。那么就需要提供一种方式来让开发者自己扩展。另一方面，所提供的扩展方式要尽可能得简单，例如图形元素创建和释放、过渡动画、tooltip、[数据区域缩放（dataZoom）](http://echarts.baidu.com/option.html#dataZoom)、[视觉映射（visualMap）](http://echarts.baidu.com/option.html#visualMap)等功能，尽量在 echarts 中内置得处理，使开发者不必纠结于这些细节。综上考虑形成了 [自定义系列（custom series）](http://echarts.baidu.com/option.html#series-custom)。
+echarts 为什么会要支持 `自定义系列` 呢？echarts 内置支持的图表类型是最常见的图表类型，但是图表类型是难于穷举的，有很多小众的需求 echarts 并不能内置的支持。那么就需要提供一种方式来让开发者自己扩展。另一方面，所提供的扩展方式要尽可能得简单，例如图形元素创建和释放、过渡动画、tooltip、[数据区域缩放（dataZoom）](option.html#dataZoom)、[视觉映射（visualMap）](option.html#visualMap)等功能，尽量在 echarts 中内置得处理，使开发者不必纠结于这些细节。综上考虑形成了 [自定义系列（custom series）](option.html#series-custom)。
**例如，下面的例子使用 custom series 扩展出了 x-range 图：**
~[800x500](${galleryViewPath}custom-profile&reset=1&edit=1)
-**更多的例子参见：[custom examples](http://echarts.baidu.com/examples.html#chart-type-custom)**
+**更多的例子参见：[custom examples](${websitePath}examples.html#chart-type-custom)**
-下面来介绍开发者怎么使用 [自定义系列（custom series）](http://echarts.baidu.com/option.html#series-custom)。
+下面来介绍开发者怎么使用 [自定义系列（custom series）](option.html#series-custom)。
<br>
@@ -32,7 +32,7 @@ var option = {
}
```
-在渲染阶段，对于 [series.data](http://echarts.baidu.com/option.html#series-custom.data) 中的每个数据项（为方便描述，这里称为 `dataItem`)，会调用此 [renderItem](http://echarts.baidu.com/option.html#series-custom.renderItem) 函数。这个 `renderItem` 函数的职责，就是返回一个（或者一组）`图形元素定义`，`图形元素定义` 中包括图形元素的类型、位置、尺寸、样式等。echarts 会根据这些 `图形元素定义` 来渲染出图形元素。如下的示意：
+在渲染阶段，对于 [series.data](option.html#series-custom.data) 中的每个数据项（为方便描述，这里称为 `dataItem`)，会调用此 [renderItem](option.html#series-custom.renderItem) 函数。这个 `renderItem` 函数的职责，就是返回一个（或者一组）`图形元素定义`，`图形元素定义` 中包括图形元素的类型、位置、尺寸、样式等。echarts 会根据这些 `图形元素定义` 来渲染出图形元素。如下的示意：
```js
@@ -92,19 +92,19 @@ var option = {
```
-[renderItem](http://echarts.baidu.com/option.html#series-custom.renderItem) 函数提供了两个参数：
-+ [params](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.params)：包含了当前数据信息（如 `seriesIndex`、`dataIndex` 等等）和坐标系的信息（如坐标系包围盒的位置和尺寸）。
-+ [api](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.api)：是一些开发者可调用的方法集合（如 `api.value()`、`api.coord()`）。
+[renderItem](option.html#series-custom.renderItem) 函数提供了两个参数：
++ [params](option.html#series-custom.renderItem.arguments.params)：包含了当前数据信息（如 `seriesIndex`、`dataIndex` 等等）和坐标系的信息（如坐标系包围盒的位置和尺寸）。
++ [api](option.html#series-custom.renderItem.arguments.api)：是一些开发者可调用的方法集合（如 `api.value()`、`api.coord()`）。
-[renderItem](http://echarts.baidu.com/option.html#series-custom.renderItem) 函数须返回根据此 `dataItem` 绘制出的图形元素的定义信息，参见 [renderItem.return](http://echarts.baidu.com/option.html#series-custom.renderItem.return)。
+[renderItem](option.html#series-custom.renderItem) 函数须返回根据此 `dataItem` 绘制出的图形元素的定义信息，参见 [renderItem.return](option.html#series-custom.renderItem.return)。
-一般来说，[renderItem](http://echarts.baidu.com/option.html#series-custom.renderItem) 函数的主要逻辑，是将 `dataItem` 里的值映射到坐标系上的图形元素。这一般需要用到 [renderItem.arguments.api](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.api) 中的两个函数：
-+ [api.value(...)](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.api.value)，意思是取出 `dataItem` 中的数值。例如 `api.value(0)` 表示取出当前 `dataItem` 中第一个维度的数值。
-+ [api.coord(...)](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.api.coord)，意思是进行坐标转换计算。例如 `var point = api.coord([api.value(0), api.value(1)])` 表示 `dataItem` 中的数值转换成坐标系上的点。
+一般来说，[renderItem](option.html#series-custom.renderItem) 函数的主要逻辑，是将 `dataItem` 里的值映射到坐标系上的图形元素。这一般需要用到 [renderItem.arguments.api](option.html#series-custom.renderItem.arguments.api) 中的两个函数：
++ [api.value(...)](option.html#series-custom.renderItem.arguments.api.value)，意思是取出 `dataItem` 中的数值。例如 `api.value(0)` 表示取出当前 `dataItem` 中第一个维度的数值。
++ [api.coord(...)](option.html#series-custom.renderItem.arguments.api.coord)，意思是进行坐标转换计算。例如 `var point = api.coord([api.value(0), api.value(1)])` 表示 `dataItem` 中的数值转换成坐标系上的点。
-有时候还需要用到 [api.size(...)](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.api.size) 函数，表示得到坐标系上一段数值范围对应的长度。
+有时候还需要用到 [api.size(...)](option.html#series-custom.renderItem.arguments.api.size) 函数，表示得到坐标系上一段数值范围对应的长度。
-返回值中样式的设置可以使用 [api.style(...)](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.api.style) 函数，他能得到 [series.itemStyle](http://echarts.baidu.com/option.html#series-custom.itemStyle) 中定义的样式信息，以及视觉映射的样式信息。也可以用这种方式覆盖这些样式信息：`api.style({fill: 'green', stroke: 'yellow'})`。
+返回值中样式的设置可以使用 [api.style(...)](option.html#series-custom.renderItem.arguments.api.style) 函数，他能得到 [series.itemStyle](option.html#series-custom.itemStyle) 中定义的样式信息，以及视觉映射的样式信息。也可以用这种方式覆盖这些样式信息：`api.style({fill: 'green', stroke: 'yellow'})`。
书写完 `renderItem` 方法后，自定义系列的 90% 工作就做完了。剩下的是一些精化工作。
@@ -114,7 +114,7 @@ var option = {
<br>
<h2>（二）使坐标轴的范围自适应数据范围</h2>
-在 [直角坐标系（grid）](http://echarts.baidu.com/option.html#grid)、[极坐标系（polar）](http://echarts.baidu.com/option.html#polar) 中都有坐标轴。坐标轴的刻度范围需要自适应当前显示出的数据的范围，否则绘制出的图形会超出去。所以，例如，在 [直角坐标系（grid）](http://echarts.baidu.com/option.html#grid) 中，使用自定义系列的开发者，需要设定，`data` 中的哪些维度会对应到 `x` 轴上，哪些维度会对应到 `y` 轴上。这件事通过 [encode](http://echarts.baidu.com/option.html#series-custom.encode) 来设定。例如：
+在 [直角坐标系（grid）](option.html#grid)、[极坐标系（polar）](option.html#polar) 中都有坐标轴。坐标轴的刻度范围需要自适应当前显示出的数据的范围，否则绘制出的图形会超出去。所以，例如，在 [直角坐标系（grid）](option.html#grid) 中，使用自定义系列的开发者，需要设定，`data` 中的哪些维度会对应到 `x` 轴上，哪些维度会对应到 `y` 轴上。这件事通过 [encode](option.html#series-custom.encode) 来设定。例如：
```js
option = {
@@ -145,7 +145,7 @@ option = {
<br>
<h2>（三）设定 tooltip</h2>
-当然，使用 [tooltip.formatter](http://echarts.baidu.com/option.html#tooltip.formatter) 可以任意定制 tooltip 中的内容。但是还有更简单的方法，通过[encode](http://echarts.baidu.com/option.html#series-custom.encode) 和 [dimensions](http://echarts.baidu.com/option.html#series-custom.dimensions) 来设定：
+当然，使用 [tooltip.formatter](option.html#tooltip.formatter) 可以任意定制 tooltip 中的内容。但是还有更简单的方法，通过[encode](option.html#series-custom.encode) 和 [dimensions](option.html#series-custom.dimensions) 来设定：
```js
option = {
@@ -188,7 +188,7 @@ option = {
<br>
<h2>（四）超出坐标系范围的截取</h2>
-与 [dataZoom](http://echarts.baidu.com/option.html#dataZoom) 结合使用的时候，常常使用会设置 [dataZoom.filterMode](http://echarts.baidu.com/option.html#dataZoom.filterMode) 为 'weakFilter'。这个设置的意思是：当 `dataItem` 部分超出坐标系边界的时候，`dataItem` 不会整体被过滤掉。例如：
+与 [dataZoom](option.html#dataZoom) 结合使用的时候，常常使用会设置 [dataZoom.filterMode](option.html#dataZoom.filterMode) 为 'weakFilter'。这个设置的意思是：当 `dataItem` 部分超出坐标系边界的时候，`dataItem` 不会整体被过滤掉。例如：
```js
option = {
@@ -224,12 +224,12 @@ option = {
<br>
<h2>（五）关于 dataIndex</h2>
-开发者如果使用到的话应注意，[renderItem.arguments.params](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.params) 中的 `dataIndex` 和 `dataIndexInside` 是有区别的：
+开发者如果使用到的话应注意，[renderItem.arguments.params](option.html#series-custom.renderItem.arguments.params) 中的 `dataIndex` 和 `dataIndexInside` 是有区别的：
+ `dataIndex` 指的 `dataItem` 在原始数据中的 index。
-+ `dataIndexInside` 指的是 `dataItem` 在当前数据窗口（参见 [dataZoom](http://echarts.baidu.com/option.html#dataZoom)）中的 index。
++ `dataIndexInside` 指的是 `dataItem` 在当前数据窗口（参见 [dataZoom](option.html#dataZoom)）中的 index。
-[renderItem.arguments.api](http://echarts.baidu.com/option.html#series-custom.renderItem.arguments.api) 中使用的参数都是 `dataIndexInside` 而非 `dataIndex`，因为从 `dataIndex` 转换成 `dataIndexInside` 需要时间开销。
+[renderItem.arguments.api](option.html#series-custom.renderItem.arguments.api) 中使用的参数都是 `dataIndexInside` 而非 `dataIndex`，因为从 `dataIndex` 转换成 `dataIndexInside` 需要时间开销。
@@ -271,12 +271,12 @@ chart.on('click', {element: 'aaa'}, function (params) {
<br>
<h2>（七）自定义矢量图形</h2>
-自定义系列能支持使用 [SVG PathData](http://www.w3.org/TR/SVG/paths.html#PathData) 定义矢量路径。从而可以使用矢量图工具中做出的图形。参见：[path](http://echarts.baidu.com/option.html#series-custom.renderItem.return_path)，以及例子：[icons](http://echarts.baidu.com/examples/editor.html?c=custom-calendar-icon) 和 [shapes](http://echarts.baidu.com/examples/editor.html?c=custom-gantt-flight)。
+自定义系列能支持使用 [SVG PathData](http://www.w3.org/TR/SVG/paths.html#PathData) 定义矢量路径。从而可以使用矢量图工具中做出的图形。参见：[path](option.html#series-custom.renderItem.return_path)，以及例子：[icons](${websitePath}examples/editor.html?c=custom-calendar-icon) 和 [shapes](${websitePath}examples/editor.html?c=custom-gantt-flight)。
<br>
-**更多的自定义系列的例子参见：[custom examples](http://echarts.baidu.com/examples.html#chart-type-custom)**
+**更多的自定义系列的例子参见：[custom examples](${websitePath}examples.html#chart-type-custom)**
diff --git a/zh/tutorial/drag-example.md b/zh/tutorial/drag-example.md
index b43d32a..6464bac 100644
--- a/zh/tutorial/drag-example.md
+++ b/zh/tutorial/drag-example.md
@@ -14,7 +14,7 @@ echarts 本身没有提供封装好的『拖拽改变图表』功能，因为现
<br>
<h2>（一）实现基本的拖拽功能</h2>
-在这个例子中，基础的图表是一个 [折线图 (series-line)](http://echarts.baidu.com/option.html#series-line)。参见如下配置：
+在这个例子中，基础的图表是一个 [折线图 (series-line)](option.html#series-line)。参见如下配置：
```js
var symbolSize = 20;
@@ -47,7 +47,7 @@ myChart.setOption({
});
```
-既然折线中原生的点没有拖拽功能，我们就为它加上拖拽功能：用 [graphic](http://echarts.baidu.com/option.html#graphic) 组件，在每个点上面，覆盖一个隐藏的可拖拽的圆点。
+既然折线中原生的点没有拖拽功能，我们就为它加上拖拽功能：用 [graphic](option.html#graphic) 组件，在每个点上面，覆盖一个隐藏的可拖拽的圆点。
```js
myChart.setOption({
@@ -82,9 +82,9 @@ myChart.setOption({
});
```
-上面的代码中，使用 [convertToPixel](http://echarts.baidu.com/api.html#echartsInstance.convertToPixel) 这个 API，进行了从 data 到『像素坐标』的转换，从而得到了每个圆点应该在的位置，从而能绘制这些圆点。`myChart.convertToPixel('grid', dataItem)` 这句话中，第一个参数 `'grid'` 表示 `dataItem` 在 [grid](http://echarts.baidu.com/option.html#grid) 这个组件中（即直角坐标系）中进行转换。所谓『像素坐标』，就是以 echarts 容器 dom element 的左上角为零点的以像素为单位的坐标系中的坐标。
+上面的代码中，使用 [convertToPixel](api.html#echartsInstance.convertToPixel) 这个 API，进行了从 data 到『像素坐标』的转换，从而得到了每个圆点应该在的位置，从而能绘制这些圆点。`myChart.convertToPixel('grid', dataItem)` 这句话中，第一个参数 `'grid'` 表示 `dataItem` 在 [grid](option.html#grid) 这个组件中（即直角坐标系）中进行转换。所谓『像素坐标』，就是以 echarts 容器 dom element 的左上角为零点的以像素为单位的坐标系中的坐标。
-注意这件事需要在第一次 setOption 后再进行，也就是说，须在坐标系（[grid](http://echarts.baidu.com/option.html#grid)）初始化后才能调用 `myChart.convertToPixel('grid', dataItem)`。
+注意这件事需要在第一次 setOption 后再进行，也就是说，须在坐标系（[grid](option.html#grid)）初始化后才能调用 `myChart.convertToPixel('grid', dataItem)`。
有了这段代码后，就有了诸个能拖拽的点。接下来要为每个点，加上拖拽响应的事件：
@@ -105,7 +105,7 @@ function onPointDragging(dataIndex) {
}
```
-上面的代码中，使用了 [convertFromPixel](http://echarts.baidu.com/api.html#echartsInstance.convertFromPixel) 这个 API。它是 [convertToPixel](http://echarts.baidu.com/api.html#echartsInstance.convertToPixel) 的逆向过程。`myChart.convertFromPixel('grid', this.position)` 表示把当前像素坐标转换成 [grid](http://echarts.baidu.com/option.html#grid) 组件中直角坐标系的 dataItem 值。
+上面的代码中，使用了 [convertFromPixel](api.html#echartsInstance.convertFromPixel) 这个 API。它是 [convertToPixel](api.html#echartsInstance.convertToPixel) 的逆向过程。`myChart.convertFromPixel('grid', this.position)` 表示把当前像素坐标转换成 [grid](option.html#grid) 组件中直角坐标系的 dataItem 值。
最后，为了使 dom 尺寸改变时，图中的元素能自适应得变化，加上这些代码：
@@ -130,7 +130,7 @@ window.addEventListener('resize', function () {
<br>
<h2>（二）添加 tooltip 组件</h2>
-到此，拖拽的基本功能就完成了。但是想要更进一步得实时看到拖拽过程中，被拖拽的点的 data 值的变化状况，我们可以使用 [tooltip](http://echarts.baidu.com/option.html#tooltip) 组件来实时显示这个值。但是，tooltip 有其默认的『显示』『隐藏』触发规则，在我们拖拽的场景中并不适用，所以我们还要手动定制 tooltip 的『显示』『隐藏』行为。
+到此，拖拽的基本功能就完成了。但是想要更进一步得实时看到拖拽过程中，被拖拽的点的 data 值的变化状况，我们可以使用 [tooltip](option.html#tooltip) 组件来实时显示这个值。但是，tooltip 有其默认的『显示』『隐藏』触发规则，在我们拖拽的场景中并不适用，所以我们还要手动定制 tooltip 的『显示』『隐藏』行为。
在上述代码中分别添加如下定义：
@@ -175,7 +175,7 @@ function hideTooltip(dataIndex) {
}
```
-这里使用了 [dispatchAction](http://echarts.baidu.com/api.html#echartsInstance.dispatchAction) 来显示隐藏 tooltip。用到了 [showTip](http://echarts.baidu.com/api.html#action.tooltip.showTip)、[hideTip](http://echarts.baidu.com/api.html#action.tooltip.hideTip)。
+这里使用了 [dispatchAction](api.html#echartsInstance.dispatchAction) 来显示隐藏 tooltip。用到了 [showTip](api.html#action.tooltip.showTip)、[hideTip](api.html#action.tooltip.hideTip)。
@@ -189,7 +189,7 @@ function hideTooltip(dataIndex) {
<html>
<head>
<meta charset="utf-8">
- <script src="http://echarts.baidu.com/dist/echarts.min.js"></script>
+ <script src="dist/echarts.min.js"></script>
</head>
<body>
<div id="main" style="width: 600px;height:400px;"></div>
@@ -290,7 +290,7 @@ function hideTooltip(dataIndex) {
<br>
-有了这些基础，就可以定制更多的功能了。可以加 [dataZoom](http://echarts.baidu.com/option.html#dataZoom) 组件，可以制作一个直角坐标系上的绘图板等等。可以发挥想象力。
+有了这些基础，就可以定制更多的功能了。可以加 [dataZoom](option.html#dataZoom) 组件，可以制作一个直角坐标系上的绘图板等等。可以发挥想象力。
diff --git a/zh/tutorial/getting-started.md b/zh/tutorial/getting-started.md
index 11c9bef..1fd4ad3 100644
--- a/zh/tutorial/getting-started.md
+++ b/zh/tutorial/getting-started.md
@@ -5,17 +5,17 @@
你可以通过以下几种方式获取 ECharts。
-1. 从[官网下载界面](http://echarts.baidu.com/download.html)选择你需要的版本下载，根据开发者功能和体积上的需求，我们提供了不同打包的下载，如果你在体积上没有要求，可以直接下载[完整版本](http://echarts.baidu.com/dist/echarts.min.js)。开发环境建议下载[源代码版本](http://echarts.baidu.com/dist/echarts.js)，包含了常见的错误提示和警告。
+* 从 [Apache ECharts (incubating) 官网下载界面](${websitePath}download.html) 获取官方源码包后构建。
-2. 在 ECharts 的 [GitHub](https://github.com/ecomfe/echarts) 上下载最新的 `release` 版本，解压出来的文件夹里的 `dist` 目录里可以找到最新版本的 echarts 库。
+* 在 ECharts 的 [GitHub](https://github.com/apache/incubator-echarts/releases) 获取。
-3. 通过 npm 获取 echarts，`npm install echarts --save`，详见“[在 webpack 中使用 echarts](http://echarts.baidu.com/tutorial.html#%E5%9C%A8%20webpack%20%E4%B8%AD%E4%BD%BF%E7%94%A8%20ECharts)”
+* 通过 npm 获取 echarts，`npm install echarts --save`，详见“[在 webpack 中使用 echarts](${websitePath}tutorial.html#%E5%9C%A8%20webpack%20%E4%B8%AD%E4%BD%BF%E7%94%A8%20ECharts)”
-4. cdn 引入，你可以在 [cdnjs](https://cdnjs.com/libraries/echarts)，[npmcdn](https://npmcdn.com/echarts@latest/dist/) 或者国内的 [bootcdn](http://www.bootcdn.cn/echarts/) 上找到 ECharts 的最新版本。
+* 通过 [jsDelivr](https://www.jsdelivr.com/package/npm/echarts) 等 CDN 引入
## 引入 ECharts
-ECharts 3 开始不再强制使用 AMD 的方式按需引入，代码里也不再内置 AMD 加载器。因此引入方式简单了很多，只需要像普通的 JavaScript 库一样用 script 标签引入。
+通过标签方式直接引入构建好的 echarts 文件
```html
<!DOCTYPE html>
diff --git a/zh/tutorial/headless.md b/zh/tutorial/headless.md
index 779d2e7..8a91f5b 100644
--- a/zh/tutorial/headless.md
+++ b/zh/tutorial/headless.md
@@ -3,13 +3,13 @@
# 服务端渲染
-ECharts 可以在服务端进行渲染。例如 [官方示例](http://www.echartsjs.com/examples/) 里的一个个小截图，就是在服务端预生成出来的。
+ECharts 可以在服务端进行渲染。例如 [官方示例](https://echarts.apache.org/examples/zh/index.html) 里的一个个小截图，就是在服务端预生成出来的。
服务端渲染可以使用流行的 headless 环境，例如 [puppeteer](https://github.com/GoogleChrome/puppeteer)、[headless chrome](https://chromium.googlesource.com/chromium/src/+/lkgr/headless/README.md)、[node-canvas](https://github.com/Automattic/node-canvas)、[jsdom](https://github.com/jsdom/jsdom)、[PhantomJS](http://phantomjs.org/) 等。
这是一些社区贡献的 echarts 服务端渲染方案：
-+ <https://github.com/hellosean1025/node-echarts>
-+ <https://github.com/chfw/echarts-scrappeteer>
-+ <https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js>
-
++ https://github.com/hellosean1025/node-echarts
++ https://github.com/chfw/echarts-scrappeteer
++ https://github.com/chfw/pyecharts-snapshot/blob/master/pyecharts_snapshot/phantomjs/snapshot.js
++ https://gist.github.com/pissang/4c32ee30e35c91336af72b129a1a4a73
\ No newline at end of file
diff --git a/zh/tutorial/npm-webpack.md b/zh/tutorial/npm-webpack.md
index bd791c6..ab12f8a 100644
--- a/zh/tutorial/npm-webpack.md
+++ b/zh/tutorial/npm-webpack.md
@@ -3,12 +3,10 @@
# 在 webpack 中使用 ECharts
-[Webpack](https://webpack.github.io/) 是目前比较流行的模块打包工具，你可以在使用 webpack 的项目中轻松的引入和打包 ECharts，这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。
+[Webpack](https://webpack.js.org//) 是目前比较流行的模块打包工具，你可以在使用 webpack 的项目中轻松的引入和打包 ECharts，这里假设你已经对 webpack 具有一定的了解并且在自己的项目中使用。
## npm 安装 ECharts
-在 `3.1.1` 版本之前 ECharts 在 npm 上的 package 是非官方维护的，从 `3.1.1` 开始由官方 [EFE](https://github.com/ecomfe/) 维护 npm 上 ECharts 和 zrender 的 package。
-
你可以使用如下命令通过 npm 安装 ECharts
```shell
@@ -77,7 +75,7 @@ myChart.setOption({
});
```
-可以按需引入的模块列表见 [https://github.com/ecomfe/echarts/blob/master/index.js](https://github.com/ecomfe/echarts/blob/master/index.js)
+可以按需引入的模块列表见 [https://github.com/apache/incubator-echarts/blob/master/index.js](https://github.com/apache/incubator-echarts/blob/master/index.js)
-对于流行的模块打包工具 [browserify](http://browserify.org/) 也是同样的用法，这里就不赘述了。而对于使用 [rollup](https://rollupjs.org/) 的自定义构建，参见 [自定义构建 ECharts](http://echarts.baidu.com/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts)。
+对于流行的模块打包工具 [browserify](http://browserify.org/) 也是同样的用法，这里就不赘述了。而对于使用 [rollup](https://rollupjs.org/) 的自定义构建，参见 [自定义构建 ECharts](${websitePath}/zh/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts)。
diff --git a/zh/tutorial/renderer.md b/zh/tutorial/renderer.md
index 23743d2..dcc2d87 100644
--- a/zh/tutorial/renderer.md
+++ b/zh/tutorial/renderer.md
@@ -10,7 +10,7 @@ ECharts 从初始一直使用 Canvas 绘制图表（除了对 IE8- 使用 VML）
## 选择哪种渲染器
-一般来说，Canvas 更适合绘制图形元素数量非常大（这一般是由数据量大导致）的图表（如热力图、地理坐标系或平行坐标系上的大规模线图或散点图等），也利于实现某些视觉 [特效](http://echarts.baidu.com/demo.html#lines-bmap-effect)。但是，在不少场景中，SVG 具有重要的优势：它的内存占用更低（这对移动端尤其重要）、渲染性能略高、并且用户使用浏览器内置的缩放功能时不会模糊。例如，我们在一些硬件环境中分别使用 Canvas 渲染器和 SVG 渲染器绘制中等数据量的折、柱、饼，统计初始动画阶段的帧率，得到了一个性能对比图：
+一般来说，Canvas 更适合绘制图形元素数量非常大（这一般是由数据量大导致）的图表（如热力图、地理坐标系或平行坐标系上的大规模线图或散点图等），也利于实现某些视觉 [特效](examples/editor.html?c=lines-bmap-effect)。但是，在不少场景中，SVG 具有重要的优势：它的内存占用更低（这对移动端尤其重要）、渲染性能略高、并且用户使用浏览器内置的缩放功能时不会模糊。例如，我们在一些硬件环境中分别使用 Canvas 渲染器和 SVG 渲染器绘制中等数据量的折、柱、饼，统计初始动画阶段的帧率，得到了一个性能对比图：
~[90%x400](${galleryViewPath}doc-example/canvas-vs-svg&reset=1)
@@ -22,25 +22,25 @@ ECharts 从初始一直使用 Canvas 绘制图表（除了对 IE8- 使用 VML）
+ 在须要创建很多 ECharts 实例且浏览器易崩溃的情况下（可能是因为 Canvas 数量多导致内存占用超出手机承受能力），可以使用 SVG 渲染器来进行改善。大略得说，如果图表运行在低端安卓机，或者我们在使用一些特定图表如 [水球图](https://ecomfe.github.io/echarts-liquidfill/example/) 等，SVG 渲染器可能效果更好。
+ 数据量很大、较多交互时，可以选用 Canvas 渲染器。
-我们强烈欢迎开发者们 [反馈](https://github.com/ecomfe/echarts/issues/new) 给我们使用的体验和场景，帮助我们更好的做优化。
+我们强烈欢迎开发者们 [反馈](https://github.com/apache/incubator-echarts/issues/new) 给我们使用的体验和场景，帮助我们更好的做优化。
-注：除了某些特殊的渲染可能依赖 Canvas：如[炫光尾迹特效](http://echarts.baidu.com/option.html#series-lines.effect)、[带有混合效果的热力图](http://echarts.baidu.com/examples/editor.html?c=heatmap-bmap)等，绝大部分功能 SVG 都是支持的。此外，目前的 SVG 版中，富文本、材质功能尚未实现。
+注：除了某些特殊的渲染可能依赖 Canvas：如[炫光尾迹特效](option.html#series-lines.effect)、[带有混合效果的热力图](examples/editor.html?c=heatmap-bmap)等，绝大部分功能 SVG 都是支持的。此外，目前的 SVG 版中，富文本、材质功能尚未实现。
## 如何使用渲染器
ECharts 默认使用 Canvas 渲染。如果想使用 SVG 渲染，ECharts 代码中须包括有 SVG 渲染器模块。
-+ ECharts 的 [预构建文件](http://echarts.baidu.com/download.html) 中，[常用版](http://echarts.baidu.com/dist/echarts.common.min.js) 和 [完整版](http://echarts.baidu.com/dist/echarts.min.js) 已经包含了 SVG 渲染器，可直接使用。而 [精简版](http://echarts.baidu.com/dist/echarts.simple.min.js) 没有包括。
-+ 如果 [在线自定义构建 ECharts](http://echarts.baidu.com/builder.html)，则需要勾上页面下方的 “SVG 渲染”。
-+ 如果 [线下自定义构建 ECharts](http://echarts.baidu.com/tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts)，则须引入 SVG 渲染器模块，即：
++ ECharts 的 [预构建文件](https://www.jsdelivr.com/package/npm/echarts) 中，[常用版](https://cdn.jsdelivr.net/npm/echarts/dist/echarts.common.min.js) 和 [完整版](https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js) 已经包含了 SVG 渲染器，可直接使用。而 [精简版](https://cdn.jsdelivr.net/npm/echarts/dist/echarts.simple.min.js) 没有包括。
++ 如果 [在线自定义构建 ECharts](builder.html)，则需要勾上页面下方的 “SVG 渲染”。
++ 如果 [线下自定义构建 ECharts](tutorial.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E6%9E%84%E5%BB%BA%20ECharts)，则须引入 SVG 渲染器模块，即：
```js
import 'zrender/lib/svg/svg';
```
-然后，我们就可以在代码中，初始化图表实例时，[传入参数](http://echarts.baidu.com/api.html#echarts.init) 选择渲染器类型：
+然后，我们就可以在代码中，初始化图表实例时，[传入参数](api.html#echarts.init) 选择渲染器类型：
```js
// 使用 Canvas 渲染器（默认）
diff --git a/zh/tutorial/sunburst-series.md b/zh/tutorial/sunburst-series.md
index eb56d3f..723d081 100644
--- a/zh/tutorial/sunburst-series.md
+++ b/zh/tutorial/sunburst-series.md
@@ -8,7 +8,7 @@
## 引入相关文件
-旭日图是 ECharts 4.0 新增的图表类型，在[官网下载页面](http://echarts.baidu.com/download.html)下载“完整版” ECharts，并将下载的 JavaScript 文件引入即可创建旭日图。
+旭日图是 ECharts 4.0 新增的图表类型，从 [CDN](https://www.jsdelivr.com/package/npm/echarts) 引入完整版的 [echarts.min.js](https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js)
## 最简单的旭日图
diff --git a/zh/tutorial/weixin-application.md b/zh/tutorial/weixin-application.md
index 5467c3c..2636a4c 100644
--- a/zh/tutorial/weixin-application.md
+++ b/zh/tutorial/weixin-application.md
@@ -20,7 +20,7 @@
其中，`ec-canvas` 是我们提供的组件，其他文件是如何使用该组件的示例。
-`ec-canvas` 目录下有一个 `echarts.js`，默认我们会在每次 `echarts-for-weixin` 项目发版的时候替换成最新版的 ECharts。如有必要，可以自行从 ECharts 项目中下载[最新发布版](https://github.com/ecomfe/echarts/releases)，或者从[官网自定义构建](http://echarts.baidu.com/builder.html)以减小文件大小。
+`ec-canvas` 目录下有一个 `echarts.js`，默认我们会在每次 `echarts-for-weixin` 项目发版的时候替换成最新版的 ECharts。如有必要，可以自行从 ECharts 项目中下载[最新发布版](https://github.com/apache/incubator-echarts/releases)，或者从[官网自定义构建](${websitePath}builder.html)以减小文件大小。
## 引入组件
@@ -83,7 +83,7 @@ Page({
});
```
-这对于所有 ECharts 图表都是通用的，用户只需要修改上面 `option` 的内容，即可改变图表。`option` 的使用方法参见 [ECharts 配置项文档](http://echarts.baidu.com/option.html)。对于不熟悉 ECharts 的用户，可以参见 [5 分钟上手 ECharts](http://echarts.baidu.com/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts) 教程。
+这对于所有 ECharts 图表都是通用的，用户只需要修改上面 `option` 的内容，即可改变图表。`option` 的使用方法参见 [ECharts 配置项文档](${websitePath}option.html)。对于不熟悉 ECharts 的用户，可以参见 [5 分钟上手 ECharts](${websitePath}tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts) 教程。
完整的例子请参见 [ecomfe/echarts-for-weixin](https://github.com/ecomfe/echarts-for-weixin) 项目。
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org