πŸŽ‰ RealPivot2 v2.0.0 μΆœμ‹œ! μžμ„Ένžˆ 보기 β†’
κ°€μ΄λ“œ
ν•„ν„°

ν•„ν„°

뢁 곡톡 ν•„ν„°(λ“œλ‘­λ‹€μš΄Β·νŠΈλ¦¬Β·μŠ¬λΌμ΄λ” λ“±)와 νŽ˜μ΄μ§€ ν•„ν„° ν•„λ“œ, 큐브 ν•„ν„°λ₯Ό μ„€λͺ…ν•œλ‹€.

RealPivot2μ—μ„œ ν•„ν„°λŠ” 적용 λ²”μœ„μ— 따라 λ‚˜λ‰œλ‹€. 집계 μ „ 데이터λ₯Ό μΆ•μ†Œν•˜λŠ” νλΈŒΒ·μŠ¬λΌμ΄μ„œ 필터와 νŠΉμ • νŽ˜μ΄μ§€ μ „μš© ν•„ν„° ν•„λ“œλ₯Ό λͺ©μ μ— 맞게 κ΅¬λΆ„ν•˜μ—¬ μ‚¬μš©ν•œλ‹€.

ν•„ν„° μ’…λ₯˜

μ’…λ₯˜μ„€μ • μœ„μΉ˜λ²”μœ„
큐브 filtersCube μ˜΅μ…˜ν•΄λ‹Ή 큐브 전체
큐브 slicers + Book filterSelectorsCube Β· Book뢁 곡톡 UI둜 큐브 μŠ¬λΌμ΄μ„œ μ‘°μž‘
tables[].fields.filtersνŽ˜μ΄μ§€ fieldsν•΄λ‹Ή νŽ˜μ΄μ§€μ—λ§Œ 적용
  • filterSelectors β€” 뢁 곡톡 ν•„ν„° UI둜, νλΈŒμ— μ •μ˜ν•œ slicersλ₯Ό 가리킨닀.
  • fields.filters β€” ν•΄λ‹Ή νŽ˜μ΄μ§€μ˜ ν•„ν„° ν•„λ“œ. 컬럼 λ°”μ—μ„œ 멀버λ₯Ό κ³ λ₯Έλ‹€.

Book κ°œμš”λŠ” ν”Όλ²— 뢁(Book)을, ν•„λ“œ λ°°μΉ˜λŠ” ν•„λ“œ ꡬ성을 μ°Έκ³ ν•œλ‹€.

큐브 필터와 μŠ¬λΌμ΄μ„œ

초기 ν•„ν„°λŠ” Cube μ˜΅μ…˜μ˜ filters ν•­λͺ©μ— μ„€μ •(지정)ν•  수 μžˆλ‹€. ν™”λ©΄μ—μ„œ μ„ νƒν•˜λŠ” 곡톡 ν•„ν„°λ₯Ό μ‚¬μš©ν•˜λ €λ©΄ νλΈŒμ— **slicers**λ₯Ό λ¨Όμ € μ •μ˜ν•΄μ•Ό ν•œλ‹€.

const cm = createCubeManager(ds, [
  {
    name: 'sales',
    table: 'sales',
    schema: { /* dimensions, measures */ },
    slicers: [
      { name: 'μ°¨μ’…', dimension: 'μ°¨μ’…', type: 'list' },
      { name: 'νŒλ§€λ‚ μ§œ', dimension: 'νŒλ§€λ‚ μ§œ', type: 'range' },
      { name: 'νŒλ§€κΈ°κ°„', dimension: 'νŒλ§€λ‚ μ§œ', type: 'date' },
    ],
  },
]);
slicers 속성섀λͺ…
nameμŠ¬λΌμ΄μ„œ 이름. filterSelectors의 slicer 속성이 이 이름을 가리킨닀
dimensionν•„ν„°ν•  큐브 차원
type'list' | 'range' | 'date' (κΈ°λ³Έ 'list')

μŠ¬λΌμ΄μ„œ typeκ³Ό μ…€λ ‰ν„° type을 λ§žμΆ”λŠ” μ˜ˆμ΄λ‹€.

μŠ¬λΌμ΄μ„œ typeμ…€λ ‰ν„° type 예
listbutton Β· dropdown Β· tree
rangeslider
datetimeline

λŸ°νƒ€μž„μ—μ„œ νλΈŒμ— 직접 ν•„ν„°λ₯Ό 넣을 μˆ˜λ„ μžˆλ‹€. (데이터와 큐브)

const cube = cm.get('sales');
cube.addFilter({ dimension: 'κ΅­κ°€', values: ['ν•œκ΅­'] });

자주 μ“°λŠ” 큐브 API이닀.

APIμ„€λͺ…
addFilter / filterAllν•„ν„° 좔가·일괄 μ„€μ •
removeFilter / clearFiltersμ œκ±°Β·μ „μ²΄ ν•΄μ œ
getFiltersν˜„μž¬ ν•„ν„° 쑰회
addSlicer / getSlicer / applySlicersμŠ¬λΌμ΄μ„œ 관리

