데모피벗 북다중 테이블
하나의 피벗북에서 서로 다른 관점의 피벗 테이블 3개를 비교하는 데모입니다.
주요 특징
tables에 속성에 목록형태로 설정할 수 있으며 하단 탭바로 전환합니다. 데이터·큐브·공통 필터는 북 전체가 공유하므로, 같은 데이터를 여러 관점으로 나눠 담은 보고서가 됩니다.
| 탭 | 축 구성 | 값 |
|---|---|---|
| 채널 실적 | 행 유입 채널 X 열 년도 | 주문 금액 · 주문 건수 |
| 상품 분기 추이 | 행 상품 X 열 년도·분기 | 주문 금액 (천 단위 축약) |
| 결제수단 구성비 | 행 결제 수단 X 열 년도 | 열 비중 + 데이터바 |
- 각 테이블마다 소계·총계·오버레이도 테이블마다 다르게 설정합니다. "상품 분기 추이" 테이블에는 크로스헤어를, "결제수단 구성비" 테이블은 데이터바를 설정합니다.
- 상단 필터(주문 상태 · 주문 기간)는 북 공통이라 어느 탭에서 바꿔도 세 테이블에 함께 반영됩니다. 탭을 옮겨 가며 같은 조건의 결과를 비교할 수 있습니다.
코드로 지정하기
const config = {
footer: {
tabBar: { visible: true }, // 하단 페이지 전환 탭
},
tables: [
{
name: '채널 실적', // 탭에 표시되는 이름
cube: 'ordersPivot',
fields: { rows: ['유입 채널'], columns: ['년도'], values: ['주문 금액'] },
},
{
name: '상품 분기 추이',
cube: 'ordersPivot',
fields: { rows: ['상품'], columns: ['년도', '분기'], values: ['주문 금액'] },
body: { crosshair: true }, // 이 테이블에만 적용
},
],
// 북 공통 필터 — 모든 테이블에 함께 적용된다
filterSelectors: [
{ type: 'button', cube: 'ordersPivot', slicer: '주문 상태', position: 'header' },
],
};행 헤더 표현을 탭마다 바꾸는 예는 레이아웃에서, 북 공통 옵션과 tableDefaults로 속성을 공유하고 테이블마다 일부 속성만 덮어쓰는 예는 공통 옵션에서 볼 수 있습니다.
더 자세한 내용은 피벗 북(Book) 가이드에서 확인할 수 있습니다.
플레이그라운드를 불러오는 중…