mirror of
https://gitee.com/antv/g6.git
synced 2024-11-30 10:48:24 +08:00
fix: remove custom group docs
This commit is contained in:
parent
7fdc3dd8d5
commit
1d088a25a9
@ -179,35 +179,3 @@ Ungroup the combo, which deletes the combo itself, and appends the children of t
|
||||
```
|
||||
graph.uncombo('combo1')
|
||||
```
|
||||
|
||||
### graph.collapseGroup(groupId)
|
||||
|
||||
Collapse the group with groupId. After collapsing, the nodes and edges inside the group will be hided, the edges linking inside nodes and outside nodes will be linked to the group.
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Type | Required | Description |
|
||||
| ------- | ------ | -------- | -------------------- |
|
||||
| groupId | string | true | The id of the group. |
|
||||
|
||||
**Usage**
|
||||
|
||||
```javascript
|
||||
graph.collapseGroup('groupId');
|
||||
```
|
||||
|
||||
### graph.expandGroup(groupId)
|
||||
|
||||
Expand the group to show the inside nodes and edges, and the edges linking inside nodes and outside nodes will be restored.
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Type | Required | Description |
|
||||
| ------- | ------ | -------- | -------------------- |
|
||||
| groupId | string | true | The id of the group. |
|
||||
|
||||
**Usage**
|
||||
|
||||
```javascript
|
||||
graph.expandGroup('groupId');
|
||||
```
|
||||
|
@ -328,37 +328,3 @@ graph.hideItem(item);
|
||||
// Equal to
|
||||
graph.hideItem('nodeId');
|
||||
```
|
||||
|
||||
## Group Operations (Will be Discard in v4.0, Use Combo Instead)
|
||||
|
||||
### graph.collapseGroup(groupId)
|
||||
|
||||
Collapse the group with groupId. After collapsing, the nodes and edges inside the group will be hided, the edges linking inside nodes and outside nodes will be linked to the group.
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Type | Required | Description |
|
||||
| ------- | ------ | -------- | -------------------- |
|
||||
| groupId | string | true | The id of the group. |
|
||||
|
||||
**Usage**
|
||||
|
||||
```javascript
|
||||
graph.collapseGroup('groupId');
|
||||
```
|
||||
|
||||
### graph.expandGroup(groupId)
|
||||
|
||||
Expand the group to show the inside nodes and edges, and the edges linking inside nodes and outside nodes will be restored.
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Type | Required | Description |
|
||||
| ------- | ------ | -------- | -------------------- |
|
||||
| groupId | string | true | The id of the group. |
|
||||
|
||||
**Usage**
|
||||
|
||||
```javascript
|
||||
graph.expandGroup('groupId');
|
||||
```
|
||||
|
@ -329,38 +329,3 @@ graph.hideItem(item);
|
||||
// 等价于
|
||||
graph.hideItem('nodeId');
|
||||
```
|
||||
|
||||
|
||||
## Group 操作(4.0 将移除,建议使用 Combo)
|
||||
|
||||
### graph.collapseGroup(groupId)
|
||||
|
||||
收起分组,收起分组后,隐藏分组中的所有节点和边,分组外部与分组内节点有连线的则临时连接到分组上面。
|
||||
|
||||
**参数**
|
||||
|
||||
| 名称 | 类型 | 是否必选 | 描述 |
|
||||
| ------- | ------ | -------- | ------- |
|
||||
| groupId | string | true | 分组 ID |
|
||||
|
||||
**用法**
|
||||
|
||||
```javascript
|
||||
graph.collapseGroup('groupId');
|
||||
```
|
||||
|
||||
### graph.expandGroup(groupId)
|
||||
|
||||
展开分组,显示分组中的所有节点和边,恢复收起前的连接情况。
|
||||
|
||||
**参数**
|
||||
|
||||
| 名称 | 类型 | 是否必选 | 描述 |
|
||||
| ------- | ------ | -------- | ------- |
|
||||
| groupId | string | true | 分组 ID |
|
||||
|
||||
**用法**
|
||||
|
||||
```javascript
|
||||
graph.expandGroup('groupId');
|
||||
```
|
||||
|
@ -66,53 +66,3 @@ graph.setItemState(item, 'selected', true);
|
||||
graph.paint();
|
||||
graph.setAutoPaint(autoPaint);
|
||||
```
|
||||
|
||||
### graph.renderCustomGroup(data, groupType)
|
||||
|
||||
Render a node group according to the data.
|
||||
|
||||
**Parameters**
|
||||
|
||||
| Name | Type | Required | Description |
|
||||
| --------- | ------ | -------- | --------------------------------------------------- |
|
||||
| data | Object | true | The data to be rendered |
|
||||
| groupType | string | true | Type of node group. Options: `'circle'` or `'rect'` |
|
||||
|
||||
**Usage**
|
||||
|
||||
```javascript
|
||||
const data = {
|
||||
nodes: [
|
||||
{
|
||||
id: 'node1',
|
||||
groupId: 'group1',
|
||||
label: 'node1',
|
||||
},
|
||||
{
|
||||
id: 'node2',
|
||||
groupId: 'group1',
|
||||
label: 'node2',
|
||||
},
|
||||
],
|
||||
edges: [
|
||||
{
|
||||
source: 'node1',
|
||||
target: 'node2',
|
||||
},
|
||||
],
|
||||
groups: [
|
||||
{
|
||||
id: 'group1',
|
||||
title: {
|
||||
text: 'My Group 1',
|
||||
stroke: '#444',
|
||||
offsetX: -20,
|
||||
offsetY: 30,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
// graph is an instance of Graph
|
||||
graph.renderCustomGroup(data, 'circle');
|
||||
```
|
||||
|
@ -72,53 +72,3 @@ graph.setItemState(item, 'selected', true);
|
||||
graph.paint();
|
||||
graph.setAutoPaint(autoPaint);
|
||||
```
|
||||
|
||||
### graph.renderCustomGroup(data, groupType)
|
||||
|
||||
根据提供的数据渲染组群。
|
||||
|
||||
**参数**
|
||||
|
||||
| 名称 | 类型 | 是否必选 | 描述 |
|
||||
| --------- | ------ | -------- | ------------------------------------- |
|
||||
| data | Object | true | 渲染图的数据 |
|
||||
| groupType | string | true | group 类型,支持 `'circle'`、`'rect'` |
|
||||
|
||||
**用法**
|
||||
|
||||
```javascript
|
||||
const data = {
|
||||
nodes: [
|
||||
{
|
||||
id: 'node1',
|
||||
groupId: 'group1',
|
||||
label: 'node1',
|
||||
},
|
||||
{
|
||||
id: 'node2',
|
||||
groupId: 'group1',
|
||||
label: 'node2',
|
||||
},
|
||||
],
|
||||
edges: [
|
||||
{
|
||||
source: 'node1',
|
||||
target: 'node2',
|
||||
},
|
||||
],
|
||||
groups: [
|
||||
{
|
||||
id: 'group1',
|
||||
title: {
|
||||
text: 'Group 1',
|
||||
stroke: '#444',
|
||||
offsetX: -20,
|
||||
offsetY: 30,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
// graph 是 Graph 的实例
|
||||
graph.renderCustomGroup(data, 'circle');
|
||||
```
|
||||
|
@ -3,10 +3,10 @@ title: Graphics Group
|
||||
order: 2
|
||||
---
|
||||
|
||||
<span style="background-color: rgb(251, 233, 231); color: rgb(139, 53, 56)"> <strong>⚠️Attention:</strong> </span> <br />Graphics Group and [Node Group](/en/docs/manual/middle/discard/nodeGroup) are totally different concepts with the same name Group.
|
||||
<span style="background-color: rgb(251, 233, 231); color: rgb(139, 53, 56)"> <strong>⚠️Attention:</strong> </span> <br />Graphics Group and [Node Combo](/en/docs/manual/middle/elements/combos/defaultCombo) are totally different concepts with the same name Group.
|
||||
|
||||
- Graphics Group is the group for [Graphics Shape](/en/docs/manual/middle/elements/shape/shape-keyshape);
|
||||
- [Node Group](/en/docs/manual/middle/discard/nodeGroup) is the group for [Node](/en/docs/manual/middle/elements/nodes/defaultNode)s, which is related to the hierarchy and groups in the data.
|
||||
- [Node Combo](/en/docs/manual/middle/elements/combos/defaultCombo) is the group for [Node](/en/docs/manual/middle/elements/nodes/defaultNode)s, which is related to the hierarchy and groups in the data.
|
||||
|
||||
<br />
|
||||
|
||||
|
@ -3,10 +3,10 @@ title: 图形分组 Group
|
||||
order: 2
|
||||
---
|
||||
|
||||
<span style="background-color: rgb(251, 233, 231); color: rgb(139, 53, 56)"> <strong>⚠️ 注意:</strong></span> <br /> 图形分组 Group 与 [节点分组 Combo](/zh/docs/manual/middle/discard/nodeGroup) 属于不同层次的概念。
|
||||
<span style="background-color: rgb(251, 233, 231); color: rgb(139, 53, 56)"> <strong>⚠️ 注意:</strong></span> <br /> 图形分组 Group 与 [节点分组 Combo](/zh/docs/manual/middle/elements/combos/defaultCombo) 属于不同层次的概念。
|
||||
|
||||
- 图形分组针对 [图形 Shape](/zh/docs/manual/middle/elements/shape/shape-keyshape) 层次的分组;
|
||||
- [节点分组 Combo](/zh/docs/manual/middle/discard/nodeGroup) 是针对 [节点](/zh/docs/manual/middle/elements/nodes/defaultNode) 的分组,与数据结构中的层次、分组对应。
|
||||
- [节点分组 Combo](/zh/docs/manual/middle/elements/combos/defaultCombo) 是针对 [节点](/zh/docs/manual/middle/elements/nodes/defaultNode) 的分组,与数据结构中的层次、分组对应。
|
||||
|
||||
<br />
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user