L3 의 정의와 예시
L3 = 부모 컴포넌트의 항목 안에 다른 유형의 컴포넌트가 들어간 것
components:
- type: Enumeration.List
structure:
entities:
- label: 규제 압박
- label: 공공 신뢰
- label: 핵심 지표
components: # ← L3 는 이 칸을 쓴 것
- type: KPIKeyMetric.BigNumber근거(규약 v0.5.6)
| 근거 | 내용 |
|---|---|
| 8.8 복잡도 레벨 | 레벨을 가르는 축은 하나 — entity.components[] 를 쓰느냐. L1 단일 · L2 병치 · L3 포함까지 |
| 8.7 중첩 컴포넌트 | 자식은 부모 entity(슬롯)에 매단다. 중첩을 못 읽으면 자식 entities 를 부모 items 로 편다(평탄화) |
| 8.7 위상 관계 | Containment = 한 category 의 시각 영역이 다른 category 영역 안에 완전히 들어감 |
| 6절 유형 = 표현형 | type 은 같은 내용을 어떤 모양으로 그리는지를 정한다 — 다른 유형이면 다른 그림이다 |
| capability-table 3.2 | 유형마다 List 로 물러날 때 잃는 것(예: BigNumber 「수치의 크기 강조」, BarChart 「수치의 상대 크기」) |
L3 가 타당한 상황 — 두 질문이 모두 예
Q1 포함자식의 시각 영역이 부모 컴포넌트 영역 안에 완전히 들어간다(8.7)
부모 항목 수는 따지지 않는다 — 항목이 하나여도, 부모 외곽 안에 함께 있으면 병치가 아니라 포함이다.
Q2 표현자식이 부모가 자기 items 를 그리는 방식과 다른 표현형으로 그려져 있다
접어서 부모 items 로 그리면 그림이 달라진다 — 큰 수 · 차트 · 표 격자 · 강조 상자 · 단계 도형 등. 글형 · 데이터형으로 미리 가르지 않고 그림으로 판정한다.
이 페이지의 판정 기준은 11/06 초안이다. 경계 밖 제목 · 설명(위성)은 부모 외곽이 없어 이 정의의 포함이 아니다 — 장 3 (나) 참고.
규약 기준으로 L3 가 타당한 템플릿은 2.7 DO 의 0.42% 다
196,080I.I.S. 경계가 있는 2.7 DO
2,172I.I.S. 가 Containment 관계로 표시
1,383포함 후보(유형 무관) — 데이터형 269 · 구조형 135 · 글형 979
822썸네일 눈 확인으로 확정
자식 유형별 확정 / 대상
822 는 DO 수다 — 같은 템플릿 계열이 여러 DO 로 들어 있다(예: 「코로나 이전/이후 기업 인재상」 7 DO).
I.I.S. 가 포함을 놓친 DO · 한 DO 안에 자식 유형이 섞인 DO 는 세지 않았다.
그림이 작아 판단하지 못한 198 DO(주로 HighlightedMessage · QuoteTestimonial)는 확정에서 뺐다 — 원본 크기로 다시 보면 늘 수 있다.
정당한 L3 · 애매하지만 아닌 것 · 명백히 아닌 것
주황 = 부모 항목(번호) · 파랑 = 자식 경계. 그림을 누르면 원본이 커진다.
정당한 L3 Q1 · Q2 모두 예
DO 11640585List ⊃ BigNumber
항목 셋 중 마지막 항목에만 큰 수. 접으면 「14X OVER LIMIT」 가 글 한 줄이 된다
항목 셋 중 마지막 항목에만 큰 수. 접으면 「14X OVER LIMIT」 가 글 한 줄이 된다
DO 10406367LongFormTextLayout ⊃ BigNumber
부모 항목은 하나지만 부모 외곽 안에 큰 수가 든다 — 접으면 강조가 사라진다
부모 항목은 하나지만 부모 외곽 안에 큰 수가 든다 — 접으면 강조가 사라진다
DO 14873931Transformation ⊃ BarChart
전 · 후 항목마다 막대 차트. 차트는 글로 접히지 않는다
전 · 후 항목마다 막대 차트. 차트는 글로 접히지 않는다
DO 15238560List ⊃ Gauge
항목 안 게이지
항목 안 게이지
DO 10490562Transformation ⊃ HierarchicalTree
항목 안 연결선 트리
항목 안 연결선 트리
DO 11607385Transformation ⊃ Steps
전 · 후마다 단계 도형(쉐브론)
전 · 후마다 단계 도형(쉐브론)
DO 10837922LongFormTextLayout ⊃ HighlightedMessage
강조 문장 하나가 파란 강조 상자로 그려진다 — 부모 items 로 접으면 강조가 사라진다
강조 문장 하나가 파란 강조 상자로 그려진다 — 부모 items 로 접으면 강조가 사라진다
DO 12136608Steps ⊃ List
단계 안에 상자 칸 넷이 격자로 그려진다 — 부모 items 글 줄로 접으면 그림이 달라진다
단계 안에 상자 칸 넷이 격자로 그려진다 — 부모 items 글 줄로 접으면 그림이 달라진다
애매하지만 아닌 것 유형 표시는 있으나 접어도 그림이 같다(Q2 아니오)
DO 12744937List ⊃ Timeline
Timeline 으로 표시됐지만 부모 항목과 같은 글 줄 — 접어도 그림이 같다
Timeline 으로 표시됐지만 부모 항목과 같은 글 줄 — 접어도 그림이 같다
DO 13723379List ⊃ Timeline
연도 알약이 붙은 글 줄, 시간축 없음 — 부모 항목 글 줄과 같은 모양이다
연도 알약이 붙은 글 줄, 시간축 없음 — 부모 항목 글 줄과 같은 모양이다
DO 13335115List ⊃ ListingTable
ListingTable 로 표시됐지만 격자 없는 키-값 줄 — 접어도 그림이 같다
ListingTable 로 표시됐지만 격자 없는 키-값 줄 — 접어도 그림이 같다
DO 10426139LongFormTextLayout ⊃ BigNumber
BigNumber 로 표시됐지만 글 속 숫자뿐, 강조 없음 — 접어도 그림이 같다
BigNumber 로 표시됐지만 글 속 숫자뿐, 강조 없음 — 접어도 그림이 같다
DO 14947797HighlightedMessage ⊃ BigNumber
BigNumber 로 표시됐지만 작은 글자 수치뿐 — 접어도 그림이 같다
BigNumber 로 표시됐지만 작은 글자 수치뿐 — 접어도 그림이 같다
DO 13117170List ⊃ BigNumber
BigNumber 로 표시됐지만 다른 항목과 같은 글 한 줄 — 접어도 그림이 같다
BigNumber 로 표시됐지만 다른 항목과 같은 글 한 줄 — 접어도 그림이 같다
명백히 아닌 것
유형은 달라도 부모 items 그림과 같다 — Q2 아니오
DO 12820689Versus ⊃ List
양쪽 칸 안 번호 글 줄 — 유형은 달라도 부모가 items 를 그리는 모양과 같다, 접어도 그림이 그대로다
양쪽 칸 안 번호 글 줄 — 유형은 달라도 부모가 items 를 그리는 모양과 같다, 접어도 그림이 그대로다
DO 9334567LongFormTextLayout ⊃ List
본문 안 글 줄 — 유형은 달라도 부모 items 글 줄과 같은 모양이다, 접어도 그림이 그대로다
본문 안 글 줄 — 유형은 달라도 부모 items 글 줄과 같은 모양이다, 접어도 그림이 그대로다
외곽선이 없다 — 병치, Q1 아니오 (파랑 = 데이터 컴포넌트 · 주황 = 제목 · 설명 글, 둘을 감싸는 부모 경계는 없다)
DO 14236712LineAreaChart + 제목 · 부제 글
제목 · 부제 아래에 차트가 놓였을 뿐 둘을 감싸는 외곽이 없다 — 포함으로 보려면 없는 외곽선을 그어야 한다
제목 · 부제 아래에 차트가 놓였을 뿐 둘을 감싸는 외곽이 없다 — 포함으로 보려면 없는 외곽선을 그어야 한다
DO 14011803BarChart + 설명 글
차트와 아래 설명 글이 나란히 놓였을 뿐 감싸는 외곽이 없다 — 포함으로 보려면 없는 외곽선을 그어야 한다
차트와 아래 설명 글이 나란히 놓였을 뿐 감싸는 외곽이 없다 — 포함으로 보려면 없는 외곽선을 그어야 한다
DO 13843328PieChart + 제목 글
제목 글이 차트 위에 있을 뿐 둘을 감싸는 상자 · 배경 면이 없다 — 외곽선을 새로 그어야 포함이 된다
제목 글이 차트 위에 있을 뿐 둘을 감싸는 상자 · 배경 면이 없다 — 외곽선을 새로 그어야 포함이 된다
DO 14048846BigNumber + 제목 · 설명 글
큰 수 카드 위아래에 글이 놓였을 뿐 감싸는 외곽이 없다 — 포함으로 보려면 없는 외곽선을 그어야 한다
큰 수 카드 위아래에 글이 놓였을 뿐 감싸는 외곽이 없다 — 포함으로 보려면 없는 외곽선을 그어야 한다