Graphin 组件 Props Data Node NodeData NodeStyle NodeLayoutType Edge Layout Extend Register Options Ref Apis Graphin 组件 本文档是 <Graphin/> React 组件的 API 文档。 Props ...

Graphin 简介 背景介绍 命名由来 产品定位 对标产品 开源动机 功能特性 01. 数据驱动 02.布局切换 03.分析组件 04.自定义样式 05.基础分析 06.高级分析 Graphin 简介 背景介绍 随着大数据时代的到来，数据分析对于企业而言变得越来越重要。传统的 OLAP 图表分析，已经在商业领域展露头脚，...

Graphin 实例接口 01. APIs 接口： 02. G6 Graph 实例 Graphin 实例接口 在一些特殊情况下，我们需要直接访问 Graphin 实例，来获取一些信息，或者直接对 G6 实例进行操作。这个时候我们可以通过 ref 来获取 Graphin 的实例： const Graphene = ( props : ...

快速上手 安装 第一个例子 01. 渲染数据 02. 使用布局 03. 配置 Node 和 Edge 样式 02. 节点扩散 03. 总结与引导 快速上手 安装 $ npm install @antv / graphin -- save 第一个例子 这是一个最简单的 Graphin 组件的在线演示。访问 htt...

Data 数据驱动 01. 数据的定义 02. 从数据到视图 03. 特殊情况 Data 数据驱动 01. 数据的定义 图的数据结构比较固定。一般用 nodes 表示节点的集合，用 edges 表示边的集合。 用 TypeScript 的类型来定义数据 data 如下： export interface Dat...

Extend 扩展接口 Extend 介绍 扩展布局 扩展节点 扩展图标 Extend 扩展接口 Extend 介绍 extend 顾名思义是扩展的意思。Graphin 支持 3 种扩展类型：扩展自定义布局，扩展自定义节点，扩展自定义图标。 Graphin 内置了布局，节点 与图标。除此之外，Graphin 给用户提供了扩展机制，用户可...

FAQ 01. Graphin 与 G6 的关系是什么？ 02. Graphin 未来的计划是什么？ FAQ 01. Graphin 与 G6 的关系是什么？ 搞懂 Graphin 与 G6 的关系非常重要，虽然 Graphin 是基于 G6 封装的 React 组件库，这只是它的技术实现，并不是它的定位。G6 是图分析与图可视化的分析引擎，...

Events 事件响应 事件的定义 支持的事件 事件的用法 Events 事件响应 事件的定义 我们在图上的交互行为，其实都会触发事件，比如窗口缩放时，Graphin 会自动更新画布的宽高。又比如画布缩放时，默认只保留 KeyShape。 我们可以通过 G6 的 API 来对事件进行监听。 支持的事件 graph 监听的名称是由 元...

贡献指南 行为准则 透明的开发 分支管理 Bugs 新增功能 第一次贡献 Pull Request 开发流程 贡献指南 本指南参考自 Ant Design 这篇指南会指导你如何为 Graphin 贡献一份自己的力量，请在你要提 issue 或者 pull request 之前花几分钟来阅读一遍这篇指南。 行为准则 我...

Options 配置 配置画布行为和展示细节 配置力导时拖拽 配置 KeyShape 优化 Options 配置 Graphin 提供了 props.options 来对行为和显示进行高级配置。 具体的 API，详见 API 文档 。 下面对配置中比较常用的几类进行演示： 配置画布行为和展示细节 Graphin 对画布的缩放，平移和...