...
1. V1시트의 지표들을 데이터 시트인 T1 시트로 이동하여 각 셀에 해당 지표 값과 연결
(참고) 데이터 시트 - T1, T2 시트
1.2 V2시트 시간대별 매출 추이 생성
- V2 시트에서는 시간대별 매출 추이를 생성하고,
SUMIFS집계함수와 시간대 파생공법을 사용하여 데이터를 집계합니다 - V2시트의 데이터 시트인 T2시트로 T3시트로 이동하여 SUMIF함수를 이용하여 집계할 수 있도록 시간대 항목을 파생합니다.
시간대 파생 함수 =LEFT(C2,2)&"시"
- V2시트에 SUMIFS 이용 T2의 T3의 데이터 시트와 연결
- 시간대별 매출액 시각화 차트 생성을 위해 _D_예약어 지정 _D_예약어 ☜ 상세 가이드 참조하기
- 상품별 매출액 정보에 시각 정보를 더하기 위해 조건부 서식 지정하여 큰 값일 수록 진한 색이 표시되게 설정합니다.
- 셀 값을 기준으로 서식을 지정 > 2가지 색조 선택 > 색상 선택 후 확인
1.3 V3시트 상품별 매출 실적 생성
- V3 시트에서는 상품별 매출 실적을 표시하고, 조건부 서식을 이용해 달성률에 평균 단가에 따라 아이콘을 데이터 막대를 표시합니다.
- 달성율 평균 단가 영역 지정 후 조건부 서식 → 아이콘 집합 → 평점5 아이콘 지정
새 규칙 → 셀 값을 기준으로 모든 셀의 서식 지정 → 서식 스타일 : 데이터 막대 → 채우기 색상 지정
Step 2. 웹 화면 전환
- 완성된 Excel 파일을 Template 편집 화면에 배치하여 웹으로 전환합니다.
Step 3. 데이터 연결
MX-Grid의 데이터 시트인 T1 시트와 , T2, T3 시트에 DB봇을 활용하여 실 데이터를 연결합니다.
MX-Grid> 우 클릭> 디자인 모드로 이동합니다.
3.1 T1시트 데이터 연결
1. 데이터 연결 시 지정한 조회 조건에 따라 데이터를 불러오기 위해 T1으로 이동하여 [A1G1] 셀 클릭 후 후, VS_YM으로 이름 정의합니다.
2. [i-MATRIX] 도구 [DB Bot]을 클릭합니다.
2. PPDM > Sample > 3. i-META >매출분석 클릭
조회항목: 년월, 매출원가, 매출목표, 매출금액
조회조건: 년월 :VS_YM 입력
3. [예] 버튼 클릭
3.2 T2시트 데이터 연결
- T2로 이동하여 [A1] 셀 클릭 후 [i-MATRIX]도구 [DB Bot]을 클릭합니다.
- PPDM > Sample > 3. i-META >매출분석 클릭
조회항목: 상품대분류기준년월, 상품중분류, 고객매출시간대, 매출목표, 매출금액
조회조건: 년월 기준년월 :VS_YM 입력
- [예] 버튼 클릭
3.3 T3시트 데이터 연결
- T3로 이동하여 [A1] 셀 클릭 후 [i-MATRIX]도구 [DB Bot]을 클릭합니다.
- PPDM > Sample > 3. i-META >매출분석 클릭
조회항목: 상품대분류, 상품중분류, 고객매출시간대, 매출수량, 매출금액
조회조건: 년월 :VS_YM 입력
- [예] 버튼 클릭
Step 4. MX-Grid 예약어 활용
_EXPAND_?__?? : 특정 행/열에 대한 확장/축소 기능 (확장 상태)
_EXPAND_?__?? : 상품대분류별로 지정한 행의 칸 수 만큼 확장/축소하여 매출목표매출수량, 매출금액, 달성율을 평균 단가를 확인할 수 있습니다. MX-Grid 예약어 ☜ 상세 가이드 참조하기
- V3 시트 상품대분류 이름 정의
- A2 → _EXPAND_3__6
- A7 → _EXPAND_8__11
- A12 → _EXPAND_13__16
- A17 → _EXPAND_18__22
- A23 → _EXPAND_24__27
- A2 → _EXPAND_3__6
Step 5. MX-Grid 전용 함수 활용(AUD_xxx)
AUD_IMAGE : 이미지를 셀에 출력하는 기능
- AUD_IMAGE : 매출 목표와 매출 금액의 차이 값에 따라 상승/하락 이미지를 표시합니다. AUD_IMAGE ☜ 상세 가이드 참조하기
- V_image 시트의 이미지를 참조하여 셀 값이 0보다 크거나 작은 경우에 서로 다른 이미지를 셀에 출력하는 기능을 활용합니다. (이미지 이름 정의 확인)
- V1 시트의 특정 셀에 함수를 입력합니다.
사용 수식 : =IF(L2 > 0, AUD_IMAGE(":차이상"), AUD_IMAGE(":차이하"))
- [i-MATRIX] 리본메뉴 Save 버튼으로 저장 후 MX-Grid 디자인 화면은 도구 Save 버튼을 클릭하고 화면을 닫습니다.
...
Step 6. ActiveSheet 활용 MX-Grid 화면 배치
MX-Grid 내 V1, V2,V3 시트를 분할하여 원하는 영역에 배치 합니다.
- V1 시트의 주요지표 주요 지표 영역이 표시되도록 상단 매출 실적 요약 부분에 배치 합니다.
- V2시트와 V3시트도 화면에 배치되도록 MX-Grid 컨트롤 클릭 후 [i-MATRIX]에 주소를 복사합니다.
- V2 시트를 배치하기 위해서 UI Bot >MX-Grid 컴포넌트를 생성합니다.
- 복사한 [i-Matrix] 주소를 새로운 MX-Grid 속성창에 붙여넣기 하고 ActiveSheet 에 V2로 ActiveSheet에 V2, ParentGrid에 MXGrid를 입력합니다.
- 동일한 방법으로 V3도 신규 MX-Grid를 이용하여 배치합니다.
- MX-Grid Background 색상 제거 : 속성창 Style탭 Background A값을 0 으로 표기
- MX-Grid 파량색 Line색 제거 : 속성창 Style 탭에서 Border영역에 Line Type을 none으로 선택
Step 6. Chart 생성
...
- UI Bot> Chart> Chart 클릭합니다.
- 생성된 차트 속성에 NAME은 TIME 으로 기입하고 , Event에 AutoRefresh 를 활성화합니다.
기입합니다.
- 해당 차트는 V2시트에 _D_예약어를 활용한 데이터 소스가 바인딩 되어 차트에 나타납니다.
_D_컨트롤 이름 예약어는 MX-GRID에서 내 데이터를 i-AUD컨트롤에 출력할 수 있습니다. _D_예약어 활용하기 ☜ 상세 가이드 참조하기
...
Step 7. Process Bot 활용 이벤트 지정
- Process Bot > Activities 탭에서 필요한 모듈을 검색하고, 더블 클릭하여 배치합니다.
- 조회 버튼을 클릭할 때 MXGrid, MXGrid2, MXGrid3, TIME 컨트롤을 MXGrid를 Refresh 합니다.
Process Bot 사용하기 ☜ 상세 가이드 참조하기
- TIME차트에 MAX값에 대해 별도 색상을 표기 합니다.
기본 색상값 HEX : #2797FA
MAX 색상값 HEX : #EA5A40
설정 완료 화면 입니다
- 조회 버튼(Button)과 생성한 막대 차트(TIME) 컨트롤을 선택하여 Process Bot에 배치 후 모듈과 연결합니다.
Step 8. 차트 속성 설정하기
...