chore:adjust quick-start demos

packages/graphin/docs/Contributing.zh-CN.md

@@ -1,7 +1,8 @@
 ---
 title: 贡献指南
 group:
-  path: /
+  path: /quick-start
+  order: 0
 nav:
   path: /graphin
 ---

packages/graphin/docs/FAQ.en-US.md

@@ -1,7 +1,9 @@
 ---
 title: FAQ
+order: 2
 group:
-  path: /
+  path: /quick-start
+  order: 0
 nav:
   path: /graphin
 ---

packages/graphin/docs/FAQ.zh-CN.md

@@ -1,7 +1,9 @@
 ---
 title: FAQ
+order: 2
 group:
-  path: /
+  path: /quick-start
+  order: 0
 nav:
   path: /graphin
 ---

packages/graphin/docs/change-log.en-US.md

@@ -1,7 +1,9 @@
 ---
 title: ChangeLog
+order: 2
 group:
-  path: /
+  path: /quick-start
+  order: 0
 nav:
   path: /graphin
 ---

packages/graphin/docs/change-log.md

@@ -1,7 +1,9 @@
 ---
 title: 更新日志
+order: 2
 group:
-  path: /
+  path: /quick-start
+  order: 0
 nav:
   path: /graphin
 ---

packages/graphin/docs/contributing.en-US.md

@@ -1,7 +1,8 @@
 ---
 title: Contribution Guide
 group:
-  path: /
+  path: /quick-start
+  order: 0
 nav:
   path: /graphin
 ---

packages/graphin/docs/index.en-US.md

@@ -3,8 +3,8 @@ title: Graphin 2.0 - Graph Vis
 order: 10
 sidebar: false
 hero:
-  title: Graphin 2.0
-  desc: Graph Vis
+  title: Graphin 图的分析洞察
+  desc: Graphin 取名意为 Graph Insight（图的分析洞察），是一个基于 G6 封装的 React 组件库，专注在关系可视分析领域，简单高效，开箱即用。
   actions:
     - text: 快速开始 →
       link: /graphin/quick-start
@@ -23,26 +23,3 @@ features:
 
 footer: Open-source MIT Licensed | Copyright © 2019-present
 ---
-
-## 组件看板
-
-| 组件            | 分类         | 名称          | 说明                                                 |
-| --------------- | ------------ | ------------- | ---------------------------------------------------- |
-| Graphin         | 核心组件     | @antv/graphin | 负责数据驱动整个画布：配置，布局，渲染，交互         |
-| ContextMenu     | 交互组件     | 右键菜单      | 帮助用户进行节点或边操作：打标，扩散，发现           |
-| Tooltip         | 交互组件     | 提示框        | 帮助用户快速浏览节点或边的信息                       |
-| MiniMap         | 交互组件     | 小地图        | 帮助用户进行全局导航                                 |
-| Toolbar         | 交互组件     | 工具栏        | 帮助用户进行画布操作：缩小，放大，全屏               |
-| RedoUndo        | 交互组件     | 撤销回退      | 帮助用户进行全局导航                                 |
-| FishEye         | 交互组件     | 鱼眼放大镜    | 帮助用户进行查看细节                                 |
-| CreateEdge      | 交互组件     | 边建联组件    | 帮助用户进行关系建联                                 |
-| Legend          | 标示组件     | 图例          | 帮助用户进行节点和边的类型标示：颜色，大小，属性     |
-| Hull            | 标示组件     | 轮廓          | 帮助用户进行节点归类示                               |
-| Statistic       | 标示组件     | 统计面板      | 帮助用户进行画布状态的监控标示                       |
-| SnapshotGallery | 分析配套组件 | 快照画廊      | 提供快照保存复现功能，帮助用户分析过程不中断         |
-| LayoutSelector  | 分析配套组件 | 布局切换器    | 帮助用户切换布局，自主调节参数，从而达到最佳布局效果 |
-| Sheetbar        | 分析配套组件 | 多画布组件    | 帮助用户二次分析，多画布管理                         |
-| TableMode       | 分析配套组件 | 表格模式      | 帮助通过表格查看关系源数据                           |
-| FindPathPanel   | 算法分析组件 | 寻找路径      | 帮助用户计算两个节点间的最短路径和可能路径列表       |
-| MapMode         | 高级分析组件 | 地图模式      | 帮助用户分析地理关系数据                             |
-| Timebar         | 高级分析组件 | 时间轴        | 帮助用户分析时序关系数据                             |

packages/graphin/docs/index.md

@@ -2,47 +2,35 @@
 title: Graphin 2.0 - 图可视分析解决方案
 order: 10
 sidebar: false
-hero:
-  title: Graphin 2.0
-  desc: 图可视分析解决方案
+banner:
+  title: Graphin 图的分析洞察
+  desc: Graphin 取名意为 Graph Insight（图的分析洞察），是一个基于 G6 封装的 React 组件库，专注在关系可视分析领域，简单高效，开箱即用。
+  image: https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*Gix7Rry3-5wAAAAAAAAAAABkARQnAQ
   actions:
     - text: 快速开始 →
-      link: /graphin/quick-start
-
-features:
+      link: /graphin/quick-start/overview
+      type: primary
+ideas:
   - icon: https://gw.alipayobjects.com/os/q/cms/images/k9ziitmp/13668549-b393-42a2-97c3-a6365ba87ac2_w96_h96.png
     title: 开箱即用
