Skip to content

Commit

Permalink
docs: improve translation
Browse files Browse the repository at this point in the history
  • Loading branch information
timlrx committed Feb 24, 2021
2 parents 8854038 + c9eeead commit e1551ed
Show file tree
Hide file tree
Showing 13 changed files with 130 additions and 115 deletions.
2 changes: 1 addition & 1 deletion packages/graphin-icons/tsconfig.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"allowJs": true,
"allowJs": false,
"declaration": true,
"target": "es2015",
"moduleResolution": "node",
Expand Down
2 changes: 1 addition & 1 deletion packages/graphin-site/docs/manual/change-log.en.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: ChangeLog
title: Change Log
order: 9
icon: none
---
Expand Down
30 changes: 15 additions & 15 deletions packages/graphin-site/docs/manual/introduction.en.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@ icon: none

## Background

With the advent of the era of big data, data analysis is becoming more and more important for enterprises. Traditional OLAP chart analysis has already emerged in the business world to help companies make business decisions. This is known as "BI" (Business Intelligence). In recent years, 5G + IoT technology has been applied gradually, which will produce a new kind of data - associated data. Imagine, in your home, WiFi and 5G are connected to your refrigerator, air conditioner, washing machine, mobile phone and computer, and your social account is also connected to your mobile phone or computer. The future world must be a connected world, and we all live in a huge topology.
With the advent of the era of big data, data analysis is becoming more important for enterprises. Traditional OLAP chart analysis has already emerged in the business world to help companies make business decisions. This is known as "BI" (Business Intelligence). In recent years, 5G + IoT technology has been applied gradually, which will produce a new kind of data - associated data. Imagine, in your home, WiFi and 5G are connected to your refrigerator, air conditioner, washing machine, mobile phone and computer, and your social account is also connected to your mobile phone or computer. The future world must be a connected world, and we are all involves in this huge topology.

Therefore, how to process these relational data and analyze the data topology network becomes a challenge. The process of this analysis is also called Graph Analysis.
Therefore, the way to process these relational data and analyze the data topology network becomes a challenge. The process of this analysis is also known as Graph Analysis.

At present, graph analysis has been widely used in the fields of financial anti-fraud, public safety, infrastructure monitoring, and smart medical care. In this process, we need a powerful graph calculation engine to solve the problem of data compliance and collection. The corresponding graph algorithm is also needed to solve the graph construction and analysis. Finally, at front end, we need a graph visualization engine that provides us with visual analysis capabilities to discover potential value. Graphin was born in this context, its purpose is to visualize these relational data and analyze it.
At present, graph analysis has been widely used in the fields of financial anti-fraud, public safety, infrastructure monitoring, and smart medical care. In this process, we need a powerful graph calculation engine to solve the problem of data compliance and collection. The corresponding graph algorithm is also needed to solve the graph construction and analysis. Finally, at front end, we need a graph visualization engine that provides us with visual analysis capabilities to discover potential value. Graphin was born in this context, it serve a purpose to visualize these relational data and analyze it.

## Naming Origin

Expand All @@ -20,41 +20,41 @@ Graphin means Graph Insight (analysis of graphs). It is a library of React compo

