Org chart

조직도란

조직도(organizational chart)는 조직의 공식 보고 구조를 나타냅니다 — 누가 누구를 관리하는지, 어떤 팀이 어떤 리더 아래에 있는지, 미충원 역할과 외부 자문이 어디에 위치하는지. HR 팀은 인력 계획 시 이를 활용하고, 창업자들은 이사회 미팅 전에 사용하며, 운영 관리자들은 조직 개편 시 배포합니다. 일반 플로우차트와 달리 조직도는 사람(및 직책)을 기본 엔티티로 다루고, 들여쓰기나 명시적 엣지로 계층을 표현합니다.

Schematex는 일반적인 조직도 관례를 따르면서 미충원/공석 직위, 매트릭스(점선) 보고, 보조 관계를 위한 확장 기능을 제공합니다. 조직도에 대한 단일 ISO 표준은 없습니다. 여기에 구현된 관례는 HR 실무와 소프트웨어 업계 규범에서 도출되었습니다. 학술적 배경은 Fayol (1916)과 위키피디아 조직도 문서를 참고하세요.

1. 첫 번째 조직도 만들기

가장 간단한 조직도: 하나의 미충원 역할이 있는 3계층 계층 구조.

80%의 사용 사례를 커버하는 네 가지 규칙:

1. orgchart 키워드로 시작하고, 선택적으로 따옴표로 묶인 제목을 추가합니다.
2. 각 사람은 노드입니다 — id: "이름" | "직책" | "부서" [속성]. |로 이름, 직책, 부서 필드를 구분합니다.
3. 들여쓰기가 계층을 결정합니다 — 두 칸(또는 그 이상) 들여쓰기마다 노드가 바로 위의 덜 들여쓰인 노드 아래 한 레벨 깊어집니다.
4. open id: 또는 draft id:로 미충원 역할을 선언하고, advisor id:로 외부 자문을 선언합니다.

주석은 독립된 줄에서 #으로 시작해야 합니다 (인라인 후행 //도 제거됩니다).

2. 노드

노드 줄의 형식은 [kind] id: fields [props]입니다. id는 [A-Za-z][A-Za-z0-9_-]*와 일치해야 합니다.

2.1 필드 (파이프로 구분)

:과 선택적 [props] 블록 사이의 부분은 |로 분리됩니다:

alice: "Alice Zhang"                                # 이름만
alice: "Alice Zhang" | "VP Engineering"             # 이름 + 직책
alice: "Alice Zhang" | "VP Eng" | "Platform"        # 이름 + 직책 + 부서
alice: "Alice Zhang" | "VP Eng" | "Platform" | "x@co.com"  # + 정보 줄

2.2 노드 종류

ID 앞의 선택적 종류 키워드는 노드 렌더링 방식을 변경합니다:

2.3 노드 속성

속성은 노드 줄 끝의 [key: value, …] 안에 입력합니다.

역할 아이콘 — role: 값은 표시 아이콘으로 변환됩니다. 허용 키워드 (대소문자 무시):

3. 계층 구조

계층은 들여쓰기로 표현합니다 — 가장 일반적인 패턴입니다. 각 노드는 바로 위의 더 적은 들여쓰기를 가진 노드의 자식이 됩니다. 탭은 두 칸으로 처리됩니다.

ceo: "CEO"
  cto: "CTO"           # ceo의 자식 (들여쓰기 2)
    eng: "Engineer"    # cto의 자식 (들여쓰기 4)
  cfo: "CFO"           # ceo의 자식 (들여쓰기 2, cto와 같은 레벨)

또는 reports: 속성을 사용해 들여쓰기에 관계없이 부모를 명시적으로 설정할 수 있습니다:

orgchart "Flat file"
ceo: "CEO"
cto: "CTO" [reports: ceo]
eng: "Engineer" [reports: cto]

4. 엣지

두 가지 종류의 엣지가 있습니다. 대부분의 보고 라인은 들여쓰기 계층에서 자동으로 생성됩니다. 명시적으로 작성하거나 매트릭스(점선) 라인을 추가할 수도 있습니다.

명시적 엣지는 두 노드 ID가 이미 선언되어 있어야 합니다. 명시적으로 생성된 report 엣지는 들여쓰기에 의해 이미 암시된 동일 관계가 있으면 중복 생성되지 않습니다.

엣지 레이블도 지원됩니다:

pm1 -.-> design [label: "product partnership"]

5. 구성

config: 줄로 레이아웃과 방향을 조정합니다. 각 항목은 별도의 줄에 작성합니다.

