Text
A Text
shape is used to display plain text; see Equation
for mathematical expressions. The Text
shape supports many of the same attributes as SVG text. Note that by default, all text is centered vertically and horizontally, via the textAnchor
and alignmentBaseline
fields (which can be changed to left, bottom, etc.).
The width and height of every Text
shape is automatically set to the width/height of its bounding box—you do not have to set these values. In fact, it is often convenient to use these values when defining other shapes. For instance, to draw a Rectangle
around an existing Text
shape called t
, you can set the rectangle's width/height/center fields to width: t.width
, height: t.height
, and center: t.center
. (Note that this rectangle will be properly centered on the text only if the text retains the default values textAnchor: middle
and alignmentBaseline: alphabetic
; changing these values may cause the two shapes to become misaligned).
Properties
Property | Type | Default |
---|---|---|
name | StrV | "defaultText" |
strokeWidth | FloatV | 0 |
strokeStyle | StrV | "solid" |
strokeColor | ColorV | none() |
strokeDasharray | StrV | "" |
fillColor | ColorV | |
width | FloatV | 0 |
height | FloatV | 0 |
ascent | FloatV | 0 |
descent | FloatV | 0 |
rotation | FloatV | 0 |
string | StrV | "defaultText" |
visibility | StrV | "" |
fontFamily | StrV | "sans-serif" |
fontSize | StrV | "12px" |
fontSizeAdjust | StrV | "" |
fontStretch | StrV | "" |
fontStyle | StrV | "" |
fontVariant | StrV | "" |
fontWeight | StrV | "" |
lineHeight | StrV | "" |
textAnchor | StrV | "middle" |
alignmentBaseline | StrV | "alphabetic" |
dominantBaseline | StrV | "alphabetic" |
ensureOnCanvas | BoolV | true |
center | VectorV | sampled |