module:Text

module:Text

Text class
text demo

Constructor

# new module:Text(positionDefinition, textopt, optionsopt)

Text constructor

Parameters:
Name Type Attributes Default Description
positionDefinition PositionDefinition

Top most point of the line start (depend on align option)

text String <optional>
""

Text to display

options TextOptions <optional>

Drawing options

Extends

Members

# (static) alignments :TextAlignments

Type:
  • TextAlignments

# (static) defaultOptions :TextOptions

Type:
  • TextOptions

# height

Height of the text

# height

Can't set text's height

# lines :Array.<String>

Type:
  • Array.<String>

# text

Returns the text

# text

Change the text

Examples
this.text = "Single line text";
this.text = "Multi\nLine text";
this.text = ["Multi", "Line text"];
this.text = ["Multi", "Line\ntext"];

# width

Width of the text

# width

Can't set text's width

# (inner, constant) measureText

Cache based text measurement

Methods

# (static) from(definition) → {Text}

Parameters:
Name Type Description
definition Object

Text definition

Returns:
Type
Text

# (static) getFontDefinition(options) → {String}

Return a font definition from a set of options

Parameters:
Name Type Description
options TextOptions

Chosen options

Returns:
Type
String

# (static) load(url) → {Promise.<String>}

Load a font URL

Parameters:
Name Type Description
url String | Array.<String>

URL or an array of URL to font files

Returns:

Promise for the generated font-family

Type
Promise.<String>

# (static) measure(text, optionsopt) → {TextMeasures}

Compute a text width and height

Parameters:
Name Type Attributes Description
text String | Array.<String>

Any text

options TextOptions <optional>

Options of the text

Returns:
Type
TextMeasures

# getAlignOffset() → {Number}

Return the position offset according to alignment

Returns:
Type
Number

# getMeasures() → {TextMeasures}

Measure the text with current options

Returns:
Type
TextMeasures

# makePath(ctx) → {Text}

Draw the text into a drawing context

Parameters:
Name Type Description
ctx CanvasRenderingContext2D

Drawing context

Returns:

Itself

Type
Text

# (inner) formatString(string) → {Array.<String>}

Reformat passed arguments into an array of line string

Parameters:
Name Type Description
string String | Array.<String>

Multiline string or Array of multiline strings to split

Returns:
Type
Array.<String>

Type Definitions

# TextAlignments

Type:
  • Object
Properties
Name Type Description
left String

The text is left-aligned.

right String

The text is right-aligned.

center String

The text is centered.

start String

The text is aligned at the normal start of the line. (regarding locales)

end String

The text is aligned at the normal end of the line. (regarding locales)

# TextMeasures

Type:
  • Object
Properties
Name Type Description
width Number

Horizontal size

height Number

Vertical size

# TextOptions

Type:
  • Object
Properties
Name Type Attributes Default Description
font String <optional>
"sans-serif"

Font to use (can be a URL)

fontSize Number <optional>
10

Size of the text in pixels

align String <optional>
Text.alignments.start

Text horizontal alignment

bold Boolean <optional>
false

Use bold font-weight

italic Boolean <optional>
false

Use italic font-style

underscore Boolean <optional>
false

Draw a line under the text

lineHeight Number <optional>
1

Ratio of line height (1 is normal, 2 is twice the space)