class anychart.core.ui.table.Cell Improve this Doc

Table cell.

Methods Overview

Specific settings
content()	Cell content settings.
Advanced Text Settings
fontVariant()	Text font variant settings.
letterSpacing()	Text letter spacing settings.
textDirection()	Text direction settings.
textIndent()	Text line height settings.
textOverflow()	Text overflow settings.
useHtml()	Text useHtml settings.
wordBreak()	Word break mode.
wordWrap()	Word-wrap mode.
Base Text Settings
fontColor()	Text font color settings.
fontDecoration()	Text font decoration settings.
fontFamily()	Text font family settings.
fontOpacity()	Text font opacity settings.
fontSize()	Text font size settings.
fontStyle()	Text font style settings.
fontWeight()	Text font weight settings.
hAlign()	Text horizontal align settings.
lineHeight()	Text line height settings.
textShadow()	Text font color settings.
vAlign()	Text vertical align settings.
Coloring
border()	Cell border settings.
fill()	Fill settings.
Events
disablePointerEvents()	Disable pointer events settings.
Interactivity
selectable()	Text selectable option.
Size and Position
padding()	Padding settings.
Miscellaneous
colSpan()	Cell columns span settings.
getBounds()	Returns cell bounds without padding counted (bounds which are used for borders drawing).
getCol()	Returns cell column instance.
getColNum()	Returns cell column number.
getRow()	Returns cell row instance.
getRowNum()	Returns cell row number.
rowSpan()	Rows columns span settings.

Methods Description

border

border()

Getter for cell border settings.

Returns:

anychart.core.ui.table.Border - Stroke settings.

border(color, thickness, dashpattern, lineJoin, lineCap)

Setter for cell border settings. Learn more about stroke settings.

Detailed description

Note: Pass null to reset to default settings.
Note: lineJoin settings not working here.

Params:

Name	Type	Default	Description
color	anychart.graphics.vector.Stroke \| anychart.graphics.vector.ColoredFill \| string \| function \| null		Stroke settings.
thickness	number	1	Line thickness.
dashpattern	string		Controls the pattern of dashes and gaps used to stroke paths.
lineJoin	string \| anychart.graphics.vector.StrokeLineJoin		Line join style.
lineCap	string \| anychart.graphics.vector.StrokeLineCap		Line cap style.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

colSpan

colSpan()

Getter for cell columns span.

Returns:

number - Columns span.

Try it:

Usage sample

colSpan(count)

Setter for cell columns span.

Detailed description

Note: Cells that are overlapped by other cells are not drawn.

Params:

Name	Type	Default	Description
count	number	1	Count of cells to merge right.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

content

content()

Getter for the cell content.

Returns:

anychart.graphics.vector.Element | anychart.core.VisualBase | string | number - The cell content.

content(settings)

Setter for the cell content.

Params:

Name	Type	Description
settings	anychart.graphics.vector.Element \| anychart.core.VisualBase \| string \| number	Cell content to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

disablePointerEvents

disablePointerEvents()

Getter for the state of disablePointerEvents option.

Returns:

boolean - If pointer events are disabled.

disablePointerEvents(enabled)

Setter for the text disablePointerEvents option.

Detailed description

This options defines whether the text should pass mouse events through.

Params:

Name	Type	Default	Description
enabled	boolean	false	Value to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

fill

fill()

Getter for cell fill color.

Returns:

anychart.graphics.vector.Fill - Cell fill color.

fill(color)

Sets fill settings using an object, an array or a string. Learn more about coloring.

Params:

Name	Type	Default	Description
color	anychart.graphics.vector.Fill \| Array.<(anychart.graphics.vector.GradientKey\|string)>	null	Color as an object, an array or a string.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

fill(color, opacity)

Fill color with opacity. Fill as a string or an object.

Detailed description

Note: If color is set as a string (e.g. red .5) it has a priority over opt_opacity, which means: color set like this rect.fill(red 0.3, 0.7) will have 0.3 opacity.

Params:

Name	Type	Description
color	string	Color as a string.
opacity	number	Color opacity.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fill(keys, angle, mode, opacity)

Linear gradient fill. Learn more about coloring.

Params:

Name	Type	Description
keys	Array.<(anychart.graphics.vector.GradientKey\|string)>	Gradient keys.
angle	number	Gradient angle.
mode	boolean \| anychart.graphics.vector.Rect \| Object	Gradient mode.
opacity	number	Gradient opacity.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fill(keys, cx, cy, mode, opacity, fx, fy)

Radial gradient fill. Learn more about coloring.

Params:

Name	Type	Description
keys	Array.<(anychart.graphics.vector.GradientKey\|string)>	Color-stop gradient keys.
cx	number	X ratio of center radial gradient.
cy	number	Y ratio of center radial gradient.
mode	anychart.graphics.math.Rect	If defined then userSpaceOnUse mode, else objectBoundingBox.
opacity	number	Opacity of the gradient.
fx	number	X ratio of focal point.
fy	number	Y ratio of focal point.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fill(imageSettings)

Image fill. Learn more about coloring.

Params:

Name	Type	Description
imageSettings	anychart.graphics.vector.Fill	Object with settings.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fontColor

fontColor()

Getter for the text font color.

Returns:

string - Font color.

fontColor(color)

Setter for the text font color. https://www.w3schools.com/html/html_colors.asp

Params:

Name	Type	Description
color	string	Font color to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fontDecoration

fontDecoration()

Getter for the text font decoration.

Returns:

anychart.graphics.vector.Text.Decoration | string - Font decoration.

fontDecoration(type)

Setter for the text font decoration.

Params:

Name	Type	Default	Description
type	anychart.graphics.vector.Text.Decoration \| string	anychart.graphics.vector.Text.Decoration#NONE	Font decoration to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fontFamily

fontFamily()

Getter for the font family.

Returns:

string - Font family.

fontFamily(family)

Setter for the font family.

Params:

Name	Type	Description
family	string	Font family to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fontOpacity

fontOpacity()

Getter for the text font opacity.

Returns:

number - Font opacity.

fontOpacity(opacity)

Setter for the text font opacity. Double value from 0 to 1.

Params:

Name	Type	Default	Description
opacity	number	1	Font opacity to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

Name	Type	Description
size	string \| number	Font size to set.

fontStyle

fontStyle()

Getter for the text font style.

Returns:

anychart.graphics.vector.Text.FontStyle | string - Font style.

fontStyle(style)

Setter for the text font style.

Params:

Name	Type	Default	Description
style	anychart.graphics.vector.Text.FontStyle \| string	anychart.graphics.vector.Text.FontStyle#NORMAL	Font style to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fontVariant

fontVariant()

Getter for the text font variant.

Returns:

anychart.graphics.vector.Text.FontVariant | string - Font variant.

fontVariant(type)

Setter for the text font variant.

Params:

Name	Type	Default	Description
type	anychart.graphics.vector.Text.FontVariant \| string	anychart.graphics.vector.Text.FontVariant#NORMAL	Font variant to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

fontWeight

fontWeight()

Getter for the text font weight.

Returns:

string | number - Font weight.

fontWeight(weight)

Setter for the text font weight. https://www.w3schools.com/cssref/pr_font_weight.asp

Params:

Name	Type	Description
weight	string \| number	Value to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

getBounds

getBounds()

Returns cell bounds without padding counted (bounds which are used for borders drawing).

Detailed description

Works only after anychart.core.ui.Table#draw is called.

Returns:

anychart.math.Rect - Cell bounds.

Try it:

Usage sample

getCol

getCol()

Returns cell column instance.

Returns:

anychart.core.ui.table.Column - Cell column instance.

Try it:

Usage sample

getColNum

getColNum()

Returns cell column number.

Returns:

number - Cell column number.

Try it:

Usage sample

getRow

getRow()

Returns cell row instance.

Returns:

anychart.core.ui.table.Row - Cell row instance.

Try it:

Usage sample

getRowNum

getRowNum()

Returns cell row number.

Returns:

number - Cell row number.

Try it:

Usage sample

hAlign

hAlign()

Getter for the text horizontal align.

Returns:

anychart.graphics.vector.Text.HAlign | string - Text horizontal align.

See listing

var hAlign = cell.hAlign();

hAlign(align)

Setter for the text horizontal align.

Params:

Name	Type	Default	Description
align	anychart.graphics.vector.Text.HAlign \| string	anychart.graphics.vector.Text.HAlign#START	Horizontal align to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

letterSpacing

letterSpacing()

Getter for the text letter spacing.

Returns:

string | number - The letter spacing.

letterSpacing(spacing)

Setter for the text letter spacing. https://www.w3schools.com/cssref/pr_text_letter-spacing.asp

Params:

Name	Type	Description
spacing	string \| number	Letter spacing to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

lineHeight

lineHeight()

Getter for the text line height.

Returns:

string | number - Text line height.

lineHeight(height)

Setter for the text line height. https://www.w3schools.com/cssref/pr_text_letter-spacing.asp

Params:

Name	Type	Description
height	string \| number	Line height to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Try it:

Usage sample

padding

padding()

Getter for padding settings.

Detailed description

Also, you can use anychart.core.ui.table.Padding#bottom, anychart.core.ui.table.Padding#left, anychart.core.ui.table.Padding#right, anychart.core.ui.table.Padding#top methods to setting paddings.

Returns:

anychart.core.ui.table.Padding - Padding settings.

Try it:

Usage sample

padding(padding)

Setter for cell paddings in pixels using a single value.

Params:

Name	Type	Description
padding	null \| Array.<(number\|string)> \| Object	Cell padding to set.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Examples for paddings

// all paddings 15px
cell.padding(15);
// all paddings 15px
cell.padding('15px');
// top and bottom 5px ,right and left 15px
cell.padding(anychart.utils.padding(5,15));

Try it:

Usage sample

padding(value1, value2, value3, value4)

Setter for cell paddings in pixels using several numbers.

Params:

Name	Type	Description
value1	string \| number	Top or top-bottom space.
value2	string \| number	Right or right-left space.
value3	string \| number	Bottom space.
value4	string \| number	Left space.

Returns:

anychart.core.ui.table.Cell - Self instance for method chaining.

Examples for paddings

// 1) top and bottom 10px, left and right 15px
cell.padding(10, '15px');
// 2) top 10px, left and right 15px, bottom 5px
cell.padding(10, '15px', 5);
// 3) top 10px, right 15px, bottom 5px, left 12px
cell.padding(10, '15px', '5px', 12);

Try it: