<img src="https://gw.alipayobjects.com/zos/antfincdn/R8sN%24GNdh6/language.svg" width="18"> [English](./README.en-US.md) | 简体中文
<h1 align="center">
<b>G6:图可视分析引擎</b>
</h1>
> G6 5.0 beta 版本已经发布,还有不少的细节体验问题,欢迎试用和反馈,线上产品暂时谨慎使用,6.6 发布正式版本!
![](https://user-images.githubusercontent.com/6113694/45008751-ea465300-b036-11e8-8e2a-166cbb338ce2.png)
[![npm Version](https://img.shields.io/npm/v/@antv/g6.svg)](https://www.npmjs.com/package/@antv/g6)
[![Build Status](https://github.com/antvis/g6/workflows/build/badge.svg?branch=v5)](https://github.com/antvis/g6/actions)
[![Coverage Status](https://coveralls.io/repos/github/antvis/G6/badge.svg)](https://coveralls.io/github/antvis/G6)
[![npm Download](https://img.shields.io/npm/dm/@antv/g6.svg)](https://www.npmjs.com/package/@antv/g6)
![typescript](https://img.shields.io/badge/language-typescript-blue.svg)
[![npm License](https://img.shields.io/npm/l/@antv/g6.svg)](https://www.npmjs.com/package/@antv/g6)
<p align="center">
<a href="https://g6-next.antv.antgroup.com/">介绍</a> •
<a href="https://g6-next.antv.antgroup.com/examples">案例</a> •
<a href="https://g6-next.antv.antgroup.com/">教程</a> •
<a href="https://g6-next.antv.antgroup.com/">API</a>
</p>
[G6](https://github.com/antvis/g6) 是一个图可视化引擎。它提供了图的绘制、布局、分析、交互、动画、主题、插件等图可视化和分析的基础能力。基于 G6,用户可以快速搭建自己的图可视化分析应用,让关系数据变得简单,透明,有意义。
<img src='https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*_PJ5SZELwq0AAAAAAAAAAAAADmJ7AQ/original' width=550 alt='' />
<img src='https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zTjwQaXokeQAAAAAAAAAAABkARQnAQ' width=550 alt='' />
<img src='https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zau8QJcVpDQAAAAAAAAAAABkARQnAQ' height=200 alt='' /><img src='https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*RIlETY_S6IoAAAAAAAAAAABkARQnAQ' height=200 alt='' />
<img src='https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*cDzXR4jIWr8AAAAAAAAAAABkARQnAQ' height=150 alt='' /><img src='https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HTasSJGC4koAAAAAAAAAAABkARQnAQ' height=150 alt='' />
<img src="https://user-images.githubusercontent.com/6113694/44995293-02858600-afd5-11e8-840c-349e4730d63d.gif" height=150 alt='' /><img src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*I9OdTbXJIi0AAAAAAAAAAABkARQnAQ" height=150 alt='' /><img src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*xoufSYcjK2AAAAAAAAAAAABkARQnAQ" height=150 alt='' />
## ✨ 特性
G6 作为一款专业的图可视化引擎,具有以下特性:
- **丰富的元素**:内置丰富的节点、边、Combo UI 元素,样式配置丰富,支持数据回调,且具备有灵活扩展自定义元素的机制。
- **可控的交互**:内置 10+ 交互行为,且提供丰富的各类事件,便于扩展自定义的交互行为。
- **高性能布局**:内置 10+ 常用的图布局,部分基于 GPU、Rust 并行计算提升性能,支持自定义布局。
- **便捷的组件**:优化内置组件功能及性能,且有灵活的扩展性,便于业务实现定制能力。
- **多主题色板**:提供了亮色、暗色两套内置主题,在 AntV 新色板前提下,融入 20+ 常用社区色板。
- **多环境渲染**:发挥 [G](https://github.com/antvis/g) 能力, 支持 Canvas、SVG 以及 WebGL,和 Node.js 服务端渲染;基于 WebGL 提供强大 3D 渲染和空间交互的插件包。
- **React 体系**:利用 React 前端生态,支持 React 节点,大大丰富 G6 的节点呈现样式。
## 🔨 开始使用
可以通过 NPM 或 Yarn 等包管理器来安装。
```bash
$ npm install @antv/g6@next
```
```bash
$ yarn add @antv/g6@next
```
成功安装之后,可以通过 import 导入 `Graph` 对象。
```html
<div id="container"></div>
```
```ts
import { Graph } from '@antv/g6';
// 准备数据
const data = {
nodes: [/* your nodes data */],
edges: [/* your edges data */],
};
// 初始化图表实例
const graph = new Graph({
container: 'container',
autoFit: 'view',
data,
node: {
palette: {
type: 'group',
field: 'cluster',
}
},
layout: {
type: 'force',
},
behaviors: ['drag-canvas', 'drag-node'],
});
// 渲染可视化
graph.render();
```
一切顺利,你可以得到下面的力导图!
<img src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ue4iTYurc6sAAAAAAAAAAAAADmJ7AQ/fmt.webp" height="300" />
## 🌍 生态
- **Ant Design Charts**: React 图表库,基于 G2、G6、X6、L7。
- **Graphin**:基于 G6 的 React 简单封装,以及图可视化应用研发的 SDK。
更多生态开源项目,欢迎 PR 收录进来。
## 📮 贡献
- **问题反馈**:使用过程遇到的 G6 的问题,欢迎提交 Issue,并附上可以复现问题的最小案例代码。
- **贡献指南**:如何参与到 G6 的[开发和贡献](./CONTRIBUTING.md)。
- **想法讨论**:在 GitHub Discussion 上或者钉钉群里面讨论。
<div>
<img src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*CQoGSoFBzaUAAAAAAAAAAAAADmJ7AQ/fmt.webp" height="256" />
<img src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*yXJGSY8RC68AAAAAAAAAAAAADmJ7AQ/fmt.webp" height="256" />
</div>
## 📄 License
[MIT](./LICENSE).
没有合适的资源?快使用搜索试试~ 我知道了~
G6 是一个图可视化框架 它提供了一套图可视化的基础设置,能帮助开发者搭建属于自己的图 图分析 应用或是 图编辑器 应用
共1514个文件
ts:597个
svg:375个
md:246个
0 下载量 144 浏览量
2024-05-28
12:52:24
上传
评论
收藏 1.72MB ZIP 举报
温馨提示
G6 作为一款专业的图可视化引擎,具有以下特性: 丰富的元素:内置丰富的节点、边、Combo UI 元素,样式配置丰富,支持数据回调,且具备有灵活扩展自定义元素的机制。 可控的交互:内置 10+ 交互行为,且提供丰富的各类事件,便于扩展自定义的交互行为。 高性能布局:内置 10+ 常用的图布局,部分基于 GPU、Rust 并行计算提升性能,支持自定义布局。 便捷的组件:优化内置组件功能及性能,且有灵活的扩展性,便于业务实现定制能力。 多主题色板:提供了亮色、暗色两套内置主题,在 AntV 新色板前提下,融入 20+ 常用社区色板。 多环境渲染:发挥 G 能力, 支持 Canvas、SVG 以及 WebGL,和 Node.js 服务端渲染;基于 WebGL 提供强大 3D 渲染和空间交互的插件包。 React 体系:利用 React 前端生态,支持 React 节点,大大丰富 G6 的节点呈现样式。
资源推荐
资源详情
资源评论
收起资源包目录
G6 是一个图可视化框架 它提供了一套图可视化的基础设置,能帮助开发者搭建属于自己的图 图分析 应用或是 图编辑器 应用 (1514个子文件)
CNAME 14B
commit-msg 82B
.editorconfig 245B
.editorconfig 244B
.eslintignore 24B
.eslintignore 24B
.gitignore 272B
.gitignore 78B
.gitignore 45B
.gitignore 23B
index.html 1KB
index.html 447B
index.html 441B
index.html 373B
cluster-sort.js 4KB
index.js 4KB
shortest-path.js 4KB
g2-activity-chart.js 3KB
g2-bar-chart.js 3KB
utils.js 3KB
pattern-matching.js 2KB
arc.js 2KB
bi-graph.js 2KB
extra-button.js 2KB
.eslintrc.js 2KB
collision.js 2KB
loop-curve.js 2KB
changeImg.js 2KB
loop-polyline.js 2KB
update.js 2KB
basic.js 2KB
basic.js 2KB
antv-dagre.js 2KB
3d-node.js 2KB
exit.js 2KB
enter.js 2KB
basic.js 2KB
basic.js 1KB
switch.js 1KB
basic.js 1KB
click.js 1KB
extra-label.js 1KB
3d-force.js 1KB
config-params.js 1KB
basic.js 1KB
update.js 1KB
custom-side.js 1KB
vertical.js 1KB
dagre.js 1KB
label-propagation.js 1KB
ripple-circle.js 1KB
parser.js 1KB
louvain.js 1KB
style.js 1KB
port.js 1KB
horizontal.js 1KB
donut.js 1KB
custom.js 1KB
enter-edge-path-in.js 1KB
background.js 1KB
auto-side.js 1KB
left-side.js 1KB
chart.js 1KB
right-side.js 1KB
basic.js 1KB
vertical.js 1KB
combo-collapse-expand.js 1KB
basic.js 1KB
time.js 1KB
copy.js 1KB
vite.config.js 1KB
ant-line.js 1KB
background.js 1KB
change-data.js 1KB
custom-arrow.js 1KB
antv-dagre-combo.js 1KB
custom-path.js 1KB
fly-marker.js 1KB
click.js 1KB
word-wrap.js 1KB
switch.js 1KB
jest.config.js 1024B
lasso.js 1013B
basic.js 1010B
parallel-edges.js 998B
brush.js 991B
mesh.js 985B
repeat.js 984B
run-in-web-worker.js 980B
ellipsis.js 978B
text.js 977B
basic.js 958B
path-in.js 914B
jest.config.js 907B
translate.js 890B
custom-edge-style.js 885B
basic.js 879B
basic.js 845B
combo-combined.js 824B
basic.js 810B
共 1514 条
- 1
- 2
- 3
- 4
- 5
- 6
- 16
资源评论
阿尔法星球
- 粉丝: 777
- 资源: 239
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- U盘接口类型检测工具,可检测USB30和2.0
- 棕色系宠物狗企业模板下载-棕色 宠物 狗 html
- 一个基于Python的Django的疫情管理系统.zip
- 智能优化特征选择-基于ALO蚁狮优化的特征选择分类算法KNN和SVM分类器(matlab程序)
- 偏微分方程的有限元方法.zip偏微分方程的有限元方法.zip
- 智能优化特征选择-基于ACO蚁群优化的特征选择分类算法KNN和SVM分类器(matlab程序)
- HTML5大气简洁宠物网站模板是一款绿色大气风格的HTML5宠物网站模板下载
- 智能优化特征选择-基于GA遗传优化的特征选择分类算法KNN和SVM分类器(matlab程序)
- 作业3 Servlet技术.docx
- 设计模式之抽象工厂模式-c++
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功