! 제품 버전을 정확하게 입력해 주세요.
제품 버전이 정확하게 기재되어 있지 않은 경우,
최신 버전을 기준으로 안내 드리므로
더욱 빠르고 명확한 안내를 위해
제품 버전을 정확하게 입력해 주세요!

피벗 그리트와 피벗 차트에 슬라이서(Slicer) 적용하기 > 블로그 & Tips

본문 바로가기

ComponentOne

블로그 & Tips

피벗 그리트와 피벗 차트에 슬라이서(Slicer) 적용하기

페이지 정보

작성자 GrapeCity 작성일 2019-05-15 00:00 조회 6,055회 댓글 0건

본문

첨부파일

데이터 슬라이서(Data Slicer)란 무엇입니까?


데이터 슬라이서는 피벗 그리드 및 피벗 차트를 쉽고 빠르게 필터링할 수있는 시각적 필터입니다.


슬라이서의 주요 장점 :


  • 필터 드롭다운(Drop Down) 목록을 열지 않고도 데이터를 필터링할 수 있는 사용자 친화적인 인터페이스를 제공합니다.

  • 데이터 슬라이서(Data Slicer)는 항상 데이터와 함께 표시되므로, 필터링된 피벗 그리드 또는 피벗 차트에 어떤 값이 표시되거나 숨겨져 있는지 항상 알 수 있습니다.



FlexPivotSlicer 컨트롤 소개

FlexPivot 컨트롤은 필드에 적용된 필터에 따라 지정된, 데이터 집합을 표시할 수 있는 필터링 기능을 이미 제공하지만, 필터링된 FlexPivotGrid/FlexPivotChart에 어떤 값이 표시되거나 숨겨져 있는지 쉽게 알 수 있는 방법을 제공하지 않는다.


필터링을 쉽고 이해하기 쉽게하기 위해, WinForms 2019 V1 릴리스에는 FlexPivotSlicer라는 새로운 컨트롤이 도입되었습니다.


FlexPivotSlicer 컨트롤은 FlexPivotGrid/FlexPivotChart 데이터를 필터링 하는 빠른 방법을 제공할, 뿐만 아니라 현재 필터링 상태를 나타내므로 필터링된 FlexPivotGrid 및 FlexPivotChart 컨트롤에 정확히 표시되는 내용을 쉽게 이해할 수 있습니다. 또한 애플리케이션에 여러 FlexPivotSlicer 컨트롤을 추가하여, 여러 필드로 피벗 데이터를 필터링 할 수 있습니다.


이미지 1


위 이미지는 FlexPivotSlicer 컨트롤이 'Country(국가)'와 같은 필드에 바인딩될 때 어떻게 보이는지 보여줍니다. 확인란과 정렬 단추는 기본적으로 표시되지 않지만 사용자는 컨트롤의 ShowCheckboxes 및 ShowSort 속성을 사용하여이를 표시 할 수 있습니다.

위의 이미지는 FlexPivotSlicer 컨트롤이 필드(예: 'Country')에 바인딩되었을 때 어떻게 표시되는지를 보여줍니다. 기본적으로 체크박스(Checkbox)란과 정렬(Short) 버튼은 표시되지 않지만, 사용자는 컨트롤의 ShowCheckbox 및 ShowSort 속성의 도움을 받아 체크박스(Checkbox)와 정렬(Short) 버튼을 표시할 수 있습니다.


FlexPivotSlicer 컨트롤은 다음 두 가지 기본 요소로 구성됩니다.

  • Header(헤더) : FlexPivotSlicer 컨트롤은 컨트롤 상단에 헤더(Header) 영역을 표시합니다. 헤더(Header) 영역은 캡션 (필터링되는 필드 이름)과 Multi-Select(다중 선택), Clear filter(필터 초기화) 및 Short(정렬) 버튼(정렬 버튼은 기본적으로 표시되지 않음)으로 구성됩니다.

  • List : FlexPivotSlicer 컨트롤이 필터링해야하는 필드에 바인딩되면, 해당 필드의 모든 고유 값을 포함하는 목록이 표시됩니다. 그런 다음 해당 목록에서 필드 값을 선택하여 FlexPivotGrid/FlexPivotChart 데이터를 필터링 할 수 있습니다.



FlexPivotSlicer 컨트롤 사용


이미지 2


FlexPivotGrid/FlexPivotChart에 의해 표시되는 전체 데이터의 아주 작거나 특정 부분을 더 깊이 분석하려는 시나리오를 고려해봅시다. 회사의 판매량을 표시하는 피벗 그리드/피벗 차트가 있고 지난 분기 (예 : 10 월, 11 월 및 12 월) 동안 다른 국가의 특정 식품 판매량을 구체적으로 분석하려고 합니다. FlexPivotSlicer 컨트롤을 사용하면, 이 요구 사항을 손쉽게 달성 할 수 있습니다. 


FlexPivotSlicer 컨트롤을 추가 및 구성(configure)한 다음, 위 이미지에 표시된 데로 'Product Name(제품 이름)' 및 '월(Month)' 기준으로 피벗 데이터를 슬라이스하는 데 사용하면 됩니다.


아래를 통해, 간단하게 구현해 보겠습니다.

(프로젝트 파일은 첨부 파일을 확인해주세요)


여기에서는 FlexPivotGrid/FlexPivotChart에서 회사의 국가 별 제품 판매에 대한 요약된 보기를 표시하기 위해 FlexPivot을 이미 구성했다고 가정합니다 (FlexPivot의 자세한 내용은 여기 참조해주세요). 


이제 원하는 필터링을 수행하도록 구성해야하는 FlexPivotSlicer 컨트롤의 속성을 살펴보겠습니다.



