AUIPivot 그리드는 사용자 관점에서 다양하게 정보를 분석할 수 있게 하는 OLAP(On-Line Analytical Processing) 도구 입니다.
원시 데이터(source data) 를 통해 사용자가 다차원에서 접근할 수 있도록 합니다.
이 원시 데이터가 AUIPivot 의 피벗팅 대상이 되는 JSON 데이터 입니다.
일반적으로 데이터 베이스(Database) 에 보관된 유형 그대로를 AUIPivot 에 삽입하여, 개별 필드가 차원 항목이 되어 다차원을 구성할 수 있도록 합니다.
차원에는 다음 4가지를 갖습니다.
l 행(rows)
l 열(columns)
l 값 또는 변수(values, variables)
l 필터(filters)
이는 OLAP 의 기본 이론이며 개별 필드 항목을 통해 큐브(Cube) 로 많이 표현됩니다.
AUIPivot 을 표현하기 위해서 원시 데이터 + 다차원(행, 열, 값, 필터) 정보가 필요합니다. 이를 도식화 하면 다음과 같습니다.
|
|
위의 그림에서 보듯이 원시 데이터(JSON 데이터) 그리고 피벗 필드(행, 열, 값, 필터) 가 정해짐으로써 사용자의 요구사항에 맞는 분석된 정보를 도출해 낼 수 있습니다.
이를 AUIPivot 에서 어떻게 코딩하는지 살펴 보도록 하겠습니다.
원시 데이터는 Ajax 요청을 통해 응답으로 받아 적용시키고, 그 응답 받은 데이터를 대상으로 원하는 관점에 맞게 각각의 필드를 피벗 대상 차원에 대입 합니다.
아래는 위의 그림을 그대로 코딩으로 표현한 내용입니다.
|
//데이터 요청 function requestData() {
// ajax 로더 표시 AUIPivot.showAjaxLoader(myPivotID);
// ajax (XMLHttpRequest) 로 그리드 데이터 요청 ajax( { // 원시 데이터 요청 URL url : “car_sales.json”, onSuccess : function(data) {
// 피벗 그리드 해당 데이터로 초기화 및 피벗팅 시작 initPivotData(data);
// 로더 제거 AUIPivot.removeAjaxLoader(myPivotID); }, onError : function(status, e) { alert("데이터 요청에 실패하였습니다.\r status : " + status); // 로더 제거 AUIPivot.removeAjaxLoader(myPivotID); } }); };
//피벗 그리드 해당 데이터로 초기화 및 피벗팅 시작 function initPivotData(data) {
// 행필드 AUIPivot.setRowFields(myPivotID, ["REGION", "NAME", "MODEL"]);
// 열 필드 AUIPivot.setColumnFields(myPivotID, [ "DATE_HALF", "DATE_QTR", "DATE_MONTH"]);
// 필터 필드, 원하면 주석 제거 //AUIPivot.setFilterFields(myPivotID, ["COLOR"]);
// 값 필드 AUIPivot.setValueFields(myPivotID, [{"dataField":"TOTAL", "operation":"SUM"}]);
// 피봇그리드에 데이터 삽입 AUIPivot.setGridData(myPivotID, data); }; |
요약하면, AUIPivot 을 표현하기 위해서는 원시 데이터에 해당되는 JSON(즉, 피벗 대상 데이터)과 차원에 대입될 개별 필드들(행, 열, 값, 필터)만 설정하면 됩니다.