Graph visualization can be layered into "graph analysis" and "graph editing" in the application field. The [background](#Background) above is actually about the graph analysis layer.

- Graph Analysis: layout analysis and visual exploration of the graph. Typical product: [cambridge-intelligence](https://cambridge-intelligence.com/), [TigerGraph](https://testdrive.tigergraph.com), [Linkurio](https://crunchbase.linkurio.us/demo/),[Gephi](https://gephi.org/), [Palantir](https://www.palantir.com/), [Neo4j](https://neo4j.com/product/).
- Graph Editing: editing, wiring, process management of the graph. Typical product: [draw.io](https://www.draw.io/), [mxGraph](https://github.com/jgraph/mxgraph), [ggEditor](http://ggeditor.com/).
- Graph Analysis: layout analysis and visual exploration of the graph. Representative products are: [cambridge-intelligence](https://cambridge-intelligence.com/), [TigerGraph](https://testdrive.tigergraph.com), [Linkurio](https://crunchbase.linkurio.us/demo/),[Gephi](https://gephi.org/), [Palantir](https://www.palantir.com/), [Neo4j](https://neo4j.com/product/).
- Graph Editing: editing, wiring, process management of the graph. Representative products are: [draw.io](https://www.draw.io/), [mxGraph](https://github.com/jgraph/mxgraph), [ggEditor](http://ggeditor.com/).

Graphin is based on [G6](https://g6.antv.vision/) + React. G6 was a graphical visualization rendering engine before v3.1. It supports both graph analysis and graph editing. Starting from v3.1, G6 concentrates on graph analysis and hand over graph editing to X6. Graphin use React's powerful component ecosystem and simple and declarative programming model to greatly reduce user's learning cost.
Graphin is based on [G6](https://g6.antv.vision/) + React. G6 was a graphical visualization rendering engine before v3.1. It supports both graph analysis and graph editing. Starting from v3.1, G6 concentrates on graph analysis and hand over graph editing to X6. Graphin utilise React's powerful component ecosystem with simple and declarative programming concepts to greatly reduce user's learning curve.

## Targeted Product

Graphin benchmarks [ReGraph](https://cambridge-intelligence.com/regraph/) on product capabilities, and hopes to serve many graph analysis areas such as relationship analysis, knowledge graph, financial anti-fraud, logistics security, and infrastructure monitoring.
Graphin benchmarks [ReGraph](https://cambridge-intelligence.com/regraph/) on product capabilities, and hopes to serve many graph analysis fields such as relationship analysis, knowledge graph, financial anti-fraud, logistics security, and infrastructure monitoring.

## Open Sourcing Motivation

- **Improve efficiency**: Graph is a complex concept with high learning cost. G6 is a library of graph visualization and graph analysis. It's flexible, but it also means the lack of best practices. What can G6 do? Many people are actually not clear. Graphin hopes to add engineering best practice to G6 to improve developer productivity.
- **Improve efficiency**: Graph is a complex concept with high learning curve for a novice. People might not aware of the simplicity and convenience of using G6 in build up graph visualization and graph analysis application. Graphin hopes to extends the engineering best practice and the feature of G6 to improve developer productivity in development.

- **Throw away a brick**: Graphin is just a starter in the field of graph analysis. There are many excellent products before Graphin which did a very good job in product experience and analysis, but none of them was open source and many products do not sell to China. Graphin hopes to attract more people to explore in this field through open source co-operation.
- **Attract Feedbacks**: Graphin is a novice in graph analysis field. There are numerous excellent experience and analysis products are born before Graphin. However, none of them are open-sources and collaborate in China. Therefore, Graphin hopes to attract more interest and feedbacks from professional with common interest to explore in this field through open source co-operation.

## Functional Characteristics

### 01. Data Driven

Take advantage of React declarative UI features to map data to canvas rendering result.
Take advantage of React declarative UI features to achieves map data to canvas rendering.

- Incremental data addition: Graphin adds data dynamically according to the pre-layout to achieve node diffusion, relationship discovery and other effects.
- Full data rendering: Graphin supports full data rendering to meet the requirements of saving, importing, exporting, etc.
- Incremental data addition: Graphin adds data dynamically according to the pre-layout to achieve node diffusion, relationship discovery and other effects.
- Full data rendering: Graphin supports full data rendering to meet the requirements of saving, importing, exporting, etc.

<img style='width:100%;box-shadow: 0 2px 8px #f0f1f2;padding:40px;' src = 'https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*PM7yTr_-O0gAAAAAAAAAAABkARQnAQ'/>

### 02. Layout Switching

Graphin has some built-in layouts that supports auto layout and layout switching to meet the layout needs of different scenarios.
Graphin possess built-in layouts that supports auto layout and manual layout switching to meet the needs of different scenarios.

<img style='width:100%;box-shadow: 0 2px 8px #f0f1f2;padding:40px;' src = 'https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*U9XMRbsTTA8AAAAAAAAAAABkARQnAQ'/>

### 03. Analysis Component

The data analysis process is a dynamic interactive process. There is no exception for graph analysis. So we need some analysis components to help us. There are two built-in components in Graphin: Toobar and ContextMenu. MiniMap and ProptertiesFilter Component are coming soon.
Data analysis is a dynamic interactive process, same goes to graph analysis. Thus, we might rqeuire analysis components to assist us. There are two built-in components in Graphin: Toobar and ContextMenu. MiniMap and ProptertiesFilter Component are coming soon.

<img style='width:100%;box-shadow: 0 2px 8px #f0f1f2;padding:40px;' src = 'https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*aBjSTYyhsE8AAAAAAAAAAABkARQnAQ'/>

Expand All @@ -66,7 +66,7 @@ Graphin has a built-in style for node and edge. It also allows users to customiz

### 05. Basic Analysis

Support node diffusion, edge relationships finding and other basic analysis methods.
Support node diffusion, edge relationships finding and other basic analysis methods.

### 06. Advanced Analysis

Expand Down
10 changes: 8 additions & 2 deletions packages/graphin/docs/Contributing.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -66,9 +66,15 @@ npm run bootstrap

- 启动 graphin , graphin-components ,graphin-icons 的本地编译

可以分别 cd 到 pacakges 中的 graphin,graphin-componentsgraphin-icons 中启动各个 package.json 中的 script 命令`npm run start`.
`该项目根目录`启动 graphin, graphin-componentsgraphin-icons 的本地编译.

注意 ⚠️ 因为 packages 中各个包 存在依赖关系,比如 graphin-components 就依赖 graphin 的打包产物,且 打包启动的速度不一样,因此需要我们先把 graphin 包启动后,再启动 packages/graphin-components .启动完毕后,也可以在 vscode 中重启 ts 编译器,从而确保各个依赖关系 ts 可以推断找到
```bash
npm run graphin
npm run components
npm run icons
```

注意 ⚠️ 因为 packages 中各个包 存在依赖关系,比如 graphin-components 就依赖 graphin 的打包产物,且 打包启动的速度不一样,因此需要我们先把 packages/graphin 包启动后,再启动 packages/graphin-components .启动完毕后,也可以在 vscode 中重启 ts 编译器,从而确保各个依赖关系 ts 可以推断找到

```bash
npm run start
Expand Down
10 changes: 5 additions & 5 deletions packages/graphin/docs/FAQ.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,20 +10,20 @@ nav:

### 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:
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 instead of positioning. G6 is an analysis engine for graph analysis and graph visualization. In the field of analysis, G6 can be used for flow and relationship visual analysis. Graphin is only a solution in the field of relational visual analysis, as shown in the following figure:

<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.
- Project plan: There is a learning curve 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.
- Product Capability: Graphin helps to make products. After its open source, we will continue to improve Graphin in all aspects and 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.
- Easy to use: Graph visualization is a complex concept. Graphin removes several graph visualization concepts of G6. Both interaction and layout are encapsulated in Graphin and you can register nodeShape with JSON schema.

### 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.
Graphin was born from our graph analysis business team. The first version was developed using cytoscape.js. As more customized requirements and business needs arises, we decided to switch the engine to G6 and worked closely with the G6's developers to slowly integrate it into the entire AntV system. The mindmap below shows the currently completed features of Graphin.

<img src='https://gw.alipayobjects.com/mdn/rms_00edcb/afts/img/A*UKJkQYwpyu0AAAAAAAAAAABkARQnAQ' width='100%'/>
2 changes: 1 addition & 1 deletion packages/graphin/docs/change-log.en-US.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: ChangeLog
title: Change Log
order: 2
group:
path: /quick-start
Expand Down
Loading

0 comments on commit e1551ed

Please sign in to comment.