antvis/X6

어떤 프로젝트인가요?

핵심 기능

• 01SVG와 HTML로 노드와 엣지를 렌더링합니다.
• 02SVG, HTML, React, Vue 또는 Angular를 사용해 노드 스타일과 인터랙션을 사용자 지정할 수 있습니다.
• 03올가미 선택, 정렬 가이드라인, 미니맵 등의 확장 기능을 기본 제공합니다.
• 04포괄적인 이벤트 시스템을 갖춘 데이터 중심 MVC 아키텍처를 제공합니다.
• 05서버 사이드 렌더링을 지원합니다.

활용 사례

• 웹 애플리케이션에서 DAG 또는 워크플로 편집기 구축
• 엔티티 관계(ER) 다이어그램 도구 제작
• 플로차트 또는 리니지 그래프 시각화 개발
• React, Vue 또는 Angular 프런트엔드에 인터랙티브 다이어그램 기능 추가

빠른 시작

1. 1

   npm으로 패키지를 설치합니다

   npm install @antv/x6 --save
2. 2

   Graph를 가져와 컨테이너 요소에 그래프를 생성합니다

3. 3

   그래프에 노드와 엣지를 추가합니다

포함된 컬렉션

토픽

자주 묻는 질문

X6은(는) 무엇인가요?

SVG와 HTML을 기반으로 DAG, ER, 플로차트, 리니지 다이어그램을 편집하고 시각화하는 TypeScript/JavaScript 그래프 엔진입니다. AntV X6는 노드와 엣지를 SVG 및 HTML로 렌더링하는 TypeScript 기반 그래프 편집 엔진입니다. 처음부터 만들 필요 없이 DAG 다이어그램, ER 다이어그램, 플로차트, 리니지 그래프 같은 인터랙티브 다이어그램 애플리케이션을 구축할 수 있습니다.

X6은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

X6은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

X6은(는) 아직 유지보수되고 있나요?

활발히 유지보수 중. X6의 마지막 커밋은 2026년 10월 23일입니다.

X6은(는) 어디에 사용할 수 있나요?

웹 애플리케이션에서 DAG 또는 워크플로 편집기 구축 엔티티 관계(ER) 다이어그램 도구 제작 플로차트 또는 리니지 그래프 시각화 개발 React, Vue 또는 Angular 프런트엔드에 인터랙티브 다이어그램 기능 추가

X6는 어떻게 설치하나요?

npm으로 패키지를 설치합니다: npm install @antv/x6 --save Graph를 가져와 컨테이너 요소에 그래프를 생성합니다 그래프에 노드와 엣지를 추가합니다

X6은(는) 어디서 받을 수 있나요?

소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/antvis/X6