데이터 바인딩


응용 프로그램에서 FlexPivotSlicer 컨트롤을 추가한 후에는, 먼저 FlexPivotGrid/FlexPivotChart 데이터를 필터링 할 적절한 필드에 컨트롤을 바인딩해야 합니다.


디자인 타임에 컨트롤을 바인딩하려면, FlexPivotSlicer 컨트롤 의 DataSource 및 FieldName 속성을 사용하십시오이미 구성된 FlexPivotPanel의 인스턴스를 DataSource 속성에 할당하고, FieldName 속성을 사용하여 필터링 할 필드의 이름을 지정하십시오.


런타임에 컨트롤을 바인딩하려면, Field 속성을 사용하여 필터링을 수행 할 필드를 지정하십시오이 특성은 C1FlexPivotField 유형의 Object를 리턴합니다. C1FlexPivotField 클래스는 필드 값의 형식 지정(formatting), 필드 이름에 따라 UI에 표시해야하는 텍스트 사용자 정의 등과 같은 필드 설정을 사용자 정의하는 데 사용할 수 있는 특성을 노출합니다.


아래 예제는 FlexPivotSlicer 컨트롤을 코드 상에서, 'ProductName' 필드에 바인딩하는 방법을 보여줍니다. 이 슬라이서는 이제 위 이미지에 표시된 것과 같이, 특정 제품의 판매량을 보는 데 사용할 수 있습니다.


productNameSlicer.Field = c1FlexPivotPanel.FlexPivotEngine.Fields["ProductName"]; //Sets the field which needs to be filtered by the FlexPivotSlicer
productNameSlicer.Field.Caption = "Product Name";


마찬가지로 FlexPivotSlicer 컨트롤을 더 추가하고 원하는 필드에 바인딩하여 FlexPivotGrid/FlexPivotChart 데이터를 여러 필드로 동시에 필터링할 수 있습니다.


이제 여러분의 응용 프로그램에 피벗 그리드/피벗 차트를 필터링 할 준비가 되었습니다.



이 외에도 컨트롤은 데이터 탐색을 위한, 더 많은 기능을 제공합니다. 우리의 필요에 따라 컨트롤을 구성하기 위해 더 알아봅시다.


컨트롤 사용자 정의


선택(Selection):


기본적으로 사용자는 필드 값 목록에서 하나의 값만 선택할 수 있습니다. 그러나 사용자가 목록에서 여러 값을 선택할 수 있도록, 코드 상에서 MultiSelect 속성 설정하거나, 또는 컨트롤 헤더에 표시된 Multi-Select 버튼을 사용할 수 있습니다 선택을 지우려면 컨트롤의 오른쪽 상단에 있는 필터 지우기(Clear Filter) 버튼을 사용할 수 있습니다.


아래 예는 목록에서 다중 선택 모드를 활성화하는 방법을 보여줍니다.


//Allows users to select multiple items from the list
productNameSlicer.MultiSelect = true;


C1FlexPivotSlicer 클래스의 ShowCheckBoxes 속성을 사용하여, 목록에서 각 항목 옆에 확인란을 숨기거나 표시하도록 FlexPivotSlicer 컨트롤을 추가로 사용자 지정할 수 있습니다 .


정렬 :


기본적으로 고유 필드 값을 포함하는 목록은 오름차순으로 정렬됩니다. 그러나 목록 항목을 다른 정렬 순서로 정렬하려면 C1FlexPivotSlicer 클래스의 SortOrder 속성을 사용할 수 있습니다. 헤더(Header) 영역에는 정렬 단추가 기본적으로 표시되지 않지만, C1FlexPivotSlicer 클래스의 ShowSort 속성을 true로 설정하여 표시 할 수 있습니다.


아래 코드는 목록 항목을 내림차순으로 정렬하는 방법과 런타임에 정렬 순서를 변경하기 위해 컨트롤 헤더에 정렬 버튼을 표시하는 방법을 보여줍니다.


orderMonthSlicer.SortOrder = System.Data.SqlClient.SortOrder.Descending; //Sorts the list in descending order
orderMonthSlicer.ShowSort = true; //Displays the Sort button in the header


이 외에도 C1FlexPivotSlicer 클래스의 속성인 ShowHeader , ShowMultiSelect , ShowClear 및 ShowSelectAll 사용하여 헤더 영역, 다중 선택(Multi-Select), 필터 지우기(Clear filter) 버튼, 및 모두 선택/모두 선택 취소 체크박스란 (여러 선택이 활성화 된 경우에만 표시)의 보여주기 속성을 제어할 수 있습니다. 



FlexPivotSlicer 스타일링


FlexPivotSlicer 컨트롤의 모양과 느낌, 머리글과 목록 등 구성된 시각적 요소는 SlicerStyles 클래스를 이용해 커스터마이징이 가능합니다.


위의 포스팅에 대한, 샘플 코드를 확인하려면, 첨부파일을 다운 받아주세요.

  • 페이스북으로 공유
  • 트위터로  공유
  • 링크 복사
  • 카카오톡으로 보내기

댓글목록

등록된 댓글이 없습니다.

메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기

태그1

인기글

더보기
  • 인기 게시물이 없습니다.
메시어스 홈페이지를 통해 제품에 대해서 더 자세히 알아 보세요!
홈페이지 바로가기
이메일 : sales-kor@mescius.com | 전화 : 1670-0583 | 경기도 과천시 과천대로 7길 33, 디테크타워 B동 1107호 메시어스(주) 대표자 : 허경명 | 사업자등록번호 : 123-84-00981 | 통신판매업신고번호 : 2013-경기안양-00331 ⓒ 2024 MESCIUS inc. All rights reserved.