docs: 404

docs/api/advanced/registeranimation.en.md → docs/api/advanced/register-animation.en.md

@@ -59,4 +59,4 @@ chart.interval().animate({
 });
 ```
 
-<!-- [API 链接](../../api/register#g2registeranimation)。 -->
+<!-- [API 链接](../../api/register#g2register-animation)。 -->

docs/api/advanced/registeranimation.zh.md → docs/api/advanced/register-animation.zh.md

@@ -59,4 +59,4 @@ chart.interval().animate({
 });
 ```
 
-<!-- [API 链接](../../api/register#g2registeranimation)。 -->
+<!-- [API 链接](../../api/register#g2register-animation)。 -->

docs/api/advanced/registerfacet.en.md → docs/api/advanced/register-facet.en.md

@@ -28,7 +28,7 @@ chart.facet(facatType, {
 - circle
 - tree
 
-具体的使用方式，配置数据结构，见[分面文档](../../api/facet)。
+具体的使用方式，配置数据结构，见[分面文档](../../api/general/facet)。
 
 > 如果以上内置分面无法满足自己的定制需求，那么可以尝试 G2 提供的自定义分面能力。
 

docs/api/advanced/registerfacet.zh.md → docs/api/advanced/register-facet.zh.md

@@ -28,7 +28,7 @@ chart.facet(facatType, {
 - circle
 - tree
 
-具体的使用方式，配置数据结构，见[分面文档](../../api/facet)。
+具体的使用方式，配置数据结构，见[分面文档](../../api/general/facet)。
 
 > 如果以上内置分面无法满足自己的定制需求，那么可以尝试 G2 提供的自定义分面能力。
 

docs/api/advanced/registerinteraction.en.md → docs/api/advanced/register-interaction.en.md

@@ -4,7 +4,7 @@ title: 自定义交互
 order: 5
 ---## 简介
 
-G2 4.0 最大的一个变化是所有的交互不再内置，全部通过交互语法搭配而成，前面章节介绍了[交互的使用](../tutorial/interaction)  本章介绍如何自定义交互。
+G2 4.0 最大的一个变化是所有的交互不再内置，全部通过交互语法搭配而成，前面章节介绍了[交互的使用](../../manual/concepts/interaction)  本章介绍如何自定义交互。
 
 ## 自定义交互
 
@@ -99,7 +99,7 @@ G2.registerInteraction('my-interaction', MyInteraction);
 其中：
 
 - trigger 触发一个交互环节的事件名，是所有 Chart 支持的事件
-- action 触发的反馈，可以是字符串也可以是数组，是所有内置和用户自定义的 Action，参考 [交互反馈 Action 列表](../tutorial/interaction/#交互反馈-action-列表) 。
+- action 触发的反馈，可以是字符串也可以是数组，是所有内置和用户自定义的 Action，参考 [交互反馈 Action 列表](../../manual/concepts/interaction#交互反馈-action-列表) 。
   - 字符串由 ’actionName:method‘ 组成
   - 列表时可以使用相同的 action ，也可以使用不同的 action ，例如: ['element-active:clear', 'element-active:active', 'mask:clear']
 
@@ -260,7 +260,7 @@ export interface IInteractionContext extends LooseObject {
 
 ## 自定义 Action
 
-使用交互语法搭配交互时，需要使用到 Action，你可以从 G2 已经内置的 [Action 列表](../tutorial/interaction/#交互反馈-action-列表)  中选取，也可以选择自定义 Action。<br />自定义 Action 有两个步骤：
+使用交互语法搭配交互时，需要使用到 Action，你可以从 G2 已经内置的 [Action 列表](../../manual/concepts/interaction#交互反馈-action-列表)  中选取，也可以选择自定义 Action。<br />自定义 Action 有两个步骤：
 
 - 实现 Action 的继承类
 - 注册 Action

docs/api/advanced/registerinteraction.zh.md → docs/api/advanced/register-interaction.zh.md

@@ -4,7 +4,7 @@ title: 自定义交互
 order: 5
 ---## 简介
 
-G2 4.0 最大的一个变化是所有的交互不再内置，全部通过交互语法搭配而成，前面章节介绍了[交互的使用](../tutorial/interaction)  本章介绍如何自定义交互。
+G2 4.0 最大的一个变化是所有的交互不再内置，全部通过交互语法搭配而成，前面章节介绍了[交互的使用](../../manual/concepts/interaction)  本章介绍如何自定义交互。 本章介绍如何自定义交互。
 
 ## 自定义交互
 
@@ -99,7 +99,7 @@ G2.registerInteraction('my-interaction', MyInteraction);
 其中：
 
 - trigger 触发一个交互环节的事件名，是所有 Chart 支持的事件
-- action 触发的反馈，可以是字符串也可以是数组，是所有内置和用户自定义的 Action，参考 [交互反馈 Action 列表](../tutorial/interaction/#交互反馈-action-列表) 。
+- action 触发的反馈，可以是字符串也可以是数组，是所有内置和用户自定义的 Action，参考 [交互反馈 Action 列表](../../manual/concepts/interaction#交互反馈-action-列表) 。
   - 字符串由 ’actionName:method‘ 组成
   - 列表时可以使用相同的 action ，也可以使用不同的 action ，例如: ['element-active:clear', 'element-active:active', 'mask:clear']
 
@@ -260,7 +260,7 @@ export interface IInteractionContext extends LooseObject {
 
 ## 自定义 Action
 
-使用交互语法搭配交互时，需要使用到 Action，你可以从 G2 已经内置的 [Action 列表](../tutorial/interaction/#交互反馈-action-列表)  中选取，也可以选择自定义 Action。<br />自定义 Action 有两个步骤：
+使用交互语法搭配交互时，需要使用到 Action，你可以从 G2 已经内置的 [Action 列表](../../manual/concepts/interaction#交互反馈-action-列表)  中选取，也可以选择自定义 Action。<br />自定义 Action 有两个步骤：
 
 - 实现 Action 的继承类
 - 注册 Action

docs/api/advanced/registershape.en.md → docs/api/advanced/register-shape.en.md

@@ -61,7 +61,7 @@ registerShape('interval', 'line', {
 });
 ```
 
-<!-- 更详细的使用说明详见： [Shape API](../../api/register#g2registershape)。 -->
+<!-- 更详细的使用说明详见： [Shape API](../../api/register#g2register-shape)。 -->
 
 ## 快速上手
 

docs/api/advanced/registershape.zh.md → docs/api/advanced/register-shape.zh.md

@@ -61,7 +61,7 @@ registerShape('interval', 'line', {
 });
 ```
 
-<!-- 更详细的使用说明详见： [Shape API](../../api/register#g2registershape)。 -->
+<!-- 更详细的使用说明详见： [Shape API](../../api/register#g2register-shape)。 -->
 
 ## 快速上手
 

docs/api/general/axis.zh.md

@@ -127,7 +127,9 @@ _GridLineCfg_ 配置如下：
 
 <description> _ComponentAnimateOption_ **optional** </description>
 
-动画参数配置，当且仅当 animate 属性为 true，即动画开启时生效。动画配置详情点击 [ComponentAnimateOption](animate-option) 查看。
+动画参数配置，当且仅当 animate 属性为 true，即动画开启时生效。。动画配置详情如下：
+
+`markdown:docs/common/component-animate-option.md`
 
 ### AxisOption.verticalFactor
 

docs/api/general/facet.en.md

@@ -3,172 +3,4 @@ title: 绘制分面
 order: 16
 ---
 
-分面，将一份数据按照某个维度分隔成若干子集，然后创建一个图表的矩阵，将每一个数据子集绘制到图形矩阵的窗格中。
-
-总结起来，分面其实提供了两个功能：
-
-1. 按照指定的维度划分数据集；
-1. 对图表进行排版。
-
-对于探索型数据分析来说，分面是一个强大有力的工具，能帮你迅速地分析出数据各个子集模式的异同。
-
-![image.png](https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*jfcgTIqwceMAAAAAAAAAAABkARQnAQ)
-
-## 如何设置分面
-
-```typescript
-chart.facet(type, {
-  fileds: ['field1', 'field2'],
-  showTitle: true, // 显示标题
-  padding: 10, // 每个分面之间的间距
-  /**
-   * 创建每个分面中的视图
-   * @param view  视图对象
-   * @param facet facet中有行列等信息
-   * @return {null}
-   */
-  eachView(view, facet) {},
-});
-```
-
-说明：
-
-- 第一个参数 `type` 用于指定分面的类型；
-- `fileds` 属性用于指定数据集划分依据的字段；
-- `eachView` 回调函数中创建各个视图的图表类型；
-
-更多配置信息，请查阅 [Facet API](../../api/classes/view#facet)。
-
-## 分面的类型
-
-G2 支持的分面类型如下表所示：
-
-| **分面类型** |                       **说明**                        |
-| :----------: | :---------------------------------------------------: |
-|     rect     | **默认类型**，指定 2 个维度作为行列，形成图表的矩阵。 |
-|     list     |   指定一个维度，可以指定一行有几列，超出自动换行。    |
-|    circle    |              指定一个维度，沿着圆分布。               |
-|     tree     |  指定多个维度，每个维度作为树的一级，展开多层图表。   |
-|    mirror    |             指定一个维度，形成镜像图表。              |
-|    matrix    |             指定一个维度，形成矩阵分面。              |
-
-### rect 矩形分面
-
-rect 矩形分面是 G2 的默认分面类型。支持按照一个或者两个维度的数据划分，按照**先列后行**的顺序。
-
-![image.png](https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*cftuR74YgKIAAAAAAAAAAABkARQnAQ)
-
-实例链接：[https://g2.antv.vision/zh/examples/facet/facet#rect](https://g2.antv.vision/zh/examples/facet/facet#rect)
-
-```typescript
-chart.facet('rect', {
-  fields: ['cut', 'clarity'],
-  eachView(view) {
-    view.point().position('carat*price').color('cut').shape('circle').style({ opacity: 0.3 }).size(3);
-  },
-});
-```
-
-矩阵分面以  `cut` 字段划分列，以  `clarity` 字段划分行。
-
-另外可以  `fields` 字段中设置字段名时，将行或者列值设置为 `null`, 就可以变成单行或者单列的分面。
-
-### list 水平列表分面
-
-该类型分面可以通过设置 `cols` 属性来指定每行可显示分面的个数，超出时会自动换行。
-
-![image.png](https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*qH7ET72t5jAAAAAAAAAAAABkARQnAQ)
-
-实例链接：[https://g2.antv.vision/zh/examples/facet/facet#list](https://g2.antv.vision/zh/examples/facet/facet#list)
-
-```typescript
-chart.facet('list', {
-  fields: ['cut'],
-  cols: 3, // 超过3个换行
-  padding: 30,
-  eachView(view) {
-    view.point().position('carat*price').color('cut').shape('circle').style({ opacity: 0.3 }).size(3);
-  },
-});
-```
-
-### circle 圆形分面
-
-![image.png](https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*Kl8tQaFjFI4AAAAAAAAAAABkARQnAQ)
-
-实例链接：[https://g2.antv.vision/zh/examples/facet/facet#circle](https://g2.antv.vision/zh/examples/facet/facet#circle)
-
-```typescript
-chart.facet('circle', {
-  fields: ['clarity'],
-  eachView(view, facet) {
-    view.interval().position('cut*mean').color('cut');
-  },
-});
-```
-
-### tree 树形分面
-
-树形分面一般用于展示存在层次结构的数据，展示的是整体和部分之间的关系。
-
-G2 提供了 `line` 和 `lineSmooth` 两个属性，用于配置连接各个分面的线的样式，其中：
-
-- line，用于配置线的显示属性。
-- lineSmooth，各个树节点的连接线是否是平滑的曲线，默认为 false。
-
-下图展示了树形多层级的分面。
-
-![image.png](https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*q6IwR4jn6aIAAAAAAAAAAABkARQnAQ)
-
-实例链接：[https://g2.antv.vision/zh/examples/facet/facet#tree-column](https://g2.antv.vision/zh/examples/facet/facet#tree-column)
-
-```typescript
-chart.facet('tree', {
-  fields: ['grade', 'class'],
-  line: {
-    style: {
-      stroke: '#00a3d7',
-    },
-    smooth: true,
-  },
-  eachView(view, facet) {
-    view.interval().position('percent').color('gender').adjust('stack');
-  },
-});
-```
-
-### mirror 镜像分面
-
-镜像分面一般用于对比两类数据的场景，例如男女的比例、正确错误的对比等。
-
-通过配置 `transpose` 属性为 true，可以将镜像分面翻转。
-
-![image.png](https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*eqpJTYX-sJ8AAAAAAAAAAABkARQnAQ)
-
-实例链接：[https://g2.antv.vision/zh/examples/facet/facet#mirror-transpose](https://g2.antv.vision/zh/examples/facet/facet#mirror-transpose)
-
-```typescript
-chart.facet('mirror', {
-  fields: ['gender'],
-  transpose: true,
-  padding: [0, 48, 0, 0],
-  eachView(view) {
-    view.interval().position('age*total_percentage').color('gender', ['#1890ff', '#f04864']);
-  },
-});
-```
-
-### matrix 矩阵分面
-
-矩阵分面主要对比数据中多个字段之间的关系，例如常见的散点矩阵图。
-
-![image.png](https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*VAM8TapI9UMAAAAAAAAAAABkARQnAQ)
-
-实例链接：[https://g2.antv.vision/zh/examples/facet/facet#matrix](https://g2.antv.vision/zh/examples/facet/facet#matrix)
-
-```typescript
-chart.facet('matrix', {
-  fields: ['SepalLength', 'SepalWidth', 'PetalLength', 'PetalWidth'],
-  eachView(view, facet) {},
-});
-```
+`markdown:docs/api/general/facet.zh.md`

docs/api/general/interaction.en.md

@@ -1001,4 +1001,4 @@ registerInteraction('element-brush', {
 
 ## 更多
 
-本文中仅介绍了如何使用交互，而所有交互都是通过交互语法搭配而成的，需要自定义交互的用户可以参考 [交互语法](../concepts/interaction)  和 [自定义交互](../developer/registerinteraction)。
+本文中仅介绍了如何使用交互，而所有交互都是通过交互语法搭配而成的，需要自定义交互的用户可以参考 [交互语法](../concepts/interaction)  和 [自定义交互](../developer/register-interaction)。

docs/api/general/legend.zh.md

@@ -139,7 +139,9 @@ _legendOption_ 配置如下：
 
 <description> _ComponentAnimateOption_ **optional** </description>
 
-动画参数配置，当且仅当 animate 属性为 true，即动画开启时生效。动画配置详情点击 [ComponentAnimateOption](animate-option) 查看。
+动画参数配置，当且仅当 animate 属性为 true，即动画开启时生效。动画配置详情如下：
+
+`markdown:docs/common/component-animate-option.md`
 
 ### legendOption.label
 

docs/common/annotation-base-option.md

@@ -14,7 +14,9 @@
 
 <description> _ComponentAnimateOption_ **optional**</description>
 
-动画参数配置，当且仅当 `animate` 属性为 true，即动画开启时生效。动画配置详情点击 [ComponentAnimateOption](animate-option) 查看。
+动画参数配置，当且仅当 `animate` 属性为 true，即动画开启时生效。动画配置：
+
+`markdown:docs/common/component-animate-option.md`
 
 #### option.offsetX
 

docs/manual/concepts/component/annotation.en.md

@@ -26,14 +26,14 @@ G2 提供了丰富的图形标注类型：
 
 各个标注类型的详细配置详见 API：
 
-- `chart.annotation().arc(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationarcoption)。
-- `chart.annotation().line(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationlineoption)。
-- `chart.annotation().text(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationtextoption)。
-- `chart.annotation().image(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationimageoption)。
-- `chart.annotation().region(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationregionoption)。
-- `chart.annotation().dataMarker(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationdatamarkeroption)。
-- `chart.annotation().dataRegion(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationdataregionoption)。
-- `chart.annotation().regionFilter(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationregionfilteroption)。
+- `chart.annotation().arc(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationarcoption)。
+- `chart.annotation().line(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationlineoption)。
+- `chart.annotation().text(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationtextoption)。
+- `chart.annotation().image(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationimageoption)。
+- `chart.annotation().region(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationregionoption)。
+- `chart.annotation().dataMarker(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationdatamarkeroption)。
+- `chart.annotation().dataRegion(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationdataregionoption)。
+- `chart.annotation().regionFilter(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationregionfilteroption)。
 
 ## 清空图形标注
 

docs/manual/concepts/component/annotation.zh.md

@@ -26,14 +26,14 @@ G2 提供了丰富的图形标注类型：
 
 各个标注类型的详细配置详见 API：
 
-- `chart.annotation().arc(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationarcoption)。
-- `chart.annotation().line(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationlineoption)。
-- `chart.annotation().text(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationtextoption)。
-- `chart.annotation().image(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationimageoption)。
-- `chart.annotation().region(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationregionoption)。
-- `chart.annotation().dataMarker(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationdatamarkeroption)。
-- `chart.annotation().dataRegion(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationdataregionoption)。
-- `chart.annotation().regionFilter(cfg)`: cfg 配置详见 [API](../../api/annotation#chartannotationregionfilteroption)。
+- `chart.annotation().arc(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationarcoption)。
+- `chart.annotation().line(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationlineoption)。
+- `chart.annotation().text(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationtextoption)。
+- `chart.annotation().image(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationimageoption)。
+- `chart.annotation().region(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationregionoption)。
+- `chart.annotation().dataMarker(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationdatamarkeroption)。
+- `chart.annotation().dataRegion(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationdataregionoption)。
+- `chart.annotation().regionFilter(cfg)`: cfg 配置详见 [API](../../../api/general/annotation#chartannotationregionfilteroption)。
 
 ## 清空图形标注
 

docs/manual/concepts/component/axis.en.md

@@ -23,7 +23,7 @@ G2 提供了坐标轴的配置接口，主要用于坐标轴样式的配置：
 chart.axis();
 ```
 
-关于该接口的详细使用，可以阅读相关的 [API](../../api/axis) 文档，下面主要向大家介绍关于坐标轴内容的配置方法。
+关于该接口的详细使用，可以阅读相关的 [API](../../../api/general/axis) 文档，下面主要向大家介绍关于坐标轴内容的配置方法。
 
 ### title 配置
 

docs/manual/concepts/component/axis.zh.md

@@ -23,7 +23,7 @@ G2 提供了坐标轴的配置接口，主要用于坐标轴样式的配置：
 chart.axis();
 ```
 
-关于该接口的详细使用，可以阅读相关的 [API](../../api/axis) 文档，下面主要向大家介绍关于坐标轴内容的配置方法。
+关于该接口的详细使用，可以阅读相关的 [API](../../../api/general/axis) 文档，下面主要向大家介绍关于坐标轴内容的配置方法。
 
 ### title 配置
 

docs/manual/concepts/component/label.en.md

@@ -17,7 +17,7 @@ order: 4
 geometry.label();
 ```
 
-关于该接口的详细使用以及属性配置，可以翻阅 [API 文档](../../api/label)。
+关于该接口的详细使用以及属性配置，可以翻阅 [API 文档](../../../api/general/label)。
 
 下面以折线图文本标签为例，我们想要在折线上显示 'value' 字段的值，我们只需要添加如下声明：
 
@@ -113,4 +113,4 @@ chart
   });
 ```
 
-对于文本布局，有多种解决方案，为了更大的灵活，G2 提供了自定义 label 布局的机制，用户可以根据需求自定义 label 布局，具体使用请阅读[自定义 label 布局](../developer/registerlabel/#自定义-label-布局函数)。
+对于文本布局，有多种解决方案，为了更大的灵活，G2 提供了自定义 label 布局的机制，用户可以根据需求自定义 label 布局，具体使用请阅读[自定义 label 布局](../developer/register-label/#自定义-label-布局函数)。