English | 简体中文
Graphin
Graphin means Graph Insight (analysis of graphs). It is a library based on G6 and React and offers graph analysis ability out of the box. Graphin's logo is graphene, which means the potential of the future.
For more infomation, please check the Graphin Website.
Graphin use lerna to manage this repo. This repo contains the following packages:
/packages
graphin
graphin-components
graphin-studio
graphin-site
Please checkout the specific package:
Package Name | Description |
---|---|
@antv/graphin | Core React component of Graphin |
@antv/graphin-components | Graphin components |
@antv/graphin-site | Graphin documentation website |
graphin-studio | A Graphin demo: generic graph analysis workbench based on Graphin |
Graphin Quick Start
Install
npm run --save @antv/graphin
Usage
import React from 'react';
import ReactDOM from 'react-dom';
import Graphin, { Utils } from '@antv/graphin';
import '@antv/graphin/dist/index.css'; // Don't forget to import css
import './styles.css';
const App = () => {
const data = Utils.mock(10).graphin();
return (
<div className="App">
<Graphin data={data} />
</div>
);
};
const rootElement = document.getElementById('root');
ReactDOM.render(<App />, rootElement);
Graphin and G6 compatible table
Graphin Version | G6 Version |
---|---|
before 1.0.1 | 3.1.9 |
^1.0.2 | ^3.2.0 |
Develop Graphin
- Set npmClient
Set your npmClient in lerna.json, developers in China can set npmClient to cnpm
// ./lerna.json
{
"packages": ["packages/*"],
"npmClient": "yarn",
"version": "0.0.0"
}
- Install dependencies
npm i
- Install dependencies for each package
npm run bootstrap
- Start the local compilation of graphin and graphin-components
npm run start
- Start the Graphin studio demo after
npm run start
npm run studio
- Start the Graphin Doc site
npm run site
More Info
DingTalk
You can scan the QR code to join graphin's group chat