레이아웃 참고:

• tree — 분기 커넥터가 있는 표준 계층 트리. 대부분의 조직도에 최적.
• list / directory / compact — 컴팩트한 들여쓰기 디렉토리 뷰. 트리 분기가 복잡해지는 대규모 인원 목록에 유용.

Tree 레이아웃 (기본) — 분기 커넥터와 부서 색상 코딩이 있는 아바타 카드. 약 30명 이하의 팀에 최적.

List 레이아웃 — 들여쓰기 가이드가 있는 컴팩트 디렉토리 행. 트리 분기가 복잡해지는 대규모 팀에 최적.

6. 레이블과 주석

• 제목: orgchart "Acme Corp" — 첫 번째 줄에만.
• 이름 필드: 콜론 이후 첫 번째 파이프 구분 필드; 따옴표 있거나("Alice Zhang") 없어도 됨(Alice).
• 직책/부서 필드: 두 번째와 세 번째 파이프 구분 필드.
• 정보 줄: 네 번째 파이프 구분 필드, 또는 note:, email:, phone:, location: 속성으로 설정. 먼저 나오는 것이 우선.
• 주석: 줄 시작의 # (선행 공백 허용). 인라인 //도 제거됩니다.

7. 예약어와 이스케이프

줄 시작 시 예약: orgchart (헤더), config:, role, open, draft, tbh, advisor, external.

예약 연산자 토큰 — ID 안에 이 시퀀스를 피하세요: ->, .->

ID 규칙: [A-Za-z][A-Za-z0-9_-]*와 일치해야 합니다. 공백이 있는 이름은 ID가 아닌 따옴표로 묶인 이름 필드에 입력합니다.

공백이 있는 문자열 (예: department: "Platform Eng")은 큰따옴표로 묶어야 합니다.

8. 자주 발생하는 실수

9. 문법 (EBNF)

document       = header (blank | comment | config | edge | node)*

header         = "orgchart" ( WS quoted-string )? NEWLINE
quoted-string  = '"' any-char-but-quote* '"'

config         = "config" WS ":" WS key WS "=" WS value NEWLINE
key            = "direction" | "layout"

node           = INDENT* kind? id ":" WS fields ( "[" node-attrs "]" )? NEWLINE
kind           = "role" | "open" | "draft" | "tbh" | "advisor" | "external" | "person"
fields         = field ( "|" field )*
field          = quoted-string | unquoted-text
node-attrs     = node-attr ("," node-attr)*
node-attr      = "role:" role-keyword
               | "icon:" role-keyword
               | "department:" text
               | "status:" ( "new" | "leaving" | "on-leave" )
               | "avatar-color:" quoted-hex
               | "gender:" ( "male" | "female" )
               | "note:" text
               | "email:" text
               | "phone:" text
               | "location:" text
               | "assistant-of:" id
               | "matrix:" id-list
               | "reports:" id
               | bare-flag

bare-flag      = "open" | "draft" | "tbh" | "external"

edge           = id WS edge-op WS id ( "[" edge-attrs "]" )? NEWLINE
edge-op        = "->" | ".->"  // -.-> for matrix
edge-attrs     = "label:" quoted-string

id             = [A-Za-z] [A-Za-z0-9_-]*
comment        = ( "#" | "//" ) any NEWLINE

권위 있는 소스: src/diagrams/orgchart/parser.ts. 이 문서와 파서가 다를 경우 파서가 우선입니다 — 이슈를 열어주세요.

10. 로드맵

계획 중 — 아직 파싱 불가. 오늘 생성된 DSL에서 이것들을 사용하지 마세요; 파서가 거부하거나 무시합니다.

• assistant-of: 시각적 렌더링 — 속성은 파싱되어 AST에 저장되지만 렌더러가 아직 보조 팔꿈치 커넥터를 그리지 않습니다.
• Config coloring — 부서 기반 색상 테마 (coloring: department).
• Config compact 크기 단계 — 명시적 카드 크기 제어 (size: small | medium | large).
• span: 노드 너비 — 트리 레이아웃에서 노드가 여러 형제 열에 걸쳐 표시.
• 사진 / 아바타 URL — avatar: "https://…"로 실제 사진 표시.
• HRIS 형식으로 내보내기 — SVG 외에 JSON/CSV 구조적 출력.

더 빨리 필요하다면 GitHub 이슈에서 추적하세요.

관련 예시

예시 갤러리에서 바로 사용 가능한 시나리오: