A utility class that provides text size measurement and text placement functionality, for instance, for label rendering and measurement for the implementation of ILabelStyleRenderer.
Inheritance Hierarchy
TextRenderSupport
Remarks
This class cannot be instantiated
Type Details
- yFiles module
- view
Static Methods
addText
(targetElement: SVGGElement | SVGTextElement, text: string, font: Font, maximumSize?: Size, wrapping?: TextWrapping, measurePolicy?: TextMeasurePolicy, rightToLeft?: boolean, shape?: GeneralPath) : stringAdd the text content to the provided SVG text element.
Parameters
options - Object
A map of options to pass to the method.
A map of options to pass to the method.
- targetElement - SVGGElement | SVGTextElement
- An SVG element to add the provided text to. When using
rightToLeft, it is expected asSVGGElementotherwise asSVGTextElement. - text - string
- The text content to add to the provided text element (may contain newline characters).
- font - Font
- The Font that defines the font properties to apply to the added text.
- maximumSize - Size
- The bounds that shouldn't be exceeded when placing the text. This only has an effect when a
measurePolicyother than NONE is provided. Note that if the height is too small for a single line, no text will be drawn at all. When omitted, the default is an unlimited size. - wrapping - TextWrapping
- The TextWrapping policy to apply when the text exceeds the provided
maximumSize. When omitted, the default is TRIM_CHARACTER_ELLIPSIS. - measurePolicy - TextMeasurePolicy
- The measure policy to use for measuring the size of the text. When omitted, the default is AUTOMATIC.
- rightToLeft - boolean
- Whether to use right-to-left text direction.
- shape - GeneralPath
- A convex shape where the text lines shall be placed in. The shape is translated to (0/0) and may be cut if its bounds exceed the
maximumSize.
Returns
- ↪string
- The text that was actually placed in the
targetElement.
Examples
// wraps the given text at the maximum width, between words if possible and takes as much vertical space as needed
TextRenderSupport.addText({
targetElement: textElement,
text: text,
font: font,
wrapping: TextWrapping.WRAP_WORD,
maximumSize: new Size(30, Infinity),
})const lineHeight = TextRenderSupport.measureText({
text: text,
font: font,
}).height
TextRenderSupport.addText({
targetElement: textElement,
text: text,
font: font,
wrapping: TextWrapping.WRAP_CHARACTER_ELLIPSIS,
maximumSize: new Size(40, lineHeight),
})// wraps the given text at the maximum width, between words if possible and cuts it off at a maximum size
TextRenderSupport.addText({
targetElement: textElement,
text: text,
font: font,
wrapping: TextWrapping.WRAP_WORD,
maximumSize: new Size(30, 60),
})Resets the cache that stores for a Font which actual TextMeasurePolicy is used if AUTOMATIC is set.
Remarks
The AUTOMATIC policy is used in particular by LabelStyle.
Explicitly resetting the cache is usually not necessary. However, it may be necessary if custom CSS rules that affect text measurement are added to the web page after the text measurement policy is already selected.
Parameters
options - Object
A map of options to pass to the method.
A map of options to pass to the method.
- specificTypeface - Font
See Also
measureText
(text: string, font: Font, maximumSize?: Size, wrapping?: TextWrapping, measurePolicy?: TextMeasurePolicy) : SizeCalculates the width and height required to render the provided text using the provided Font, taking text-wrapping into account.
Remarks
The resulting height is calculated using the maximum height for the largest glyph in the provided font, irrespective of the actual text. I.e. '_' and 'I' are assumed to be of the same height.
Parameters
options - Object
A map of options to pass to the method.
A map of options to pass to the method.
- text - string
- The text that should be measured.
- font - Font
- The Font to apply to the text before measuring.
- maximumSize - Size
- The bounds that shouldn't be exceeded when placing the text. When omitted, the default is an unlimited size.
- wrapping - TextWrapping
- The TextWrapping policy to apply when the text exceeds the provided
maximumSize. When omitted, the default is NONE. - measurePolicy - TextMeasurePolicy
- The measure policy to use for measuring the size of the text; AUTOMATIC per default.
Returns
- ↪Size
- The size of the measured text.
Examples
// Measures the size a text element with this text and font would require.
const size = TextRenderSupport.measureText({
text: 'some text',
font: font,
})// Measures the size a text element with this text and font would require if it were word wrapped at the given width.
TextRenderSupport.addText({
targetElement: textElement,
text: 'some text',
font: font,
wrapping: TextWrapping.WRAP_WORD,
maximumSize: new Size(60, Infinity),
})// Measures the size a text element with this text and font would require if it were word wrapped at the given width and cut off at the maximum height.
// This takes the size of the text ellipsis into account (if any)
TextRenderSupport.addText({
targetElement: textElement,
text: 'a very long text, longer than what would fit into 30*50',
font: font,
wrapping: TextWrapping.WRAP_CHARACTER_ELLIPSIS,
maximumSize: new Size(30, 50),
})