GC.Spread.Sheets.Slicers.ItemSlicer

クラス: ItemSlicer

Sheets.Slicers.ItemSlicer

コンストラクタ

constructor

メソッド

コンストラクタ

constructor

• new ItemSlicer(name, slicerData, columnName)

アイテムスライサーを表します。

実例

//　次のサンプルコードは、アイテムスライサーを作成します。
// テーブルを作成します。
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
//　アイテムスライサーをDOMツリーに追加します。
//　"slicerHost"は、スライサーのDOMを追加する対象のdivです。
$("#slicerHost").append(slicer.getDOMElement());

パラメータ

名前	型	説明
`name`	`string`	アイテムスライサーの名前。
`slicerData`	`GeneralSlicerData`	GeneralSlicerDataまたはTableSlicerDataのインスタンス。
`columnName`	`string`	アイテムスライサーに関連する列名。

メソッド

captionName

▸ captionName(value?): any

アイテムスライサーのキャプション名を取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.captionName();
console.log(oldValue);
slicer.captionName('Slicer_Caption');
var newValue = slicer.captionName();
console.log(newValue);

パラメータ

名前	型
`value?`	`string`

戻り値

any

値が設定されていない場合は、アイテムスライサーのキャプション名を返します。値が設定されている場合は、アイテムスライサーを返します。

columnCount

▸ columnCount(value?): any

アイテムスライサーの列数を取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.columnCount();
console.log(oldValue);
slicer.columnCount(3);
var newValue = slicer.columnCount();
console.log(newValue);

パラメータ

名前	型
`value?`	`number`

戻り値

any

値が設定されていない場合は、アイテムスライサーの列数を返します。値が設定されている場合は、アイテムスライサーを返します。

getDOMElement

▸ getDOMElement(): HTMLElement

アイテムスライサーのDOM要素を取得します。

実例

//　次のサンプルコードは、アイテムスライサーを作成します。
// テーブルを作成します。
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
//　アイテムスライサーをDOMツリーに追加します。
//　"slicerHost"は、スライサーのDOMを追加する対象のdivです。
$("#slicerHost").append(slicer.getDOMElement());

戻り値

HTMLElement

アイテムスライサーのDOM要素。

getStyleName

▸ getStyleName(): undefined | string

テーブルの項目スライサーのスタイル名を取得または設定します。

戻り値

undefined | string

テーブルの項目スライサーのスタイル名を返します。

height

▸ height(value?): any

アイテムスライサーの高さを取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.height();
console.log(oldValue);
slicer.height(120);
var newValue = slicer.height();
console.log(newValue);

パラメータ

名前	型
`value?`	`number`

戻り値

any

値が設定されていない場合は、アイテムスライサーの高さを返します。値が設定されている場合は、アイテムスライサーを返します。

itemHeight

▸ itemHeight(value?): any

アイテムスライサーのアイテムの高さを取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.itemHeight();
console.log(oldValue);
slicer.itemHeight(34);
var newValue = slicer.itemHeight();
console.log(newValue);

パラメータ

名前	型
`value?`	`number`

戻り値

any

値が設定されていない場合は、アイテムスライサーのアイテムの高さを返します。値が設定されている場合は、アイテムスライサーを返します。

name

▸ name(value?): any

アイテムスライサーの名前を取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.name();
console.log(oldValue);
slicer.name('SlicerA');
var newValue = slicer.name();
console.log(newValue);

パラメータ

名前	型
`value?`	`string`

戻り値

any

値が設定されていない場合は、アイテムスライサーの名前を返します。値が設定されている場合は、アイテムスライサーを返します。

showHeader

▸ showHeader(value?): any

アイテムスライサーのヘッダを表示するかどうかを取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.showHeader();
console.log(oldValue);
slicer.showHeader(false);
var newValue = slicer.showHeader();
console.log(newValue);

パラメータ

名前	型
`value?`	`boolean`

戻り値

any

値が設定されていない場合は、アイテムスライサーのヘッダを表示するかどうかを返します。値が設定されている場合は、アイテムスライサーを返します。

showNoDataItems

▸ showNoDataItems(value?): any

アイテムスライサーのデータなしアイテムを表示するかどうかを取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.showNoDataItems();
console.log(oldValue);
slicer.showNoDataItems(false);
var newValue = slicer.showNoDataItems();
console.log(newValue);

パラメータ

名前	型
`value?`	`boolean`

戻り値

any

値が設定されていない場合は、アイテムスライサーのデータなしアイテムを表示するかどうかを返します。値が設定されている場合は、アイテムスライサーを返します。

showNoDataItemsInLast

▸ showNoDataItemsInLast(value?): any

データなしアイテムを最後に表示するかどうかを取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.showNoDataItemsInLast();
console.log(oldValue);
slicer.showNoDataItemsInLast(false);
var newValue = slicer.showNoDataItemsInLast();
console.log(newValue);

パラメータ

名前	型
`value?`	`boolean`

戻り値

any

値が設定されていない場合は、データなしアイテムを最後に表示するかどうかを返します。値が設定されている場合は、アイテムスライサーを返します。

sortState

▸ sortState(value?): any

アイテムスライサーのソート状態を取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.sortState();
console.log(oldValue);
slicer.sortState(GC.Spread.Sheets.SortState.descending);
var newValue = slicer.sortState();
console.log(newValue);

