@antv/graphin-components


@antv/graphin-components

中文

This is Graphin's library of pre-built React components for common analytical use cases. Graphin is a graph analysis solution based on G6 4.x.

Components list:

| Component | Category | Description |
| --------------- | ----------------------------- | --------------------------------------------------------------------------- |
| ContextMenu | Interactive Component | Help users perform node or edge operations such as tagging or expansion |
| Tooltip | Interactive Component | Help users quickly browse node or edge information |
| MiniMap | Interactive Component | Help users to navigate around the canvas |
| Toolbar | Interactive Component | Help users with canvas operations: zoom out, zoom in, full screen etc. |
| RedoUndo | Interactive Component | Help users manage graph history |
| FishEye | Interactive Component | Help users to enlarge cluttered graph details |
| CreateEdge | Interactive Component | Help users draw connections between nodes |
| Legend | Labeling Component | Displays categorical information about nodes and/or edges |
| Hull | Labeling Component | Help users group similar nodes together |
| Statistic | Labeling Component | Help users monitor canvas information |
| SnapshotGallery | Analytical Component | Provide snapshot saving and replaying function as part of an image carousel |
| LayoutSelector | Analytical Component | Help users switch layouts and configure layout options for optimal display |
| Sheetbar | Analytical Component | Help users analyze and manage multiple canvases |
| TableMode | Analytical Component | Help users view relational data as tables |
| FindPathPanel | Algorithm Based Component | Help users calculate the shortest path and possible paths between two nodes |
| MapMode | Advanced Analytical Component | Help users analyze geospatial relational data |
| Timebar | Advanced Analytical Component | Help users analyze time series relational data |

Install

``bash

npm install @antv/graphin-components --save

`

UMD bundle is available in releases. Peer dependencies: react, react-dom, antd.

Usage

`tsx
import React from 'react';
import ReactDOM from 'react-dom';
import Graphin, { Utils } from '@antv/graphin';
import { Toolbar } from '@antv/graphin-components';

// Do not forget to import required CSS

const App = () => {
const data = Utils.mock(10).graphin();
return (


const rootElement = document.getElementById('root');
ReactDOM.render(, rootElement);
``

Docs

Please refer to Graphin Docs - Components

APIs

Please refer to Graphin Components API Doc