拓扑图交互与配置
拓扑图的页签、搜索、高亮与缩放操作，以及关系图的只读约束与展示规则。
概述
拓扑图是只读的关系图视图，没有可保存的全局属性。这里说明页面上的全部交互操作项，以及关系图的展示与布局规则。
两类关系图（实体关系、页面关系）共享同一套交互与展示逻辑：相同的搜索、高亮、缩放行为，相同的卡片样式与布局策略。
配置项
| 配置项 | 说明 |
|---|---|
| 页签切换 | 在「实体关系」与「页面关系」之间切换；切换会更新地址栏 tab 参数（MetaEntityRelationGraph / MetaPageRelationGraph），刷新或分享链接后仍停留在同一页签 |
| 搜索框 | 输入关键字实时过滤，匹配卡片名称、编码或行内容；命中数量显示在搜索框右侧 |
| 适应画布 | 一键把整张关系图缩放并居中到画布内，同时清除当前选中与悬浮状态 |
| 切换应用 | 跳转回应用首页，用于切换到其他应用查看其拓扑 |
搜索与高亮
- 搜索：关键字命中卡片名称、编码或卡片行的名称 / 编码时，命中的行以高亮底色标记，相关卡片保持正常显示，其余卡 片与连线淡出。
- 悬浮：鼠标移到某张卡片时，与该卡片有直接关系的卡片和连线保持显示，其余淡出。
- 点击选中：点击卡片可固定选中状态；再次点击同一卡片或点击画布空白处取消选中。
- 悬浮优先于点击选中：鼠标当前所在的卡片决定高亮目标。
画布操作
| 操作 | 说明 |
|---|---|
| 平移 | 按住鼠标左键拖动画布 |
| 缩放 | 鼠标滚轮缩放，以鼠标位置为中心，缩放范围约 0.1 ~ 3 |
| 适应画布 | 点击工具栏「适应画布」按钮 |
关系图禁止编辑：节点与连线均不可拖动、不可新增或删除锚点、不可连线，避免误操作改变图结构。
卡片与配色
实体编辑器中打开的资源卡片遵循统一配色：
| 卡片类型 | 配色 | 说明 |
|---|---|---|
| 当前应用实体 / 页面 | 主题色 | 当前应用内的资源 |
| 外部实体 | 灰色渐变 | 属于其他应用的被引用实体，不展示字段 |
| 未知实体 | 警示红色渐变 | 引用已失效（资源不存在） |
卡片右上角的箭头链接可打开对应资源编辑页；卡片内带链接的行同样可直接打开对应资源。
下一步
展示与布局参数
以下内容面向技术实现与 AI 检索。前端使用 X6（@antv/x6）渲染只读关系图，卡片基于 foreignObject 自定义形状 meta-topology-card。
卡片尺寸常量
| 常量 | 值 | 含义 |
|---|---|---|
ENTITY_NODE_WIDTH | 260 | 卡片宽度 |
ENTITY_HEADER_HEIGHT | 44 | 卡片头部高度 |
FIELD_ROW_HEIGHT | 24 | 每行高度 |
ENTITY_BOTTOM_PADDING | 8 | 卡片底部内边距 |
EXTERNAL_NODE_HEIGHT | 76 | 无行卡片高度（44 + 24 + 8） |
HEADER_TITLE_MAX_LENGTH | 16 | 卡片标题最长保留字符数，超出以省略号截断 |
HEADER_CODE_MAX_LENGTH | 20 | 卡片副标题（编码 / 标题）最长保留字符数 |
卡片高度按行数计算：entityNodeHeight(rowCount) = 44 + rowCount * 24 + 8。
布局常量
| 常量 | 值 | 含义 |
|---|---|---|
COLUMN_GAP | 60 | 列间距（承载多条连线时会自动加宽） |
GROUP_GAP | 160 | 主卡片块与下方卡片块之间的垂直间距 |
ROW_GAP | 40 | 同列相邻卡片之间的垂直间距 |
LANE_MARGIN | 28 | 连线与卡片保持的间距 |
LANE_WIDTH | 14 | 同一间隙内相邻连线之间的水平间距 |
APPROACH_CLEARANCE | 18 | 连线进入卡片前保持的间距 |
CANVAS_MIN_HEIGHT | 320 | 画布最小高度 |
CANVAS_BOTTOM_GAP | 24 | 画布底部预留间距，避免页面出现滚动条 |
列数由 pickColumnCount 依据卡片数量、总高度与画布宽高比择优确定，使关系图尽量贴合画布形状；卡片按原始顺序通过 splitColumns 均衡分列（使最高列尽可能矮）。
只读画布配置
关系图的 X6 图实例关键配置：
| 配置项 | 值 | 含义 |
|---|---|---|
panning.enabled | true | 允许平移 |
panning.eventTypes | ['leftMouseDown'] | 鼠标左键拖动平移 |
mousewheel.enabled | true | 允许滚轮缩放 |
mousewheel.zoomAtMousePosition | true | 以鼠标位置为中心缩放 |
mousewheel.minScale / maxScale | 0.1 / 3 | 缩放范围 |
interacting.nodeMovable | false | 节点不可拖动 |
interacting.edgeMovable | false | 连线不可拖动 |
interacting.vertexAddable / vertexDeletable | false | 不可增删连线拐点 |
interacting.magnetConnectable | false | 不可手动连线 |
画布尺寸由容器实测高度动态计算，切换页签或调整窗口时自动重算，保证画布占满剩余空间且页面本身不产生滚动条。