레이아웃과 편집 모드

타일을 어디에 두고 얼마나 크게 할지 정하는 방법, 그리고 창을 좁혔을 때의 동작입니다.

12 칼럼 그리드

대시보드는 12 칼럼 그리드입니다. 타일은 폭 1~12 칼럼, 높이 1~4 행을 차지하고 1 행은 약 118px(숫자 한 줄 높이)입니다.

새 타일은 격자의 첫 빈 자리로 들어갑니다.

높이 '자동' 은 없습니다. 표 타일을 행 수에 맞춰 늘리면 주기 갱신마다(10 행 → 3 행 → 12 행) 대시보드 전체 배치가 튀기 때문입니다. 내용이 넘치면 타일 안에서 스크롤합니다.

12 칼럼 그리드에 크기가 서로 다른 타일들이 놓인 대시보드

편집 모드

툴바 [편집] 을 누르면 자리와 크기를 바꿀 수 있습니다. 세 가지 조작 방법을 모두 둡니다.

편집 모드 — 타일 머리의 끌기 손잡이와 오른쪽 아래 크기 조절 손잡이
방법설명
끌어서 이동타일을 원하는 자리로 끌어 놓습니다.
우하단 핸들끌면 칼럼 · 행 단위로 스냅됩니다. 끄는 동안 현재 크기가 6×2 처럼 배지로 표시됩니다.
크기 메뉴타일 머리의 크기 버튼에서 폭 1/4 · 1/3 · 1/2 · 2/3 · 전체 와 높이 1~4 를 바로 고릅니다. 여러 타일의 폭을 정확히 맞출 때 빠릅니다.
키보드타일을 선택한 뒤 Alt + ← / → 로 폭, Alt + ↑ / ↓ 로 높이를 바꿉니다.

편집을 끄면 그 상태로 저장됩니다. 타일 삭제 · 설정 · 새로고침은 편집 모드가 아니어도 타일 머리의 버튼으로 할 수 있습니다.

표시 형태별 최소 · 최대 크기

읽을 수 없는 타일과 빈 공간만 늘어나는 타일을 애초에 만들 수 없게, 형태마다 범위가 정해져 있습니다.

표시 형태최소최대비고
숫자(단일값)2×112×2숫자와 캡션만 그리므로 2 행을 넘으면 전부 빈 공간입니다. 폭은 제한하지 않습니다 — 전체폭 숫자 띠는 흔한 배치입니다.
막대 · 세로 막대3×212×4라벨이 잘리기 시작하는 경계가 폭 3 칸입니다.
파이 · 도넛3×26×4원의 지름이 짧은 변으로 정해져, 폭을 더 늘리면 좌우 여백만 늘어납니다.
선 · 영역 · 산점도4×212×4축 눈금이 읽히는 최소 폭이 4 칸입니다.
표4×212×4머리말 + 3 행 + 컬럼 3 개가 들어가는 최소치입니다.

최소치 아래로는 끌리지 않습니다. 표시 형태를 바꿔 현재 크기가 범위를 벗어나면 자동으로 보정합니다 — 12×4 표를 숫자로 바꾸면 높이가 줄어듭니다.

단일값 타일의 스파크라인은 폭 3 칸 이상일 때만 그립니다. 그보다 좁으면 선이 눌려 오르내림이 보이지 않습니다.

좁은 화면

창이 좁아지면 칼럼 수가 줄어듭니다. 이때 저장된 폭은 바뀌지 않습니다 — 정해 둔 폭은 '이만큼 차지한다' 가 아니라 '최대 이만큼' 으로 해석합니다.

패널 폭동작
1200px 이상12 칼럼 그대로
900 ~ 1200px6 칼럼으로 접음
900px 미만한 줄에 타일 하나
창을 좁혔을 때 타일이 한 칼럼으로 접힌 모습

접힌 상태에서는 편집 모드가 열리지 않습니다. 접힌 기준으로 저장하면 큰 화면으로 돌아갔을 때 배치가 망가지기 때문입니다. 창을 넓히면 열립니다.