feat:add some docs

antvis · Jan 27, 2021 · 1ac6a92 · 1ac6a92
1 parent 4dd0d1c
commit 1ac6a92
Show file tree

Hide file tree

Showing 7 changed files with 306 additions and 0 deletions.
diff --git a/packages/graphin/docs/Contributing.zh-CN.md b/packages/graphin/docs/Contributing.zh-CN.md
@@ -0,0 +1,79 @@
+---
+title: 贡献指南
+group:
+  path: /
+nav:
+  path: /graphin
+---
+
+> 本指南参考自 [Ant Design](https://ant.design/docs/react/contributing-cn)
+
+这篇指南会指导你如何为 Graphin 贡献一份自己的力量，请在你要提 issue 或者 pull request 之前花几分钟来阅读一遍这篇指南。
+
+## 行为准则
+
+我们有一份[行为准则](https://github.com/antvis/graphin/blob/develop/CODE_OF_CONDUCT.md)，希望所有的贡献者都能遵守，请花时间阅读一遍全文以确保你能明白哪些是可以做的，哪些是不可以做的。
+
+## 透明的开发
+
+我们所有的工作都会放在 GitHub 上。不管是核心团队的成员还是外部贡献者的 pull request 都需要经过同样流程的 review。
+
+## 分支管理
+
+基于我们的 发布周期，我们长期维护两个分支 master 和 feature。如果你要修一个 bug，那么请发 pull request 到 master；如果你要提一个增加新功能的 pull request，那么请基于 feature 分支来做。
+
+## Bugs
+
+我们使用 GitHub Issues 来做 bug 追踪。 如果你想要你发现的 bug 被快速解决，最好的办法就是通过我们提供的 [issue 模板](https://github.com/antvis/graphin/issues/new?assignees=&labels=&template=bug_report.md&title=) 来提 issue。并且能使用这个 Code Sandbox [模板](https://codesandbox.io/s/data-driven-3o71b) 来提供重现。
+
+在你报告一个 bug 之前，请先确保已经搜索过已有的 issue 和阅读了我们的 常见问题。
+
+## 新增功能
+
+如果你有改进我们的 API 或者新增功能的想法，我们同样推荐你使用我们提供的 [issue 模板](https://github.com/antvis/graphin/issues/new?assignees=&labels=&template=feature_request.md&title=) 来新建一个添加新功能的 issue。
+
+## 第一次贡献
+
+如果你还不清楚怎么在 GitHub 上提 Pull Request ，可以阅读下面这篇文章来学习：
+
+[如何优雅地在 GitHub 上贡献代码](https://segmentfault.com/a/1190000000736629)
+
+为了能帮助你开始你的第一次尝试，我们用 [good first issues](https://github.com/antvis/graphin/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22) 标记了一些比较比较容易修复的 bug 和小功能。这些 issue 可以很好地做为你的首次尝试。
+
+如果你打算开始处理一个 issue，请先检查一下 issue 下面的留言以确保没有别人正在处理这个 issue。如果当前没有人在处理的话你可以留言告知其他人你将会处理这个 issue，以免别人重复劳动。
+
+如果之前有人留言说会处理这个 issue 但是一两个星期都没有动静，那么你也可以接手处理这个 issue，当然还是需要留言告知其他人。
+
+## Pull Request
+
+Graphin 团队会关注所有的 pull request，我们会 review 以及合并你的代码，也有可能要求你做一些修改或者告诉你我们为什么不能接受这样的修改。
+
+在你发送 Pull Request 之前，请确认你是按照下面的步骤来做的：
+
+基于 [正确的分支](/zh/docs/manual/Contributing#分支管理) 做修改。
+
+在项目根目录下运行了 npm install 和 npm run bootstrap。
+
+如果你修复了一个 bug 或者新增了一个功能，请确保写了相应的测试，这很重要。
+
+确认所有的测试都是通过 npm run test 来运行的。
+
+运行 npm test -- -u 来更新 jest snapshot 并且把这些更新也提交上来（如果有的话）。
+
+确保你的代码通过了 lint 检查 npm run lint. 小贴士: Lint 会在你 git commit 的时候自动运行（通过 Git Hooks）。
+
+给 Graphin 发送 pull request：
+
+### 开发流程
+
+在你 clone 了 Graphin 的代码并且使用 npm install 和 npm run bootstrap 安装完依赖后，你还可以运行下面几个常用的命令：
+
+npm run start 在本地运行 Graphin 和 Graphin Components 的构建
+
+npm run studio 在本地运行 Graphin Studio 的网站。
+
+npm run lint 检查代码风格。
+
+npm run test 运行测试。
+
+npm run build 编译 Graphin 和 Graphin Components 代码到 dist 目录。
diff --git a/packages/graphin/docs/FAQ.en-US.md b/packages/graphin/docs/FAQ.en-US.md
@@ -0,0 +1,27 @@
+---
+title: FAQ
+group:
+  path: /
+nav:
+  path: /graphin
+---
+
+### 01. What is the relationship between Graphin and G6?
+
+It's important to understand the relationship between Graphin and G6. Although Graphin is a React component library based on G6, this is just a technical implementation, not its positioning. G6 is an analysis engine for graph analysis and graph visualization. In the field of analysis, G6 can be used for relationshp visual analysis and flow visual analysis. Graphin is only a solution in the field of relational visual analysis, as shown in the following figure. Show:
+
+<img  src='https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*CkJcSqfJJiQAAAAAAAAAAABkARQnAQ' width="100%"/>
+
+- Project plan: There is a learning cost to use G6. Graphin provides a set of engineering solutions: rendering, interaction, layout and encapsulates capability of G6's API.
+
+- Product Capability: Graphin has a heart that wants to make products. After open source, We will continue to improve Graphin in all aspects. We plan to add Map Mode, Timebar and other advanced analysis methods.
+
+- Easy to use: Graph visualization is a complex concept. Graphin removes some graph visualization concepts of G6. Botn interaction and layout are encapsulated inside GraphinYou and You can register nodeShape by JSON schema. Graphin is just a React component for users.
+
+### 02. What is the future plan of Graphin?
+
+Before answering this question, we have to talk about where Graphin comes from.
+
+Graphin was born in a graph analysis business team. The first version was developed using cytoscape.js. With the development of business, there are more customized needs, so we switched the engine to G6 and worked closely with the developers of G6 to slowly integrate into the entire AntV system. These parts with tick markers of the mind map are features that Graphin has already done.
+
+<img src='https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*UKJkQYwpyu0AAAAAAAAAAABkARQnAQ' width='100%'/>
diff --git a/packages/graphin/docs/FAQ.zh-CN.md b/packages/graphin/docs/FAQ.zh-CN.md
@@ -0,0 +1,27 @@
+---
+title: FAQ
+group:
+  path: /
+nav:
+  path: /graphin
+---
+
+### 01. Graphin 与 G6 的关系是什么？
+
+搞懂 Graphin 与 G6 的关系非常重要，虽然 Graphin 是基于 G6 封装的 React 组件库，这只是它的技术实现，并不是它的定位。G6 是图分析与图可视化的分析引擎，在分析领域，可以使用 G6 做关系可视分析，也可以使用 G6 做流量可视分析，Graphin 只是一个在关系可视分析领域的解决方案，如下图所示：
+
+<img  src='https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*CkJcSqfJJiQAAAAAAAAAAABkARQnAQ' width="100%"/>
+
+- 工程方案：G6 有一定的上手门槛，Graphin 提供了一套工程方案，渲染，交互，布局流程内置，与 React 框架整合，把 G6 能力封装聚合成 API。
+
+- 产品能力：Graphin 有一颗想做产品的心，开源后，我们将对标商业图分析工具 ReGraph 去打造，参考业界优秀图分析产品的功能特性，内置 布局切换，关系扩散，撤销重做等功能，未来计划新增 地图模式(Map Mode)，时序分析（Timebar），团伙导航等高级分析方法。
+
+- 简单易用：本身是一个比较复杂的概念，Graphin 屏蔽了 G6 的一些图可视化概念，注册节点也可以通过 JSON schema 去描述，交互，布局等概念都封装在 Graphin 内部，用户只需要像使用普通 React 组件一样去使用 Graphin 即可。
+
+### 02. Graphin 未来的计划是什么？
+
+回答 Graphin 未来去哪儿的问题，我们得先得回答 Graphin 从哪儿来的问题
+
+Graphin 诞生在一个图分析业务团队，第一版本还是使用 cytoscape.js 进行开发的。随着业务进入深水区，基于业务的定制越来越多，我们切换了引擎到 G6，与 G6 的开发者深入合作，慢慢地融入整个 AntV 体系。以下思维导图中 ✅ 部分是 Graphin 开源版本已经做到的功能
+
+<img src='https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*UKJkQYwpyu0AAAAAAAAAAABkARQnAQ' width='100%'/>
diff --git a/packages/graphin/docs/change-log.en-US.md b/packages/graphin/docs/change-log.en-US.md
@@ -0,0 +1,23 @@
+---
+title: ChangeLog
+group:
+  path: /
+nav:
+  path: /graphin
+---
+
+Graphic strictly follows [semantic versioning 2.0.0 semantic version Specification](http://semver.org/lang/zh-cn/).
+
+Release cycle
+
+- Revision number: Daily bugfix updates will be carried out at the end of each week. (if there is an urgent bugfix, it can be released at any time)
+
+- Minor version number: release a downward compatible version with new features every month.
+
+- Major version number: contains destructive updates and new features, not in the release cycle.
+
+## 1.0.0
+
+`2019-11-22`
+
+First release.
diff --git a/packages/graphin/docs/change-log.md b/packages/graphin/docs/change-log.md
@@ -0,0 +1,23 @@
+---
+title: 更新日志
+group:
+  path: /
+nav:
+  path: /graphin
+---
+
+Graphin 严格遵循 [Semantic Versioning 2.0.0 语义化版本规范](http://semver.org/lang/zh-CN/)。
+
+发布周期
+
+- 修订版本号：每周末会进行日常 bugfix 更新。（如果有紧急的 bugfix，则任何时候都可发布）
+
+- 次版本号：每月发布一个带有新特性的向下兼容的版本。
+
+- 主版本号：含有破坏性更新和新特性，不在发布周期内。
+
+## 1.0.0
+
+`2019-11-22`
+
+首次发布。
diff --git a/packages/graphin/docs/contributing.en-US.md b/packages/graphin/docs/contributing.en-US.md
@@ -0,0 +1,79 @@
+---
+title: Contribution Guide
+group:
+  path: /
+nav:
+  path: /graphin
+---
+
+> This guide is referenced from [Ant Design](https://ant.design/docs/react/contributing-cn)
+
+The following is a set of guidelines for contributing to Graphin. Please spend several minutes reading these guidelines before you create an issue or pull request.
+
+## Code of Conduct
+
+We have adopted a [Code of Conduct](https://github.com/antvis/graphin/blob/develop/CODE_OF_CONDUCT.md) that we expect project participants to adhere to. Please read the full text so that you can understand what actions will and will not be tolerated.
+
+## Open Development
+
+All work on Graphin happens directly on GitHub. Both core team members and external contributors send pull requests which go through the same review process.
+
+## Branch Organization
+
+According to our release schedule, we maintain two branches, master and feature. If you send a bugfix pull request, please do it against the master branch, if it's a feature pull request, please do it against the feature branch.
+
+## Bugs
+
+We are using GitHub Issues for bug tracking. The best way to get your bug fixed is using our [issue helper](https://github.com/antvis/graphin/issues/new?assignees=&labels=&template=bug_report.md&title=) and provide reproduction steps with this Code Sanbox [template](https://codesandbox.io/s/data-driven-3o71b).
+
+Before you report a bug, please make sure you've searched exists issues, and read our FAQ.
+
+## Proposing a Change
+
+If you intend to change the public API or introduce new feature, we also recommend you use our [issue template](https://github.com/antvis/graphin/issues/new?assignees=&labels=&template=feature_request.md&title=) to create a feature request issue.
+
+## Your First Pull Request
+
+Working on your first Pull Request? You can learn how from this free video series:
+
+[How to Contribute to an Open Source Project on GitHub](https://segmentfault.com/a/1190000000736629)
+
+To help you get your feet wet and get you familiar with our contribution process, we have a list of [good first issues](https://github.com/antvis/graphin/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22) that contain bugs or small features that have a relatively limited scope. This is a great place to get started.
+
+If you decide to fix an issue, please be sure to check the comment thread in case somebody is already working on a fix. If nobody is working on it at the moment, please leave a comment stating that you intend to work on it so other people don't accidentally duplicate your effort.
+
+If somebody claims an issue but doesn't follow up for more than two weeks, it's fine to take over it but you should still leave a comment.
+
+## Pull Request
+
+The core team is monitoring for pull requests. We will review your pull request and either merge it, request changes to it, or close it with an explanation.
+
+Before submitting a pull request, please make sure the following is done:
+
+Fork the repository and create your branch from the [correct branch](/en/docs/manual/contributing#Branch Organization).
+
+Run npm install in the repository root.
+
+If you've fixed a bug or added code that should be tested, add tests!
+
+Ensure the test suite passes (npm run test).
+
+Run npm test -- -u to update the jest snapshots and commit these changes as well (if there are any updates).
+
+Make sure your code lints (npm run lint). Tip: Lint runs automatically when you git commit (Use Git Hooks).
+
+Sending a Pull Request to Graphin:
+
+### Development Workflow
+
+After cloning Graphin, run npm install and npm run bootstrap to fetch its dependencies. Then, you can run several commands:
+
+npm run start runs Graphin and Graphin Components.
+
+npm run studio runs Graphin Studio locally.
+
+npm run lint checks the code style.
+
+npm run test runs the complete test suite.
+
+npm run build compiles Graphin and Graphin Components code to the dist directory.
diff --git a/packages/graphin/docs/index.en-US.md b/packages/graphin/docs/index.en-US.md
@@ -0,0 +1,48 @@
+---
+title: Graphin 2.0 - Graph Vis
+order: 10
+sidebar: false
+hero:
+  title: Graphin 2.0
+  desc: Graph Vis
+  actions:
+    - text: 快速开始 →
+      link: /graphin/quick-start
+
+features:
+  - icon: https://gw.alipayobjects.com/os/q/cms/images/k9ziitmp/13668549-b393-42a2-97c3-a6365ba87ac2_w96_h96.png
+    title: 开箱即用
+    desc: 内置图元素，交互，布局，组件，你要的基础图可视分析能力都在这里！
+  - icon: https://gw.alipayobjects.com/os/q/cms/images/k9ziik0f/487a2685-8f68-4c34-824f-e34c171d0dfd_w96_h96.png
+    title: 业务沉淀
+    desc: 关系扩散，子图布局，算法分析，优化策略，你所遇到的图产品需求都在这里！
+
+  - icon: https://gw.alipayobjects.com/os/q/cms/images/k9zij2bh/67f75d56-0d62-47d6-a8a5-dbd0cb79a401_w96_h96.png
+    title: 开发福音
+    desc: G6 + TypeScript + React，提供完整的类型定义文件，符合你的React开发体验
+
+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         | 高级分析组件 | 时间轴        | 帮助用户分析时序关系数据                             |