본문으로 건너뛰기

사용자 정의 대시보드

사용자 정의 대시보드 페이지에서는 사용자가 직접 대시보드를 생성하고, 필요한 위젯을 배치하여 개인화된 모니터링 환경을 구성할 수 있습니다.

1. 페이지 개요​

1.1 기능 설명​

기능설명
대시보드 생성새로운 사용자 정의 대시보드 생성
위젯 배치드래그 앤 드롭으로 위젯 배치
레이아웃 편집그리드 레이아웃 자유 구성
템플릿 선택기본 템플릿에서 시작
대시보드 공유생성한 대시보드 목록 관리

1.2 접근 경로​

URL: /workgroup/[workgroupId]/customized
메뉴: 대시보드 > 사용자 정의
접근 권한

로그인한 사용자면 조회할 수 있습니다. 생성/편집은 쓰기 권한이 필요합니다.

2. 화면 구성​

2.1 주요 영역​

영역설명
대시보드 목록생성된 사용자 정의 대시보드 목록
그리드 영역위젯이 배치되는 그리드 레이아웃
편집 도구위젯 추가, 레이아웃 편집 도구
카운터 에디터위젯 추가/설정 패널

2.2 UI 구성도​

+--------------------------------------------------+
|  [헤더] 대시보드 이름    [편집] [저장] [취소]     |
+--------------------------------------------------+
|  +------------------------------------------+    |
|  |        위젯 그리드 영역 (12컬럼)          |    |
|  |  +--------+  +--------+  +--------+      |    |
|  |  | CPU    |  | 메모리 |  | TPS    |      |    |
|  |  +--------+  +--------+  +--------+      |    |
|  |  +--------+  +------------------------+  |    |
|  |  | 에러   |  |     XLog 실시간        |  |    |
|  |  +--------+  +------------------------+  |    |
|  +------------------------------------------+    |
+--------------------------------------------------+
|  [카운터 에디터] 위젯 선택 및 설정               |
+--------------------------------------------------+

3. 사용 방법​

3.1 대시보드 생성​

  1. 대시보드 생성 버튼 클릭: 목록 페이지에서 "+" 버튼을 클릭합니다.
  2. 템플릿 선택: 기본 템플릿을 선택하거나 빈 대시보드로 시작합니다.
  3. 이름 입력: 대시보드 이름을 입력합니다.
  4. 생성 완료: 생성 후 자동으로 편집 모드로 진입합니다.

3.2 위젯 추가​

  1. 편집 모드 진입: "편집" 버튼을 클릭합니다.
  2. 위젯 선택: 카운터 에디터에서 추가할 위젯을 선택합니다.
  3. 드래그 앤 드롭: 위젯을 원하는 위치로 드래그합니다.
  4. 크기 조절: 위젯 모서리를 드래그하여 크기를 조절합니다.
  5. 저장: "저장" 버튼을 클릭합니다.
반응형 그리드

그리드는 화면 크기에 따라 자동으로 조정됩니다. Desktop(12컬럼), Tablet(6컬럼), Mobile(1컬럼)을 지원합니다.

3.3 사용 가능한 위젯​

위젯설명
카운터 차트메트릭 라인/바 차트
게이지 차트단일 값 게이지
파이 차트비율 시각화
XLog 실시간실시간 XLog 분포
활성 서비스현재 처리 중인 요청
방문자 수일별/시간별 방문자
이벤트 뷰발생한 이벤트 표시

4. 편집 기능​

4.1 레이아웃 편집​

기능설명
드래그 이동위젯을 드래그하여 위치 변경
크기 조절모서리를 드래그하여 크기 변경
위젯 삭제위젯의 삭제 버튼 클릭
전체 삭제모든 위젯 일괄 삭제

4.2 편집 모드 토글​

  • 편집 모드 ON: 위젯 이동/크기 조절 가능
  • 편집 모드 OFF: 위젯 상호작용만 가능 (차트 줌 등)

5. 데이터 갱신​

5.1 자동 갱신​

  • 갱신 주기: 1초 (실시간)
  • 갱신 방법: WebSocket/Polling

5.2 수동 갱신​

페이지 새로고침 또는 대시보드 재선택 시 데이터가 갱신됩니다.

6. 문제 해결​

6.1 자주 발생하는 문제​

증상원인해결 방법
위젯이 이동되지 않음편집 모드 OFF편집 버튼 클릭
레이아웃이 저장되지 않음권한 없음권한 확인
위젯이 표시되지 않음데이터 없음오브젝트 선택 확인
대시보드가 생성되지 않음권한 없음관리자에게 요청
레이아웃 저장

편집 후 반드시 저장 버튼을 클릭해야 변경 사항이 유지됩니다. 취소 버튼을 클릭하면 변경 사항이 삭제됩니다.

7. 관련 문서​