---
title: 经典案例
order: 11
---

## 经典案例

常用图表基于 G6 的实现的经典图可视化案例，包括桑基图，思维导图等，如果你有好的案例，欢迎通过 Github Issue 提交给我们。

### 图表决策

这是一个带交互的图表决策图，辅助用户“按使用目的”寻找合适的可视化方式。该 demo 结合了自定义节点、自定义边、力导向布局、数据切换、交互等功能，已应用在 AntV 官网。

### 自定义流向图

对于一些定制化比较强的需求，使用 G6 内置的节点和边很难实现。下面的资金流向图是通过自定义节点和边的方式实现的。

### 桑基图

桑基图 (Sankey Diagram) 用来显示流向和数量（彼此之间的比例）。箭头或线的宽度用于显示大小，因此箭头越大，流量也越大。在每个流程阶段中，流向箭头或线可以组合在一起，或者往不同路径各自分开。我们可用不同颜色来区分图表中的不同类别，或表示从一个阶段到另一个阶段的转换。

### 思维导图

思维导图是一种将思维形象化的方法。我们知道放射性思考是人类大脑的自然思考方式，每一种进入大脑的资料，不论是感觉、记忆或是想法——包括文字、数字、符码、香气、食物、线条、颜色、意象、节奏、音符等，都可以成为一个思考中心，并由此中心向外发散出成千上万的关节点，每一个关节点代表与中心主题的一个连结，而每一个连结又可以成为另一个中心主题，再向外发散出成千上万的关节点，呈现出放射性立体结构。

本案例展示了一个完整的思维导图交互案例，包括增删改相关操作。

### 节点内容可滚动的 ER 图

E-R 图也称实体-联系图(Entity Relationship Diagram)，提供了表示实体类型、属性和联系的方法，用来描述现实世界的概念模型。

本案例中展示了节点内含有很多子元素的解决方案，在 G6 内实现的滚动框的功能，以及节点元素间连线的示范

### 聚类的折叠/扩展

使用 Fruchterman 布局实现交互式折叠/扩展聚类。尝试点击节点以折叠/扩展一个聚类。
