마스터 그리드의 항목을 더블 클릭하면 별도로 구성해놓은 폼을 팝업창으로 띄워 상세 데이터를 즉각적으로 탐색하고 분석할 수 있는 마스터-디테일 (Master-Detail) 팝업 레이아웃입니다.

 light-on (on) 레이아웃 구조


(star) 적용 사례


  • [공공] 주요 사업 예산 집행 현황
    전체 현황 : 기관 총 예산, 경상운영비 집행률, 주요 사업비 집행률 등
    상세 분석 : '주요 사업비' 클릭 시, 해당 사업의 소속기관별 집행액 내역 추적 / 부서별 예산 집행 지연 사유 파악하는 심층 데이터 및 원인 분석

  • [제조·유통] 생산 라인 가동 및 공정 불량 현황
    * 전체 현황 : 전사 공장 종합 가동률, 목표 생산량 대비 달성률, 핵심 공정별 누적 불량률 등 
    상세 분석 : 특정 '공장 종류' 클릭 시, 불량이 집중된 공장 라인 / 근무조 및 설비 노후도와의 상관관계를 도출하는 공정 지연 및 수율 하락 원인 분석

  • [의료] 권역별 병상 가동 및 중증 환자 수용 현황
    * 체 현황 : 전체 가용 병상 수, 중환자실 가동률, 응급실 병상 평균 대기 시간 등
    상세 분석 : '중환자실 가동률' 포화 지표 클릭 시, 권역별 대형 병원 실시간 병상 여력 / 진료과별 전문 의료진 배치 현황 분석으로 응급환자 수용 불가 원인 및 병목 구간 진단




(정보) 레이아웃 활용 팁


  • 최상단 핵심 요약 KPI 카드

    • 화면 최상단에는 데이터 분석의 대주제가 되는 최상위 핵심 결과값을 카드 형태로 넓게 배치하세요.
      예) 총인원, 전체 예산, 전사 실적 등

    • 사용자가 하단 영역에서 다양한 조건을 클릭하며 상세 데이터를 파고 들더라도, 가장 중요한 기준점을 시야에서 잃지 않고 비교 분석할 수 있도록 돕습니다.


  • 좌측 마스터와 우측 상세 화면 연동
    • 좌측 패널에서 특정 요약 항목을 클릭하면, 우츨 영역의 데이터가 해당 조건에 맞춰 즉시 재구성되도록 하세요.
      예) 시트1은 좌측 마스터 그리드 영역에, 시트2는 우측 요약 정보 영역에 독립적으로 구성
    • 콤보박스나 필터 조건 조작할 필요 없이, 마우스 클릭으로 직관적인 데이터 탐색 동선을 최적화할 수 있습니다.


  • 이미지 배치를 활용한 지리적/공간적 시각화 (우측 상단)

    • 우측 상단의 이미지 영역에는 직관적인 그래픽 이미지를 배치하여 활용하세요.
      예) 대한민국 지도, 관할 구역 도면 등

    • 소속기관별 현황이나 시설물 위치 등 지리적인 분포가 중요한 데이터를 지도 이미지 위에 배치한 레이블 컴포넌트로 출력하여 입체적이고 직관적인 데이터 분석을 지원합니다. 


  • Chart-EX 컴포넌트를 활용한 고도화된 차트 분석 (우측 하단)
    • 우측 하단 영역에는 Chart-EX(차트 컴포넌트)를 배치하여 시각화 분석의 깊이를 더해 보세요.
    • 기본적인 막대/선 차트를 넘어, 히트맵(Heatmap)이나 캔들 차트(Candlestick)와 같은 고도화된 하이 차트(High Chart)를 적용하여 다차원 데이터의 밀도,
      이상치 분포 또는 시계열 변동 추이를 한눈에 파악할 수 있습니다.