[]
        
(Showing Draft Content)

GC.Spread.Sheets.Slicers.DOMTableSlicer

Class: DOMTableSlicer

Sheets.Slicers.DOMTableSlicer

Hierarchy

Table of contents

Constructors

Properties

Methods

Constructors

constructor

new DOMTableSlicer(name, table, columnName)

Represents a slicer.

Parameters

Name Type Description
name string The slicer name.
table Table The table that relates to the slicer.
columnName string The name of the table's column.

Overrides

FloatingObject.constructor

Properties

typeName

typeName: string

Represents the type name string used for supporting serialization.

Inherited from

FloatingObject.typeName

Methods

allowMove

allowMove(value?): any

Gets or sets whether to disable moving the floating object.

example

//This example prevents you from moving or resizing the floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.allowResize(false);
customFloatingObject.allowMove(false);
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns the setting for whether to disable moving the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.allowMove


allowResize

allowResize(value?): any

Gets or sets whether to disable resizing the floating object.

example

//This example prevents you from moving or resizing the floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.allowResize(false);
customFloatingObject.allowMove(false);
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns the setting for whether to disable resizing the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.allowResize


alt

alt(value?): any

Gets or sets the alternative text of the floating object for screen readers.

example

var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject('f1', 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
customFloatingObject.alt("A button");
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? string

Returns

any

The alternative text of the floating object.

Inherited from

FloatingObject.alt


captionName

captionName(value?): any

Gets or sets the caption name of the slicer.

example

//This example uses the captionName method.
//create a table
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
//slicer style
var style1 = new GC.Spread.Sheets.Slicers.SlicerStyles.light4();
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
 //change the slicer properties.
slicer.position(new GC.Spread.Sheets.Point(100, 200));
slicer.captionName("S1");
slicer.style(style1);

Parameters

Name Type
value? string

Returns

any

If no value is set, returns the caption name of the slicer; otherwise, returns the slicer.


cloneContent

cloneContent(): HTMLElement

Gets a copy of the current content of the instance.

example

var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject('f1', 10, 10, 64, 30);
customFloatingObject.content(createButton('button 1', '64px', '30px'));
activeSheet.floatingObjects.add(customFloatingObject);

var btn = customFloatingObject.cloneContent();
btn.innerText = 'button 2';
customFloatingObject.content(btn);

function createButton (text, width, height) {
    var btn = document.createElement('button');
    btn.style.width = width;
    btn.style.height = height;
    btn.innerText = text;
    return btn;
}

Returns

HTMLElement

A copy of the current content of the instance.

Inherited from

FloatingObject.cloneContent


columnCount

columnCount(value?): any

Gets or sets the column count for the slicer.

example

//This example changes the slicer column count
//create a table
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
//add a slicer to the sheet and return the slicer instance.
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
console.log(slicer.columnCount());
slicer.columnCount(3);
console.log(slicer.columnCount());

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the column count for the slicer; otherwise, returns the slicer.


content

content(value?): any

Gets or sets the content of the custom floating object.

example

var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject('f1', 10, 10, 64, 30);
customFloatingObject.content(createButton('button 1', '64px', '30px'));
activeSheet.floatingObjects.add(customFloatingObject);

console.log(customFloatingObject.content()); // get current content, the result is button element with the text "button 1".
customFloatingObject.content(createButton('button 2', '64px', '30px')); // set new content.

function createButton (text, width, height) {
    var btn = document.createElement('button');
    btn.style.width = width;
    btn.style.height = height;
    btn.innerText = text;
    return btn;
}

Parameters

Name Type
value? HTMLElement

Returns

any

If no value is set, returns the content of the custom floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.content


disableResizingAndMoving

disableResizingAndMoving(value?): any

Gets or sets whether to disable resizing and moving the slicer.

example

//This example prevents moving or resizing the slicer.
//create a table
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
//slicer style
var style1 = new GC.Spread.Sheets.Slicers.SlicerStyles.light4();
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
//change the slicer properties.
slicer.position(new GC.Spread.Sheets.Point(100, 200));
slicer.disableResizingAndMoving(true);
slicer.style(style1);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether to disable resizing and moving the slicer; otherwise, returns the slicer.


dynamicMove

dynamicMove(value?): any

Gets or sets whether the object moves when hiding or showing, resizing, or moving rows or columns.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
customFloatingObject.isVisible(true);
customFloatingObject.dynamicSize(true);
customFloatingObject.dynamicMove(true);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether this floating object dynamically moves; otherwise, returns the floating object.

Inherited from

FloatingObject.dynamicMove


dynamicSize

dynamicSize(value?): any

Gets or sets whether the size of the object changes when hiding or showing, resizing, or moving rows or columns.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
customFloatingObject.isVisible(true);
customFloatingObject.dynamicSize(true);
customFloatingObject.dynamicMove(true);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether this floating object dynamically changes size; otherwise, returns the floating object.

Inherited from

FloatingObject.dynamicSize


endColumn

endColumn(value?): any

Gets or sets the end column index of the floating object position.

example

//Creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);
//Position the lower right corner of the floating object by cell anchors.
customFloatingObject.endRow(7);
customFloatingObject.endColumn(5);
customFloatingObject.endRowOffset(10);
customFloatingObject.endColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the end column index of the floating object position; otherwise, returns the floating object.

Inherited from

FloatingObject.endColumn


endColumnOffset

endColumnOffset(value?): any

Gets or sets the offset relative to the end column of the floating object.

example

//Creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);
//Position the lower right corner of the floating object by cell anchors.
customFloatingObject.endRow(7);
customFloatingObject.endColumn(5);
customFloatingObject.endRowOffset(10);
customFloatingObject.endColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the offset relative to the end column of the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.endColumnOffset


endRow

endRow(value?): any

Gets or sets the end row index of the floating object position.

example

//Creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);
//Position the lower right corner of the floating object by cell anchors.
customFloatingObject.endRow(7);
customFloatingObject.endColumn(5);
customFloatingObject.endRowOffset(10);
customFloatingObject.endColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the end row index of the floating object position; otherwise, returns the floating object.

Inherited from

FloatingObject.endRow


endRowOffset

endRowOffset(value?): any

Gets or sets the offset relative to the end row of the floating object.

example

//Creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);
//Position the lower right corner of the floating object by cell anchors.
customFloatingObject.endRow(7);
customFloatingObject.endColumn(5);
customFloatingObject.endRowOffset(10);
customFloatingObject.endColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the offset relative to the end row of the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.endRowOffset


fixedPosition

fixedPosition(value): any

Gets or sets whether the position of the floating object is fixed. When fixedPosition is true, dynamicMove and dynamicSize are disabled.

example

//This example sets the position of the object to fixed.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
customFloatingObject.fixedPosition(true);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value boolean

Returns

any

If no value is set, returns whether the position of the floating object is fixed; otherwise, returns the floating object.

Inherited from

FloatingObject.fixedPosition


getHost

getHost(): HTMLElement[]

Gets the dom host of the custom content.

Returns

HTMLElement[]

Inherited from

FloatingObject.getHost


height

height(value?): any

Gets or sets the height of a floating object.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1");
customFloatingObject.x(10);
customFloatingObject.y(10);
customFloatingObject.width(60);
customFloatingObject.height(64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the height of a floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.height


isLocked

isLocked(value?): any

Gets or sets whether this floating object is locked.

example

var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1");
customFloatingObject.x(10);
customFloatingObject.y(10);
customFloatingObject.width(60);
customFloatingObject.height(64);
customFloatingObject.isLocked(true);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
activeSheet.options.isProtected = true;

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether this floating object is locked; otherwise, returns the floating object.

Inherited from

FloatingObject.isLocked


isSelected

isSelected(value?): any

Gets or sets whether this floating object is selected.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
customFloatingObject.isSelected(true);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether this floating object is selected; otherwise, returns the floating object.

Inherited from

FloatingObject.isSelected


isVisible

isVisible(value?): any

Gets or sets whether this floating object is visible.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
customFloatingObject.isVisible(true);
customFloatingObject.dynamicSize(true);
customFloatingObject.dynamicMove(true);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether this floating object is visible; otherwise, returns the floating object.

Inherited from

FloatingObject.isVisible


itemHeight

itemHeight(value?): any

Gets or sets the item height for the slicer.

example

//This example changes the slicer item height.
//create a table
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);

var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
console.log(slicer.itemHeight()); // 21
slicer.itemHeight(35);
console.log(slicer.itemHeight()); // 35

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the item height for the slicer; otherwise, returns the slicer.


name

name(value?): any

Gets or sets the name of the slicer.

Parameters

Name Type
value? string

Returns

any

If no value is set, returns the name of the slicer; otherwise, returns the slicer.

Overrides

FloatingObject.name


refreshContent

refreshContent(): void

Refresh the content in floatingObject.The user should override this method to make their content synchronize with the floatingObject.

Returns

void

Inherited from

FloatingObject.refreshContent


showHeader

showHeader(value?): any

Gets or sets whether to show the slicer header.

example

//This example hides the slicer header.
//create a table
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
//slicer style
var style1 = new GC.Spread.Sheets.Slicers.SlicerStyles.light4();
//add a slicer to the sheet and return the slicer instance.
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
slicer.position(new GC.Spread.Sheets.Point(100, 200));
slicer.showHeader(false);
slicer.style(style1);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether to show the slicer header; otherwise, returns the slicer.


showNoDataItems

showNoDataItems(value?): any

Gets or sets whether to show the no data items of the slicer.

example

//create a table
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
//change the slicer properties.
slicer.showNoDataItems(false);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether to show the no data items of the slicer; otherwise, returns the slicer.


showNoDataItemsInLast

showNoDataItemsInLast(value?): any

Gets or sets whether to show the no data items last.

example

//create a table
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
//change the slicer properties.
slicer.showNoDataItemsInLast(false);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether to show the no data items last; otherwise, returns the slicer.


sortState

sortState(value?): any

Gets or sets the sort state of the slicer.

example

//This example sets the sort order of the items in the slicer.
//create a table
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
// slicer style
var style1 = new GC.Spread.Sheets.Slicers.SlicerStyles.light4();
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
//set slicer properties
slicer.position(new GC.Spread.Sheets.Point(100, 200));
slicer.sortState(GC.Spread.Sheets.SortState.descending);
slicer.style(style1);

Parameters

Name Type
value? SortState

Returns

any

If no value is set, returns the sort state of the slicer; otherwise, returns the slicer.


startColumn

startColumn(value?): any

Gets or sets the starting column index of the floating object position.

example

//Creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the starting column index of the floating object position; otherwise, returns the floating object.

Inherited from

FloatingObject.startColumn


startColumnOffset

startColumnOffset(value?): any

Gets or sets the offset relative to the start column of the floating object.

example

//Creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the offset relative to the start column of the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.startColumnOffset


startRow

startRow(value?): any

Gets or sets the starting row index of the floating object position.

example

//Creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the starting row index of the floating object position; otherwise, returns the floating object.

Inherited from

FloatingObject.startRow


startRowOffset

startRowOffset(value?): any

Gets or sets the offset relative to the start row of the floating object.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1", 10, 10, 60, 64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);
//Position the upper left corner of the floating object by cell anchors.
customFloatingObject.startRow(2);
customFloatingObject.startColumn(2);
customFloatingObject.startRowOffset(10);
customFloatingObject.startColumnOffset(10);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the offset relative to the start row of the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.startRowOffset


style

style(value?): any

Gets or sets the style of the slicer.

example

//This example uses a built-in style.
//create a table
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
// slicer style
var style1 = new GC.Spread.Sheets.Slicers.SlicerStyles.light4();
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
//change the slicer properties.
slicer.position(new GC.Spread.Sheets.Point(100, 200));
slicer.style(style1);

Parameters

Name Type Description
value? string | SlicerStyle The style or style name of the slicer. The style property of a slicer specifies the visual appearance and formatting style applied to the slicer, defining its overall look and presentation.

Returns

any

If no value is set, returns The style of the slicer; otherwise, returns the slicer.


toImageSrc

toImageSrc(): string

Get the slicer Image src of type Base64 string.

example

let slicerImageSrc = sheet.slicers.all()[0].toImageSrc();

Returns

string

return the slicer Image Base64 src string.


visuallyNoDataItems

visuallyNoDataItems(value?): any

Gets or sets whether to visually distinguish the items with no data.

example

//create a table
var spread = new GC.Spread.Sheets.Workbook('ss');
var activeSheet = spread.getActiveSheet();
datas = [
    ["1", "NewYork", "1968/6/8", "80", "180"],
    ["4", "NewYork", "1972/7/3", "72", "168"],
    ["4", "NewYork", "1964/3/2", "71", "179"],
    ["5", "Washington", "1972/8/8","80", "171"],
    ["6", "Washington", "1986/2/2", "89", "161"],
    ["7", "Washington", "2012/2/15", "71", "240"]];
var table = activeSheet.tables.addFromDataSource("table1", 2, 2, datas);
dataColumns = ["Name", "City", "Birthday", "Weight", "Height"];
table.setColumnName(0, dataColumns[0]);
table.setColumnName(1, dataColumns[1]);
table.setColumnName(2, dataColumns[2]);
table.setColumnName(3, dataColumns[3]);
table.setColumnName(4, dataColumns[4]);
var slicer = new GC.Spread.Sheets.Slicers.DOMTableSlicer('slicer1', table, 'Name');
//change the slicer properties.
slicer.visuallyNoDataItems(false);

Parameters

Name Type
value? boolean

Returns

any

If no value is set, returns whether to visually distinguish the items with no data; otherwise, returns the slicer.


width

width(value?): any

Gets or sets the width of a floating object.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1");
customFloatingObject.x(10);
customFloatingObject.y(10);
customFloatingObject.width(60);
customFloatingObject.height(64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the width of a floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.width


x

x(value?): any

Gets or sets the horizontal location of the floating object.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1");
customFloatingObject.x(10);
customFloatingObject.y(10);
customFloatingObject.width(60);
customFloatingObject.height(64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the horizontal location of the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.x


y

y(value?): any

Gets or sets the vertical location of the floating object.

example

//This example creates a floating object.
var customFloatingObject = new GC.Spread.Sheets.FloatingObjects.FloatingObject("f1");
customFloatingObject.x(10);
customFloatingObject.y(10);
customFloatingObject.width(60);
customFloatingObject.height(64);
var btn = document.createElement('button');
btn.style.width = "60px";
btn.style.height = "30px";
btn.innerText = "button";
customFloatingObject.content(btn);
activeSheet.floatingObjects.add(customFloatingObject);

Parameters

Name Type
value? number

Returns

any

If no value is set, returns the vertical location of the floating object; otherwise, returns the floating object.

Inherited from

FloatingObject.y