yangdx
commited on
Commit
·
169a4c0
1
Parent(s):
7f62f8d
Fix linting and upate webui assets
Browse files- lightrag/api/webui/assets/{index-DeJuAbj6.js → index-W9SNU3ES.js} +0 -0
- lightrag/api/webui/index.html +0 -0
- lightrag_webui/src/components/graph/FocusOnNode.tsx +1 -1
- lightrag_webui/src/components/graph/GraphControl.tsx +3 -3
- lightrag_webui/src/components/graph/PropertiesView.tsx +1 -1
- lightrag_webui/src/features/GraphViewer.tsx +5 -5
- lightrag_webui/src/hooks/useLightragGraph.tsx +15 -15
- lightrag_webui/src/stores/graph.ts +2 -2
lightrag/api/webui/assets/{index-DeJuAbj6.js → index-W9SNU3ES.js}
RENAMED
Binary files a/lightrag/api/webui/assets/index-DeJuAbj6.js and b/lightrag/api/webui/assets/index-W9SNU3ES.js differ
|
|
lightrag/api/webui/index.html
CHANGED
Binary files a/lightrag/api/webui/index.html and b/lightrag/api/webui/index.html differ
|
|
lightrag_webui/src/components/graph/FocusOnNode.tsx
CHANGED
@@ -14,7 +14,7 @@ const FocusOnNode = ({ node, move }: { node: string | null; move?: boolean }) =>
|
|
14 |
*/
|
15 |
useEffect(() => {
|
16 |
const graph = sigma.getGraph();
|
17 |
-
|
18 |
if (move) {
|
19 |
if (node && graph.hasNode(node)) {
|
20 |
try {
|
|
|
14 |
*/
|
15 |
useEffect(() => {
|
16 |
const graph = sigma.getGraph();
|
17 |
+
|
18 |
if (move) {
|
19 |
if (node && graph.hasNode(node)) {
|
20 |
try {
|
lightrag_webui/src/components/graph/GraphControl.tsx
CHANGED
@@ -62,13 +62,13 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean })
|
|
62 |
} catch (error) {
|
63 |
console.error('Error setting graph on sigma instance:', error);
|
64 |
}
|
65 |
-
|
66 |
// 应用布局
|
67 |
assignLayout();
|
68 |
console.log('Layout applied to graph');
|
69 |
}
|
70 |
}, [sigma, sigmaGraph, assignLayout, maxIterations])
|
71 |
-
|
72 |
/**
|
73 |
* Ensure the sigma instance is set in the store
|
74 |
* This provides a backup in case the instance wasn't set in GraphViewer
|
@@ -224,7 +224,7 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean })
|
|
224 |
} else {
|
225 |
const _selectedEdge = selectedEdge && graph.hasEdge(selectedEdge) ? selectedEdge : null;
|
226 |
const _focusedEdge = focusedEdge && graph.hasEdge(focusedEdge) ? focusedEdge : null;
|
227 |
-
|
228 |
if (_selectedEdge || _focusedEdge) {
|
229 |
if (edge === _selectedEdge) {
|
230 |
newData.color = Constants.edgeColorSelected
|
|
|
62 |
} catch (error) {
|
63 |
console.error('Error setting graph on sigma instance:', error);
|
64 |
}
|
65 |
+
|
66 |
// 应用布局
|
67 |
assignLayout();
|
68 |
console.log('Layout applied to graph');
|
69 |
}
|
70 |
}, [sigma, sigmaGraph, assignLayout, maxIterations])
|
71 |
+
|
72 |
/**
|
73 |
* Ensure the sigma instance is set in the store
|
74 |
* This provides a backup in case the instance wasn't set in GraphViewer
|
|
|
224 |
} else {
|
225 |
const _selectedEdge = selectedEdge && graph.hasEdge(selectedEdge) ? selectedEdge : null;
|
226 |
const _focusedEdge = focusedEdge && graph.hasEdge(focusedEdge) ? focusedEdge : null;
|
227 |
+
|
228 |
if (_selectedEdge || _focusedEdge) {
|
229 |
if (edge === _selectedEdge) {
|
230 |
newData.color = Constants.edgeColorSelected
|
lightrag_webui/src/components/graph/PropertiesView.tsx
CHANGED
@@ -101,7 +101,7 @@ const refineNodeProperties = (node: RawNodeType): NodeType => {
|
|
101 |
|
102 |
// 获取所有边
|
103 |
const edges = state.sigmaGraph.edges(node.id)
|
104 |
-
|
105 |
// 处理每条边
|
106 |
for (const edgeId of edges) {
|
107 |
// 检查边是否还存在
|
|
|
101 |
|
102 |
// 获取所有边
|
103 |
const edges = state.sigmaGraph.edges(node.id)
|
104 |
+
|
105 |
// 处理每条边
|
106 |
for (const edgeId of edges) {
|
107 |
// 检查边是否还存在
|
lightrag_webui/src/features/GraphViewer.tsx
CHANGED
@@ -147,7 +147,7 @@ const GraphViewer = () => {
|
|
147 |
useEffect(() => {
|
148 |
setSigmaSettings(defaultSigmaSettings)
|
149 |
}, [])
|
150 |
-
|
151 |
// Clean up sigma instance when component unmounts
|
152 |
useEffect(() => {
|
153 |
return () => {
|
@@ -156,20 +156,20 @@ const GraphViewer = () => {
|
|
156 |
console.log('Cleared sigma instance on unmount');
|
157 |
};
|
158 |
}, []);
|
159 |
-
|
160 |
// Get the sigmaGraph from the store
|
161 |
const sigmaGraph = useGraphStore.use.sigmaGraph();
|
162 |
-
|
163 |
// Set the sigma instance in the graph store when it's available
|
164 |
// Using useLayoutEffect to ensure this runs before child components need the instance
|
165 |
useLayoutEffect(() => {
|
166 |
if (sigmaRef.current?.sigma) {
|
167 |
const instance = sigmaRef.current.sigma;
|
168 |
-
|
169 |
// Get the sigma instance from the ref and store it
|
170 |
console.log('Setting sigma instance in graph store (layout effect)');
|
171 |
useGraphStore.getState().setSigmaInstance(instance);
|
172 |
-
|
173 |
// If we also have a graph, bind it to the sigma instance
|
174 |
if (sigmaGraph) {
|
175 |
try {
|
|
|
147 |
useEffect(() => {
|
148 |
setSigmaSettings(defaultSigmaSettings)
|
149 |
}, [])
|
150 |
+
|
151 |
// Clean up sigma instance when component unmounts
|
152 |
useEffect(() => {
|
153 |
return () => {
|
|
|
156 |
console.log('Cleared sigma instance on unmount');
|
157 |
};
|
158 |
}, []);
|
159 |
+
|
160 |
// Get the sigmaGraph from the store
|
161 |
const sigmaGraph = useGraphStore.use.sigmaGraph();
|
162 |
+
|
163 |
// Set the sigma instance in the graph store when it's available
|
164 |
// Using useLayoutEffect to ensure this runs before child components need the instance
|
165 |
useLayoutEffect(() => {
|
166 |
if (sigmaRef.current?.sigma) {
|
167 |
const instance = sigmaRef.current.sigma;
|
168 |
+
|
169 |
// Get the sigma instance from the ref and store it
|
170 |
console.log('Setting sigma instance in graph store (layout effect)');
|
171 |
useGraphStore.getState().setSigmaInstance(instance);
|
172 |
+
|
173 |
// If we also have a graph, bind it to the sigma instance
|
174 |
if (sigmaGraph) {
|
175 |
try {
|
lightrag_webui/src/hooks/useLightragGraph.tsx
CHANGED
@@ -446,7 +446,7 @@ const useLightrangeGraph = () => {
|
|
446 |
for (const edge of processedEdges) {
|
447 |
const sourceExists = existingNodeIds.has(edge.source) || nodesToAdd.has(edge.source);
|
448 |
const targetExists = existingNodeIds.has(edge.target) || nodesToAdd.has(edge.target);
|
449 |
-
|
450 |
if (sourceExists && targetExists) {
|
451 |
edgesToAdd.add(edge.id);
|
452 |
} else {
|
@@ -462,14 +462,14 @@ const useLightrangeGraph = () => {
|
|
462 |
|
463 |
// STEP 2: Calculate node degrees and sizes
|
464 |
const nodeDegrees = new Map<string, number>();
|
465 |
-
|
466 |
// Calculate degrees from kept edges
|
467 |
for (const edgeId of edgesToAdd) {
|
468 |
const edge = processedEdges.find(e => e.id === edgeId)!;
|
469 |
nodeDegrees.set(edge.source, (nodeDegrees.get(edge.source) || 0) + 1);
|
470 |
nodeDegrees.set(edge.target, (nodeDegrees.get(edge.target) || 0) + 1);
|
471 |
}
|
472 |
-
|
473 |
// Add +1 to degree for nodes that had edges discarded
|
474 |
for (const nodeId of nodesWithDiscardedEdges) {
|
475 |
nodeDegrees.set(nodeId, (nodeDegrees.get(nodeId) || 0) + 1);
|
@@ -482,7 +482,7 @@ const useLightrangeGraph = () => {
|
|
482 |
const degree = sigmaGraph.degree(node);
|
483 |
maxDegree = Math.max(maxDegree, degree);
|
484 |
});
|
485 |
-
|
486 |
// Update maxDegree with new node degrees
|
487 |
for (const [, degree] of nodeDegrees.entries()) {
|
488 |
maxDegree = Math.max(maxDegree, degree);
|
@@ -497,30 +497,30 @@ const useLightrangeGraph = () => {
|
|
497 |
for (const nodeId of nodesToAdd) {
|
498 |
const newNode = processedNodes.find(n => n.id === nodeId)!;
|
499 |
const nodeDegree = nodeDegrees.get(nodeId) || 0;
|
500 |
-
|
501 |
// Calculate node size
|
502 |
const nodeSize = Math.round(
|
503 |
Constants.minNodeSize + scale * Math.pow((nodeDegree - minDegree) / range, 0.5)
|
504 |
);
|
505 |
-
|
506 |
// Get camera ratio from sigma instance for scale adjustment
|
507 |
const cameraRatio = useGraphStore.getState().sigmaInstance?.getCamera().ratio || 1;
|
508 |
-
|
509 |
// Calculate spread factor based on node size and number of nodes
|
510 |
const spreadFactor = Math.max(
|
511 |
nodeToExpand.size * 4, // Base on node size
|
512 |
Math.sqrt(nodesToAdd.size) * 10 // Scale with number of nodes
|
513 |
) / cameraRatio; // Adjust for zoom level
|
514 |
-
|
515 |
// Calculate angle for polar coordinates
|
516 |
const angle = 2 * Math.PI * (Array.from(nodesToAdd).indexOf(nodeId) / nodesToAdd.size);
|
517 |
-
|
518 |
// Calculate final position
|
519 |
-
const x = nodePositions[nodeId]?.x ||
|
520 |
(nodePositions[nodeToExpand.id].x + Math.cos(angle) * spreadFactor);
|
521 |
-
const y = nodePositions[nodeId]?.y ||
|
522 |
(nodePositions[nodeToExpand.id].y + Math.sin(angle) * spreadFactor);
|
523 |
-
|
524 |
// Add the new node to the sigma graph with calculated position
|
525 |
sigmaGraph.addNode(nodeId, {
|
526 |
label: newNode.labels.join(', '),
|
@@ -539,7 +539,7 @@ const useLightrangeGraph = () => {
|
|
539 |
newNode.x = x;
|
540 |
newNode.y = y;
|
541 |
newNode.degree = nodeDegree;
|
542 |
-
|
543 |
// Add to nodes array
|
544 |
rawGraph.nodes.push(newNode);
|
545 |
// Update nodeIdMap
|
@@ -550,7 +550,7 @@ const useLightrangeGraph = () => {
|
|
550 |
// Add new edges
|
551 |
for (const edgeId of edgesToAdd) {
|
552 |
const newEdge = processedEdges.find(e => e.id === edgeId)!;
|
553 |
-
|
554 |
// Skip if edge already exists
|
555 |
if (sigmaGraph.hasEdge(newEdge.source, newEdge.target)) {
|
556 |
continue;
|
@@ -579,7 +579,7 @@ const useLightrangeGraph = () => {
|
|
579 |
if (sigmaGraph.hasNode(nodeId)) {
|
580 |
// Get the new degree of the expanded node
|
581 |
let expandedNodeDegree = sigmaGraph.degree(nodeId);
|
582 |
-
|
583 |
// Check if the expanded node had any discarded edges
|
584 |
if (nodesWithDiscardedEdges.has(nodeId)) {
|
585 |
expandedNodeDegree += 1; // Add +1 for discarded edges
|
|
|
446 |
for (const edge of processedEdges) {
|
447 |
const sourceExists = existingNodeIds.has(edge.source) || nodesToAdd.has(edge.source);
|
448 |
const targetExists = existingNodeIds.has(edge.target) || nodesToAdd.has(edge.target);
|
449 |
+
|
450 |
if (sourceExists && targetExists) {
|
451 |
edgesToAdd.add(edge.id);
|
452 |
} else {
|
|
|
462 |
|
463 |
// STEP 2: Calculate node degrees and sizes
|
464 |
const nodeDegrees = new Map<string, number>();
|
465 |
+
|
466 |
// Calculate degrees from kept edges
|
467 |
for (const edgeId of edgesToAdd) {
|
468 |
const edge = processedEdges.find(e => e.id === edgeId)!;
|
469 |
nodeDegrees.set(edge.source, (nodeDegrees.get(edge.source) || 0) + 1);
|
470 |
nodeDegrees.set(edge.target, (nodeDegrees.get(edge.target) || 0) + 1);
|
471 |
}
|
472 |
+
|
473 |
// Add +1 to degree for nodes that had edges discarded
|
474 |
for (const nodeId of nodesWithDiscardedEdges) {
|
475 |
nodeDegrees.set(nodeId, (nodeDegrees.get(nodeId) || 0) + 1);
|
|
|
482 |
const degree = sigmaGraph.degree(node);
|
483 |
maxDegree = Math.max(maxDegree, degree);
|
484 |
});
|
485 |
+
|
486 |
// Update maxDegree with new node degrees
|
487 |
for (const [, degree] of nodeDegrees.entries()) {
|
488 |
maxDegree = Math.max(maxDegree, degree);
|
|
|
497 |
for (const nodeId of nodesToAdd) {
|
498 |
const newNode = processedNodes.find(n => n.id === nodeId)!;
|
499 |
const nodeDegree = nodeDegrees.get(nodeId) || 0;
|
500 |
+
|
501 |
// Calculate node size
|
502 |
const nodeSize = Math.round(
|
503 |
Constants.minNodeSize + scale * Math.pow((nodeDegree - minDegree) / range, 0.5)
|
504 |
);
|
505 |
+
|
506 |
// Get camera ratio from sigma instance for scale adjustment
|
507 |
const cameraRatio = useGraphStore.getState().sigmaInstance?.getCamera().ratio || 1;
|
508 |
+
|
509 |
// Calculate spread factor based on node size and number of nodes
|
510 |
const spreadFactor = Math.max(
|
511 |
nodeToExpand.size * 4, // Base on node size
|
512 |
Math.sqrt(nodesToAdd.size) * 10 // Scale with number of nodes
|
513 |
) / cameraRatio; // Adjust for zoom level
|
514 |
+
|
515 |
// Calculate angle for polar coordinates
|
516 |
const angle = 2 * Math.PI * (Array.from(nodesToAdd).indexOf(nodeId) / nodesToAdd.size);
|
517 |
+
|
518 |
// Calculate final position
|
519 |
+
const x = nodePositions[nodeId]?.x ||
|
520 |
(nodePositions[nodeToExpand.id].x + Math.cos(angle) * spreadFactor);
|
521 |
+
const y = nodePositions[nodeId]?.y ||
|
522 |
(nodePositions[nodeToExpand.id].y + Math.sin(angle) * spreadFactor);
|
523 |
+
|
524 |
// Add the new node to the sigma graph with calculated position
|
525 |
sigmaGraph.addNode(nodeId, {
|
526 |
label: newNode.labels.join(', '),
|
|
|
539 |
newNode.x = x;
|
540 |
newNode.y = y;
|
541 |
newNode.degree = nodeDegree;
|
542 |
+
|
543 |
// Add to nodes array
|
544 |
rawGraph.nodes.push(newNode);
|
545 |
// Update nodeIdMap
|
|
|
550 |
// Add new edges
|
551 |
for (const edgeId of edgesToAdd) {
|
552 |
const newEdge = processedEdges.find(e => e.id === edgeId)!;
|
553 |
+
|
554 |
// Skip if edge already exists
|
555 |
if (sigmaGraph.hasEdge(newEdge.source, newEdge.target)) {
|
556 |
continue;
|
|
|
579 |
if (sigmaGraph.hasNode(nodeId)) {
|
580 |
// Get the new degree of the expanded node
|
581 |
let expandedNodeDegree = sigmaGraph.degree(nodeId);
|
582 |
+
|
583 |
// Check if the expanded node had any discarded edges
|
584 |
if (nodesWithDiscardedEdges.has(nodeId)) {
|
585 |
expandedNodeDegree += 1; // Add +1 for discarded edges
|
lightrag_webui/src/stores/graph.ts
CHANGED
@@ -189,7 +189,7 @@ const useGraphStoreBase = create<GraphState>()((set, get) => ({
|
|
189 |
},
|
190 |
|
191 |
setMoveToSelectedNode: (moveToSelectedNode?: boolean) => set({ moveToSelectedNode }),
|
192 |
-
|
193 |
setSigmaInstance: (instance: any) => set({ sigmaInstance: instance }),
|
194 |
|
195 |
// Methods to set global flags
|
@@ -447,7 +447,7 @@ const useGraphStoreBase = create<GraphState>()((set, get) => ({
|
|
447 |
// Rebuild the dynamic edge map
|
448 |
state.rawGraph.buildDynamicMap();
|
449 |
}
|
450 |
-
|
451 |
// 图形更新后会自动触发重新布局
|
452 |
|
453 |
} catch (error) {
|
|
|
189 |
},
|
190 |
|
191 |
setMoveToSelectedNode: (moveToSelectedNode?: boolean) => set({ moveToSelectedNode }),
|
192 |
+
|
193 |
setSigmaInstance: (instance: any) => set({ sigmaInstance: instance }),
|
194 |
|
195 |
// Methods to set global flags
|
|
|
447 |
// Rebuild the dynamic edge map
|
448 |
state.rawGraph.buildDynamicMap();
|
449 |
}
|
450 |
+
|
451 |
// 图形更新后会自动触发重新布局
|
452 |
|
453 |
} catch (error) {
|