Spread.Sheets
項目スライサーの作成

項目スライサーを使用すると、データをフィルタリングできます。

GeneralSlicerDataおよびTableSlicerDataクラスは、フィルタリング対象のデータを保持し、フィルタ情報プロパティを提供します。ItemSlicerクラスは、スライサーデータに使用できます。項目スライサーはスライサーコンポーネントであり、シートからは独立しています。styleメソッドを使用すると、項目スライサーのスタイルを設定できます。

次の図は、項目スライサーを示します。 

コードの使用

次のサンプルコードは、テーブルを作成し、項目スライサーを追加します。

JavaScript
コードのコピー

// テーブルを作成します。
var dataSource = [
    { Name: "Bob", City: "NewYork", Birthday: "1968/6/8" },
    { Name: "Betty", City: "NewYork", Birthday: "1972/7/3" },
    { Name: "Alice", City: "Washington", Birthday: "2012/2/15" },
];
var table = activeSheet.tables.addFromDataSource("table1", 1, 1, dataSource);

var slicerData = table.getSlicerData();
// 項目スライサーを作成して、項目すライザーにデータを設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
// DOMツリーに項目スライサーを追加します。
// 「slicerHost」は、スライサーのDOMを追加しようとするdivです。
$("#slicerHost").append(slicer.getDOMElement());
.....
<div id="slicerHost" style="height: 300px; width: 50%"></div>

 

 


© 2016-2018, GrapeCity inc. All rights reserved.