728x90

이미 뿌려진 그래프의 노드 위치를 확인하고 싶었다.

아래 함수는 특정 id에 해당하는 노드 위치로 카메라 앵글을 이동시킨다.

const handleClick = useCallback((node, ctx) => {
            let new_x=0;
            let new_y=0;
            let new_z=0;
            let i=0;
            console.log(data.nodes); // 모든 node들의 정보가 담겨있음

 

            for (i = 0; i < 3913; i++) {                            
              if(data.nodes[i].id === "10173479"){
                new_x = data.nodes[i].x;
                new_y = data.nodes[i].y;
                new_z = data.nodes[i].z;                
              }              
            }
            // Aim at node from outside it
            const distance = 300;
            const distRatio = 1 + distance/Math.hypot(new_x, new_y, new_z);
 
            fgRef.current.cameraPosition(
              { x: new_x * distRatio, y: new_y * distRatio, z: new_z * distRatio }, // new position
              data.nodes[i], // lookAt ({ x, y, z })
              3000  // ms transition duration
            );
          }, [fgRef]);
728x90

'React' 카테고리의 다른 글

react force graph 선 길이, 노드 색깔 등  (0) 2023.07.09
React 시작하기  (0) 2021.09.04

+ Recent posts