-    desc: 内置图元素，交互，布局，组件，你要的基础图可视分析能力都在这里！
+    description: 内置图元素，交互，布局，组件，你要的基础图可视分析能力都在这里！
   - icon: https://gw.alipayobjects.com/os/q/cms/images/k9ziik0f/487a2685-8f68-4c34-824f-e34c171d0dfd_w96_h96.png
     title: 业务沉淀
-    desc: 关系扩散，子图布局，算法分析，优化策略，你所遇到的图产品需求都在这里！
+    description: 关系扩散，子图布局，算法分析，优化策略，你所遇到的图产品需求都在这里！
 
   - icon: https://gw.alipayobjects.com/os/q/cms/images/k9zij2bh/67f75d56-0d62-47d6-a8a5-dbd0cb79a401_w96_h96.png
     title: 开发福音
-    desc: G6 + TypeScript + React，提供完整的类型定义文件，符合你的React开发体验
+    description: G6 + TypeScript + React，提供完整的类型定义文件，符合你的React开发体验
+
+cases:
+  - logo: 'https://img.alicdn.com/tfs/TB1rh1xy7T2gK0jSZFkXXcIQFXa-128-128.svg'
+    title: Graph Studio
+    description: Graph Studio 是阿里云Dataworks团队围绕Graph Compute引擎打造的一站式图开发平台。其中基于Graphin开发的图分析平台提供了数据检索、关系扩散、布局切换、节点筛选、关联高亮、分享等常用图分析能力，能够帮助用户快速完成相关分析工作
+    image: https://img.alicdn.com/tfs/TB1laWQyVT7gK0jSZFpXXaTkpXa-600-600.gif
+  - logo: 'https://img.alicdn.com/tfs/TB1rh1xy7T2gK0jSZFkXXcIQFXa-128-128.svg'
+    title: Graph Studio
+    description: Graph Studio 是阿里云Dataworks团队围绕Graph Compute引擎打造的一站式图开发平台。其中基于Graphin开发的图分析平台提供了数据检索、关系扩散、布局切换、节点筛选、关联高亮、分享等常用图分析能力，能够帮助用户快速完成相关分析工作
+    image: https://gw.alipayobjects.com/mdn/rms_402c1a/afts/img/A*6MMpR60-2VoAAAAAAAAAAAAAARQnAQ
 
 footer: Open-source MIT Licensed | Copyright © 2019-present
 ---
-
-## 组件看板
-
-| 组件            | 分类         | 名称          | 说明                                                 |
-| --------------- | ------------ | ------------- | ---------------------------------------------------- |
-| Graphin         | 核心组件     | @antv/graphin | 负责数据驱动整个画布：配置，布局，渲染，交互         |
-| ContextMenu     | 交互组件     | 右键菜单      | 帮助用户进行节点或边操作：打标，扩散，发现           |
-| Tooltip         | 交互组件     | 提示框        | 帮助用户快速浏览节点或边的信息                       |
-| MiniMap         | 交互组件     | 小地图        | 帮助用户进行全局导航                                 |
-| Toolbar         | 交互组件     | 工具栏        | 帮助用户进行画布操作：缩小，放大，全屏               |
-| RedoUndo        | 交互组件     | 撤销回退      | 帮助用户进行全局导航                                 |
-| FishEye         | 交互组件     | 鱼眼放大镜    | 帮助用户进行查看细节                                 |
-| CreateEdge      | 交互组件     | 边建联组件    | 帮助用户进行关系建联                                 |
-| Legend          | 标示组件     | 图例          | 帮助用户进行节点和边的类型标示：颜色，大小，属性     |
-| Hull            | 标示组件     | 轮廓          | 帮助用户进行节点归类示                               |
-| Statistic       | 标示组件     | 统计面板      | 帮助用户进行画布状态的监控标示                       |
-| SnapshotGallery | 分析配套组件 | 快照画廊      | 提供快照保存复现功能，帮助用户分析过程不中断         |
-| LayoutSelector  | 分析配套组件 | 布局切换器    | 帮助用户切换布局，自主调节参数，从而达到最佳布局效果 |
-| Sheetbar        | 分析配套组件 | 多画布组件    | 帮助用户二次分析，多画布管理                         |
-| TableMode       | 分析配套组件 | 表格模式      | 帮助通过表格查看关系源数据                           |
-| FindPathPanel   | 算法分析组件 | 寻找路径      | 帮助用户计算两个节点间的最短路径和可能路径列表       |
-| MapMode         | 高级分析组件 | 地图模式      | 帮助用户分析地理关系数据                             |
-| Timebar         | 高级分析组件 | 时间轴        | 帮助用户分析时序关系数据                             |

packages/graphin/docs/quick-start/demos/node.tsx

@@ -42,7 +42,7 @@ const data = {
           fontFamily: 'normal',
           textAlign: 'center',
           /** 文本在各自方向上的偏移量，主要为了便于调整文本位置 */
-          offset: 0,
+          offset: [0, 10],
         },
         // // 是节点的中心 ICON 区域，icon 可以是图片，可以是文本，也可以是字体图标。
         icon: {

packages/graphin/docs/quick-start/index.md

@@ -1,6 +1,6 @@
 ---
 title: 快速开始
-order: 0
+order: 1
 group:
   path: /quick-start
   title: 快速开始