[]
        
(Showing Draft Content)

FlexChart에서 정렬 & 필터링

모든 Wijmo 컨트롤과 마찬가지로, 차트는 모든 데이터 관련 작업을 CollectionView 클래스로 위임하므로, 데이터를 필터링, 정렬 또는 그룹화하길 원한다면 Collection View를 사용하여 작업할 수 있습니다. FlexChart를 특별한 유형의 데이터 그리드로 생각하는 것이 유용한데, 여기서 열은 계열(Series)로 표시되고 행은 차트의 데이터 포인트입니다.

차트의 itemsSource 속성을 배열 또는 __ObservableArray__로 설정하면, 차트는 자동으로 CollectionView 인스턴스를 생성하여 원래의 배열을 wrap 합니다. 이 CollectionView는 액세스하려는 경우에 CollectionView 속성에 의해 표시됩니다.

정렬 예시

차트 collectionViewsortDescriptions 속성을 변경하여 데이터를 정렬합니다.

import * as wijmo from '@grapecity/wijmo';
import * as chart from '@grapecity/wijmo.chart';

var myChart = new chart.FlexChart('#myChart');
var sd = myChart.collectionView.sortDescriptions;
sd.clear(); // to reset any pre-existing sort
// sort by sales
sd.push(new wijmo.SortDescription('sales', true));

SortDescription 생성자를 위한 두 번째 매개변수는 데이터가 오름차순(false = 내림차순)으로의 정렬 여부를 결정하는 부울(Boolean) 값입니다.

필터링 예시

차트 필터링은 __CollectionView__의 filter 속성을 사용하여 구현됩니다. filter 속성은 필터에 포함 및 제외되는 데이터 포인트를 결정하는, 논리적 조건을 제공하는 함수를 허용합니다. 데이터 포인트(항목)가 조건을 충족하고 필터링 된 데이터 세트에 남아 있으면 함수는 true로 반환되야 합니다. 필터에서 제거하고자하는 항목에 대해 false를 반환합니다

// apply filter to include only data for country China
myChart.collectionView.filter = function(item) {
    if(item.country == 'China'){
        return true; // filter in
    }
    else
    {
        return false; // filter out
    }
}