mirror of
https://gitee.com/antv/g6.git
synced 2024-12-16 02:21:25 +08:00
119 lines
2.7 KiB
Markdown
119 lines
2.7 KiB
Markdown
---
|
||
title: Grid 网格
|
||
order: 7
|
||
---
|
||
|
||
本文展示所有网格布局配置项。[格子布局 DEMO](/zh/examples/net/gridLayout/#grid)。
|
||
|
||
<img src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*8RYVTrENVCcAAAAAAAAAAAAADmJ7AQ/original" width=400 />
|
||
|
||
## begin
|
||
|
||
**类型**：`[number, number]`
|
||
|
||
**默认值**：`[0, 0]`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：网格开始位置（左上角）
|
||
|
||
## width
|
||
|
||
**类型**：`number`
|
||
|
||
**默认值**：在 G6 中使用当前容器的宽度作为 `grid` 布局 `width` 的默认值。单独使用此布局时默认值为 `300`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：网格布局的总宽度
|
||
|
||
## height
|
||
|
||
**类型**：`number`
|
||
|
||
**默认值**：在 G6 中使用当前容器的高度作为 `grid` 布局 `height` 的默认值。单独使用此布局时默认值为 `300`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：网格布局的总高度
|
||
|
||
## rows
|
||
|
||
**类型**：`number`
|
||
|
||
**默认值**：`10`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：网格的行数，为 `undefined` 时算法根据节点数量、布局空间、`cols`（若指定）自动计算
|
||
|
||
## cols
|
||
|
||
**类型**：`number`
|
||
|
||
**默认值**：`undefined`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：网格的列数，为 `undefined` 时算法根据节点数量、布局空间、`rows`（若指定）自动计算
|
||
|
||
## preventOverlap
|
||
|
||
**类型**：`boolean`
|
||
|
||
**默认值**：`false`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：是否防止重叠，必须配合下面属性 `nodeSize`，只有设置了与当前图节点大小相同的 `nodeSize` 值，才能够有效进行节点重叠的碰撞检测
|
||
|
||
## nodeSize
|
||
|
||
**类型**：`number` \| `number`[] \| (`model`: `NodeModel`) => `number`
|
||
|
||
**默认值**：读取节点数据中的 `data.size`，若无则默认值为 `10`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：节点大小（直径）。用于碰撞检测
|
||
|
||
## preventOverlapPadding
|
||
|
||
**类型**：`number`
|
||
|
||
**默认值**：`10`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：避免重叠时节点的间距 `padding`。`preventOverlap` 为 `true` 时生效
|
||
|
||
## condense
|
||
|
||
**类型**：`boolean`
|
||
|
||
**默认值**：`false`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：为 `false` 时表示利用所有可用画布空间，为 `true` 时表示利用最小的画布空间
|
||
|
||
## position
|
||
|
||
**类型**： (`node?`: `NodeModel`) => { `row?`: `number`; `col?`: `number`; }
|
||
|
||
**默认值**：`undefined`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：指定每个节点所在的行和列
|
||
|
||
## sortBy
|
||
|
||
**类型**：`string`
|
||
|
||
**默认值**：`undefined`
|
||
|
||
**是否必须**：false
|
||
|
||
**说明**：指定排序的依据（节点属性名），数值越高则该节点被放置得越中心。若为 undefined，则会计算节点的度数，度数越高，节点将被放置得越中心
|