diff --git a/frontend/src/config/layout.ts b/frontend/src/config/layout.ts index ec003fa..626ac96 100644 --- a/frontend/src/config/layout.ts +++ b/frontend/src/config/layout.ts @@ -1,18 +1,17 @@ import type { GraphLayoutConfig } from '../types/graph'; -// 支持的布局类型(仅保留 force 力导向布局) -export const SUPPORTED_LAYOUTS = ['force'] as const; +// 支持的布局类型(保留 d3-force 力导向布局) +export const SUPPORTED_LAYOUTS = ['d3-force'] as const; // 力导向布局默认配置 export const FORCE_LAYOUT_CONFIG = { - type: 'force' as const, - nodeSize: 60, - preventOverlap: true, - linkDistance: 150, + type: 'd3-force' as const, + collide: { radius: 60 } as const, + link: { distance: 150 } as const, }; // 默认布局配置 export const DEFAULT_LAYOUT: GraphLayoutConfig = FORCE_LAYOUT_CONFIG; // 图谱交互行为配置 -export const GRAPH_BEHAVIORS = ['drag-canvas', 'zoom-canvas', 'drag-element']; +export const GRAPH_BEHAVIORS = ['drag-canvas', 'zoom-canvas', 'drag-element-force']; diff --git a/frontend/src/types/graph.ts b/frontend/src/types/graph.ts index c315355..220b99d 100644 --- a/frontend/src/types/graph.ts +++ b/frontend/src/types/graph.ts @@ -50,13 +50,14 @@ export interface GraphData { /** * 图谱布局配置 - * 目前仅支持 force 力导向布局 + * 支持 force 力导向布局和 d3-force 力导向布局 */ export interface GraphLayoutConfig { - type: 'force'; + type: 'force' | 'd3-force'; nodeSize?: number; linkDistance?: number; center?: [number, number]; + collide?: { radius: number; strength?: number }; } /**