パラメータ

名前	型
`value?`	`SortState`

戻り値

any

値が設定されていない場合は、アイテムスライサーのソート状態を返します。値が設定されている場合は、アイテムスライサーを返します。

style

▸ style(value?): SlicerStyle | ItemSlicer

アイテムスライサーのスタイルを取得または設定します。

実例

このスタイルはjsonデータであり、以下のようなjsonスキーマに従います。
{
     "$schema" : "http://json-schema.org/draft-04/schema#",
     "title" : "style",
     "type" : "object",
     "properties" : {
         "wholeSlicerStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "headerStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "selectedItemWithDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "selectedItemWithNoDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "unSelectedItemWithDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "unSelectedItemWithNoDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "hoveredSelectedItemWithDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "hoveredSelectedItemWithNoDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "hoveredUnSelectedItemWithDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         },
         "hoveredUnSelectedItemWithNoDataStyle" : {
             "$ref" : "#/definitions/StyleInfo"
         }
     },
     "definitions" : {
         "StyleInfo" : {
             "type" : "object",
             "properties" : {
                     "backColor" : {
                             "type" : "string"
                     },
                     "foreColor" : {
                             "type" : "string"
                     },
                     "font" : {
                             "type" : "string"
                     },
                     "borderLeft" : {
                             "$ref" : "#/definitions/SlicerBorder"
                     },
                     "borderTop" : {
                             "$ref" : "#/definitions/SlicerBorder"
                     },
                     "borderRight" : {
                             "$ref" : "#/definitions/SlicerBorder"
                     },
                     "borderBottom" : {
                             "$ref" : "#/definitions/SlicerBorder"
                     },
                 "textDecoration":{
                     "type" : "string"
                 }
             }
         },
         "SlicerBorder":{
             "type":"object",
             "properties":{
                 "borderWidth":{
                         "type":"number"
                 },
                 "borderStyle":{
                         "type":"string"
                 },
                 "borderColor":{
                         "type":"string"
                 }
          }
         }
     }
 }
サンプル：
var style = new GC.Spread.Sheets.Slicers.SlicerStyle();
style.wholeSlicerStyle(new GC.Spread.Sheets.Slicers.SlicerStyleInfo('red', 'blue', '16pt Calibri'));
style.headerStyle(new GC.Spread.Sheets.Slicers.SlicerStyleInfo(undefined, 'green'));
style.selectedItemWithDataStyle(new GC.Spread.Sheets.Slicers.SlicerStyleInfo(undefined, undefined, undefined, new GC.Spread.Sheets.LineBorder('pink', GC.Spread.Sheets.LineStyle.double)));
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.style();
console.log(oldValue);
slicer.style(style);
var newValue = slicer.style();
console.log(newValue);

パラメータ

名前	型	説明
`value?`	`string` \| `SlicerStyle`	項目スライサーのスタイルまたはスタイル名。スライサーの style プロパティは、スライサーに適用される外観と書式設定スタイルを指定し、スライサーの全体的な外観とプレゼンテーションを定義します。

戻り値

SlicerStyle | ItemSlicer

値が設定されていない場合は、アイテムスライサーのスタイルを返します。値が設定されている場合は、アイテムスライサーを返します。

visuallyNoDataItems

▸ visuallyNoDataItems(value?): any

データのないアイテムを視覚的に区別するかどうかを取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.visuallyNoDataItems();
console.log(oldValue);
slicer.visuallyNoDataItems(false);
var newValue = slicer.visuallyNoDataItems();
console.log(newValue);

パラメータ

名前	型
`value?`	`boolean`

戻り値

any

値が設定されていない場合は、データのないアイテムを視覚的に区別するかどうかを返します。値が設定されている場合は、アイテムスライサーを返します。

width

▸ width(value?): any

アイテムスライサーの幅を取得または設定します。

実例

var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
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 = new GC.Spread.Sheets.Slicers.TableSlicerData(table)
//　スライサーデータをアイテムスライサーに設定します。
var slicer = new GC.Spread.Sheets.Slicers.ItemSlicer("slicer", slicerData, "Name");
var oldValue = slicer.width();
console.log(oldValue);
slicer.width(120);
var newValue = slicer.width();
console.log(newValue);

パラメータ

名前	型
`value?`	`number`

戻り値

any

値が設定されていない場合は、アイテムスライサーの幅を返します。値が設定されている場合は、アイテムスライサーを返します。

GC.Spread.Sheets.Slicers.ItemSlicer

クラス: ItemSlicer

Table of contents

コンストラクタ

メソッド

コンストラクタ

constructor

パラメータ

メソッド

captionName

パラメータ

戻り値

columnCount

パラメータ

戻り値

getDOMElement

戻り値

getStyleName

戻り値

height

パラメータ

戻り値

itemHeight

パラメータ

戻り値

name

パラメータ

戻り値

showHeader

パラメータ

戻り値

showNoDataItems

パラメータ

戻り値

showNoDataItemsInLast

パラメータ

戻り値

sortState

パラメータ

戻り値

style

パラメータ

戻り値

visuallyNoDataItems

パラメータ

戻り値

width

パラメータ

戻り値