yangdx
commited on
Commit
·
958ad51
1
Parent(s):
588a416
Optimize node spread animation with better spacing and randomized angle offset
Browse files
lightrag_webui/src/hooks/useLightragGraph.tsx
CHANGED
@@ -487,6 +487,17 @@ const useLightrangeGraph = () => {
|
|
487 |
const scale = Constants.maxNodeSize - Constants.minNodeSize;
|
488 |
|
489 |
// STEP 3: Add nodes and edges to the graph
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
490 |
// Add new nodes
|
491 |
for (const nodeId of nodesToAdd) {
|
492 |
const newNode = processedNodes.find(n => n.id === nodeId)!;
|
@@ -497,23 +508,14 @@ const useLightrangeGraph = () => {
|
|
497 |
Constants.minNodeSize + scale * Math.pow((nodeDegree - minDegree) / range, 0.5)
|
498 |
);
|
499 |
|
500 |
-
// Get camera ratio from sigma instance for scale adjustment
|
501 |
-
const cameraRatio = useGraphStore.getState().sigmaInstance?.getCamera().ratio || 1;
|
502 |
-
|
503 |
-
// Calculate spread factor based on node size and number of nodes
|
504 |
-
const spreadFactor = Math.max(
|
505 |
-
nodeToExpand.size * 4, // Base on node size
|
506 |
-
Math.sqrt(nodesToAdd.size) * 10 // Scale with number of nodes
|
507 |
-
) / cameraRatio; // Adjust for zoom level
|
508 |
-
|
509 |
// Calculate angle for polar coordinates
|
510 |
const angle = 2 * Math.PI * (Array.from(nodesToAdd).indexOf(nodeId) / nodesToAdd.size);
|
511 |
|
512 |
// Calculate final position
|
513 |
const x = nodePositions[nodeId]?.x ||
|
514 |
-
(nodePositions[nodeToExpand.id].x + Math.cos(angle) * spreadFactor);
|
515 |
const y = nodePositions[nodeId]?.y ||
|
516 |
-
(nodePositions[nodeToExpand.id].y + Math.sin(angle) * spreadFactor);
|
517 |
|
518 |
// Add the new node to the sigma graph with calculated position
|
519 |
sigmaGraph.addNode(nodeId, {
|
|
|
487 |
const scale = Constants.maxNodeSize - Constants.minNodeSize;
|
488 |
|
489 |
// STEP 3: Add nodes and edges to the graph
|
490 |
+
// Calculate camera ratio and spread factor once before the loop
|
491 |
+
const cameraRatio = useGraphStore.getState().sigmaInstance?.getCamera().ratio || 1;
|
492 |
+
const spreadFactor = Math.max(
|
493 |
+
Math.sqrt(nodeToExpand.size) * 4, // Base on node size
|
494 |
+
Math.sqrt(nodesToAdd.size) * 3 // Scale with number of nodes
|
495 |
+
) / cameraRatio; // Adjust for zoom level
|
496 |
+
const randomAngle = Math.random() * 2 * Math.PI
|
497 |
+
|
498 |
+
console.log('nodeSize:', nodeToExpand.size, 'nodesToAdd:', nodesToAdd.size);
|
499 |
+
console.log('cameraRatio:', Math.round(cameraRatio*100)/100, 'spreadFactor:', Math.round(spreadFactor*100)/100);
|
500 |
+
|
501 |
// Add new nodes
|
502 |
for (const nodeId of nodesToAdd) {
|
503 |
const newNode = processedNodes.find(n => n.id === nodeId)!;
|
|
|
508 |
Constants.minNodeSize + scale * Math.pow((nodeDegree - minDegree) / range, 0.5)
|
509 |
);
|
510 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
511 |
// Calculate angle for polar coordinates
|
512 |
const angle = 2 * Math.PI * (Array.from(nodesToAdd).indexOf(nodeId) / nodesToAdd.size);
|
513 |
|
514 |
// Calculate final position
|
515 |
const x = nodePositions[nodeId]?.x ||
|
516 |
+
(nodePositions[nodeToExpand.id].x + Math.cos(randomAngle + angle) * spreadFactor);
|
517 |
const y = nodePositions[nodeId]?.y ||
|
518 |
+
(nodePositions[nodeToExpand.id].y + Math.sin(randomAngle + angle) * spreadFactor);
|
519 |
|
520 |
// Add the new node to the sigma graph with calculated position
|
521 |
sigmaGraph.addNode(nodeId, {
|