필터와 μŠ¬λΌμ΄μ„œλ₯Ό ν¬ν•¨ν•œ 큐브 ꡬ성 방법은 데이터와 큐브λ₯Ό μ°Έκ³ ν•œλ‹€.

뢁 곡톡 ν•„ν„° (filterSelectors)

filterSelectorsλŠ” 화면에 μŠ¬λΌμ΄μ„œ UIλ₯Ό ν‘œμ‹œν•˜λŠ” μ„€μ • μ˜΅μ…˜μ΄λ‹€. λ°°μ—΄ λ˜λŠ” 객체 ν•˜λ‚˜λ‘œ 지정할 수 μžˆλ‹€.

const config = {
  filterSelectors: [
    { type: 'dropdown', cube: 'sales', slicer: 'μ°¨μ’…', position: 'both' },
    { type: 'button', cube: 'sales', slicer: 'λΈŒλžœλ“œλͺ…', position: 'header' },
    { type: 'tree', cube: 'sales', slicer: 'μ—°λ£Œ', position: 'panel' },
    { type: 'slider', cube: 'sales', slicer: 'νŒλ§€λ‚ μ§œ', position: 'both' },
    { type: 'timeline', cube: 'sales', slicer: 'νŒλ§€κΈ°κ°„', position: 'panel' },
  ],
  tables: {
    name: 'sales',
    cube: 'sales',
    fields: {
      rows: ['κ΅­κ°€'],
      values: ['νŒλ§€μˆ˜λŸ‰'],
    },
  },
};
속성섀λͺ…
type'button' | 'dropdown' | 'tree' | 'timeline' | 'slider'
cubeλŒ€μƒ 큐브 name
slicer큐브 slicers에 λ“±λ‘ν•œ 이름
position'header' | 'panel' | 'both' β€” ν•„ν„°λ°” 및 μΈμŠ€νŽ™ν„° λ‚΄ UI ν‘œμ‹œ μœ„μΉ˜ (κΈ°λ³Έκ°’ 'panel')
tablesμ μš©ν•  νŽ˜μ΄μ§€ name λͺ©λ‘. μƒλž΅ μ‹œ 전체 νŽ˜μ΄μ§€
visible Β· label Β· description λ“±ν‘œμ‹œ κ΄€λ ¨ μ˜΅μ…˜

ν‘œμ‹œ μœ„μΉ˜:

  • filterBar(상단) β€” position 값이 'header' λ˜λŠ” 'both'인 경우
  • μΈμŠ€νŽ™ν„° ν•„ν„° νŒ¨λ„ β€” position 값이 'panel' λ˜λŠ” 'both'인 경우

ν•„ν„°λ°”Β·μΈμŠ€νŽ™ν„° 자체 on/offλŠ” Book의 filterBar Β· inspector μ„€μ •μœΌλ‘œ μ œμ–΄ν•œλ‹€. (ν”Όλ²— 뢁) μ˜΅μ…˜ νŠΈλ¦¬λŠ” Config Β· PivotBookConfiguration을 μ°Έκ³ ν•œλ‹€.

νŽ˜μ΄μ§€ ν•„ν„° ν•„λ“œ (fields.filters)

νŽ˜μ΄μ§€λ§ˆλ‹€ λ‘λŠ” ν•„ν„° ν•„λ“œμ΄λ‹€. μΈμŠ€νŽ™ν„° ν•„λ“œ νŒ¨λ„μ˜ ν•„ν„° μ„Ήμ…˜μ— λ°°μΉ˜ν•˜κ±°λ‚˜, μ„€μ •μœΌλ‘œ μ§€μ •ν•œλ‹€.

fields: {
  filters: ['κ΅­κ°€', { name: 'μ—°λ£Œ' }],
  rows: ['μ°¨μ’…'],
  values: ['νŒλ§€μˆ˜λŸ‰'],
}

ν•­λͺ©μ€ PivotFilterFieldOptions이닀. name Β· width Β· headerWidthλ₯Ό μ“Έ 수 μžˆλ‹€.

섀정이 μ™„λ£Œλ˜λ©΄ 컬럼 λ°” μ˜μ—­μ— ν•„ν„° ν•„λ“œ ν˜•νƒœλ‘œ ν‘œμ‹œλœλ‹€. 멀버λ₯Ό μ„ νƒν•œ λ’€ μ μš©ν•˜λ©΄ ν•΄λ‹Ή νŽ˜μ΄μ§€ 집계에 λ°˜μ˜λœλ‹€.

λŸ°νƒ€μž„

const table = control.table;
const field = table.fields.getFilterField('κ΅­κ°€');
 
table.setAggFilter(field, ['ν•œκ΅­', 'λ―Έκ΅­']);
table.getAggFilter(field);
table.isAggFiltered(field);
 
// ν•„ν„° ν•΄μ œ
table.setAggFilter(field, null);

ν•„λ“œλ₯Ό 좕에 λ„£κ±°λ‚˜ λΉΌλ €λ©΄ Book APIλ₯Ό μ‚¬μš©ν•œλ‹€. Undoκ°€ ν¬ν•¨λœλ‹€.

book.addFilterField(table, 'κ΅­κ°€');
book.removeField(field);

See Also

집계 ν•¨μˆ˜μ •λ ¬