Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

14-3 [FE] [논문 상세 - 네트워크 차트] 검색한 논문과 이를 참조한 논문을 1depth만큼 표현하는 네트워크 그래프를 렌더링 한다. #85

Merged
merged 3 commits into from
Dec 5, 2022

Conversation

yeynii
Copy link
Member

@yeynii yeynii commented Dec 3, 2022

개요

14-3 [FE] [논문 상세 - 네트워크 차트] 검색한 논문과 이를 참조한 논문을 1depth만큼 표현하는 네트워크 그래프를 렌더링 한다.

작업사항

  • 검색한 논문과 참조한 논문들의 관계를 표현하는 네트워크 그래프를 렌더링 합니다.
  • 선택된 노드는 star, 서브노드는 square 모양으로 표시됩니다.
  • 스크롤 zooming이 가능합니다.
  • 마우스 panning이 가능합니다.
  • author를 찾을 수 없는 경우 unknown으로 표시됩니다.

리뷰 요청사항

  • 데모데이를 앞두고 빠른 작업을 위해 몇가지 타입을 any로 처리한 부분이 있습니다. 이는 추후 수정될 예정입니다.

실행화면

Dec-01-2022 23-19-46

@github-actions github-actions bot requested review from leesungbin and Palwol December 3, 2022 05:39
@yeynii yeynii changed the title 14-4 [FE] [논문 상세 - 네트워크 차트] 검색한 논문과 이를 참조한 논문을 1depth만큼 표현하는 네트워크 그래프를 렌더링 한다. 14-3 [FE] [논문 상세 - 네트워크 차트] 검색한 논문과 이를 참조한 논문을 1depth만큼 표현하는 네트워크 그래프를 렌더링 한다. Dec 3, 2022
Comment on lines +18 to +32
const updateLinks = useCallback(
(linksSelector: SVGGElement) => {
d3.select(linksSelector)
.selectAll('line')
.data(links)
.join('line')
.attr('x1', (d) => d.source?.x)
.attr('y1', (d) => d.source?.y)
// .transition()
// .delay((d, i) => (i + 1) * 500)
.attr('x2', (d) => d.target?.x)
.attr('y2', (d) => d.target?.y);
},
[links],
);
Copy link
Collaborator

@Palwol Palwol Dec 5, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

updateLinks와 updateNodes도 useCallback으로 감싸두었으니 custom hook으로 빼도 좋을 것 같습니다.

@Palwol Palwol merged commit ee2a021 into dev Dec 5, 2022
@yeynii yeynii deleted the feature/graph branch December 8, 2022 10:32
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants